From: Hyerim Kim <rimi.kim@samsung.com>
Date: Tue, 25 Apr 2017 10:32:36 +0000 (+0900)
Subject: Implements Apps according to UI/GUI guideline v0.51
X-Git-Tag: submit/tizen/20170808.015446~81
X-Git-Url: http://review.tizen.org/git/?a=commitdiff_plain;h=16ff2f652c809310b48bb9c7825162e4f7f660c5;p=profile%2Ftv%2Fapps%2Fdotnet%2Fhome.git

Implements Apps according to UI/GUI guideline v0.51
 - Add Header Area : Additional Information
 - Changes resource when apps list icon is selected.

Change-Id: Ida1e066d803906f8c4eff76adaafe9f034b8ddd1
Signed-off-by: Hyerim Kim <rimi.kim@samsung.com>
---

diff --git a/TVApps/TVApps/Controls/AppItemCell.xaml b/TVApps/TVApps/Controls/AppItemCell.xaml
index 9c55546..d89ffdb 100755
--- a/TVApps/TVApps/Controls/AppItemCell.xaml
+++ b/TVApps/TVApps/Controls/AppItemCell.xaml
@@ -16,15 +16,15 @@
                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToView, ElementName=ButtonImage, Property=Width, Factor=1}"
                RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.2923}"
                RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.1583}"
-               Source="img_tizen_apps_list_dimmed_check.png"
+               Source="img_apps_list_dimmed_check.png"
                Opacity="0"
                Scale="0" />
-        <Image x:Name="CheckImage"
-               RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToView, ElementName=ButtonImage, Property=Height, Factor=0.5853}"
-               RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToView, ElementName=ButtonImage, Property=Width, Factor=0.5853}"
-               RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.3918}"
-               RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.3}"
-               Source="ic_apps_launcher_pinmark.png"
+      <Image x:Name="StrokeImage"
+               RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToView, ElementName=ButtonImage, Property=Height, Factor=1}"
+               RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToView, ElementName=ButtonImage, Property=Width, Factor=1}"
+               RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.2923}"
+               RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.1583}"
+               Source="img_apps_list_stroke.png"
                Opacity="0" />
         <Grid x:Name="TextArea"
               RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.0936}"
diff --git a/TVApps/TVApps/Controls/AppItemCell.xaml.cs b/TVApps/TVApps/Controls/AppItemCell.xaml.cs
index 523bd42..2018e33 100755
--- a/TVApps/TVApps/Controls/AppItemCell.xaml.cs
+++ b/TVApps/TVApps/Controls/AppItemCell.xaml.cs
@@ -121,6 +121,11 @@ namespace TVApps.Controls
         /// </summary>
         private int height2 = SizeUtils.GetHeightSize(2);
 
+        /// <summary>
+        /// 19 px height size
+        /// </summary>
+        private int height19 = SizeUtils.GetHeightSize(19);
+
         /// <summary>
         /// 28 px height size
         /// </summary>
@@ -188,15 +193,16 @@ namespace TVApps.Controls
                     {
                         ButtonImage.ScaleTo(1.32, 150);
                         TextArea.TranslateTo(0.0, height28, 150);
-                        CheckImage.FadeTo((IsChecked) ? 0.99 : 0.0, 150);
+                        StrokeImage.FadeTo((IsChecked) ? 0.99 : 0.0, 150);
                         DimImage.FadeTo((IsChecked) ? 0.99 : 0.0, 150);
                         DimImage.TranslateTo(0.0, (IsChecked) ? height2 : 0.0, 150);
+                        StrokeImage.ScaleTo((IsChecked) ? 1.34 : 0.0, 300);
                         DimImage.ScaleTo((IsChecked) ? 1.34 : 0.0, 300);
                     });
                 }
                 else
                 {
-                    CheckImage.FadeTo((IsChecked) ? 0.99 : 0.0, 300);
+                    StrokeImage.FadeTo((IsChecked) ? 0.99 : 0.0, 300);
                     DimImage.FadeTo((IsChecked) ? 0.99 : 0.0, 300);
                     DimImage.TranslateTo(0.0, (IsChecked) ? height2 : 0.0, 300);
                     DimImage.ScaleTo((IsChecked) ? 1.34 : 0.0, 300);
@@ -221,9 +227,9 @@ namespace TVApps.Controls
         /// <param name="size">IconSize for change scale and position</param>
         public void ChangeIconSize(IconSize size)
         {
-            ButtonImage.ScaleTo((size == IconSize.Normal) ? 1.0 : 1.32, 50);
-            ButtonImage.TranslateTo(0.0, (size == IconSize.Normal) ? 0.0 : height2, 100);
-            TextArea.TranslateTo(0.0, (size == IconSize.Normal) ? 0.0 : height28, 50);
+            ButtonImage.ScaleTo((size == IconSize.Normal) ? 1.0 : 1.32, 167);
+            ButtonImage.TranslateTo(0.0, (size == IconSize.Normal) ? 0.0 : height2, 167);
+            TextArea.TranslateTo(0.0, (size == IconSize.Normal) ? 0.0 : height19, 167);
         }
 
         /// <summary>
@@ -232,10 +238,11 @@ namespace TVApps.Controls
         /// <param name="isShow">A flag indicates whether the option menu should be showed or not</param>
         public void ShowOptionMenu(bool isShow)
         {
-            ButtonImage.TranslateTo(0, (isShow) ? -height90 : 0, 100);
-            TextArea.TranslateTo(0, (isShow) ? -height90 : 0, 100);
+            ButtonImage.ScaleTo((isShow) ? 1 : 1.32, 167);
+            ButtonImage.TranslateTo(0, (isShow) ? -height90 : 0, 334);
+            TextArea.TranslateTo(0, (isShow) ? -height19 : height19, 167);
             TextArea.FadeTo((isShow) ? 0.0 : 0.99, 100);
-            OptionMenuArea.TranslateTo(0, (isShow) ? -height144 : 0, 100);
+            OptionMenuArea.TranslateTo(0, (isShow) ? -height144 : 0, 334);
             OptionMenuPinToggleButton.IsEnabled = (isShow) ? true : false;
             OptionMenuDeleteButton.IsEnabled = (isShow) ? true : false;
         }
@@ -275,16 +282,16 @@ namespace TVApps.Controls
 
             OnFocusedCommand?.Execute("");
 
-            if (!IsShowOptions)
+            if (IsChecked)
             {
-                ChangeIconSize(IconSize.Focused);
+                DimImage.ScaleTo(1.34, 167);
+                StrokeImage.ScaleTo(1.34, 167);
+                DimImage.TranslateTo(0.0, height2, 167);
             }
 
-            if (IsChecked)
+            if (!IsShowOptions)
             {
-                DimImage.ScaleTo(1.34, 300);
-                DimImage.TranslateTo(0.0, height2, 300);
-                CheckImage.TranslateTo(0.0, height2, 300);
+                ChangeIconSize(IconSize.Focused);
             }
         }
 
@@ -305,9 +312,9 @@ namespace TVApps.Controls
 
             if (IsChecked)
             {
-                DimImage.ScaleTo(1.1, 300);
-                DimImage.TranslateTo(0.0, 0.0, 300);
-                CheckImage.TranslateTo(0.0, 0.0, 300);
+                DimImage.ScaleTo(1.1, 167);
+                DimImage.TranslateTo(0.0, 0.0, 167);
+                StrokeImage.ScaleTo(1.1, 167);
             }
         }
     }
diff --git a/TVApps/TVApps/ViewModels/AppsHolder.cs b/TVApps/TVApps/ViewModels/AppsHolder.cs
old mode 100644
new mode 100755
index 8858546..1e16964
--- a/TVApps/TVApps/ViewModels/AppsHolder.cs
+++ b/TVApps/TVApps/ViewModels/AppsHolder.cs
@@ -51,6 +51,9 @@ namespace TVApps.ViewModels
         /// </summary>
         public Dictionary<string, string> PinnedApps;
 
+        public string PinnedAppName;
+        public string UnpinnedAppName;
+
         /// <summary>
         /// A constructor
         /// Initializes installed and pinned app list
@@ -178,6 +181,8 @@ namespace TVApps.ViewModels
                 selectedApp.IsChecked = false;
                 selectedApp.IsPinned = false;
                 PinnedApps.Remove(appID);
+                UnpinnedAppName = selectedApp.CurrentStateDescription.Label;
+                ViewModel.OnPropertyChanged("UnpinnedAppName");
             }
             else
             {
@@ -185,6 +190,8 @@ namespace TVApps.ViewModels
                 selectedApp.IsChecked = true;
                 selectedApp.IsPinned = true;
                 PinnedApps.Add(appID, appID);
+                PinnedAppName = selectedApp.CurrentStateDescription.Label;
+                ViewModel.OnPropertyChanged("PinnedAppName");
             }
 
             UpdatePinnedApps();
@@ -414,7 +421,6 @@ namespace TVApps.ViewModels
             List<AppShortcutInfo> pinnedAppList = new List<AppShortcutInfo>();
             foreach (var item in PinnedApps)
             {
-                DebuggingUtils.Dbg("Pinned App : " + item.Key);
                 pinnedAppList.Add(new AppShortcutInfo()
                 {
                     AppID = item.Key,
diff --git a/TVApps/TVApps/ViewModels/MainPageViewModel.cs b/TVApps/TVApps/ViewModels/MainPageViewModel.cs
index 163bd59..050cf62 100755
--- a/TVApps/TVApps/ViewModels/MainPageViewModel.cs
+++ b/TVApps/TVApps/ViewModels/MainPageViewModel.cs
@@ -96,6 +96,22 @@ namespace TVApps.ViewModels
             set;
         }
 
+        public string PinnedAppName
+        {
+            get
+            {
+                return appsHolder.PinnedAppName;
+            }
+        }
+
+        public string UnpinnedAppName
+        {
+            get
+            {
+                return appsHolder.UnpinnedAppName;
+            }
+        }
+
         /// <summary>
         /// A command will be executed if the cancel button in FooterDeleteStatus is clicked
         /// </summary>
@@ -154,8 +170,14 @@ namespace TVApps.ViewModels
             }
         }
 
+        /// <summary>
+        /// Additional info font size
+        /// </summary>
         int addtionalInfoTextSize;
 
+        /// <summary>
+        /// Additional info font size
+        /// </summary>
         public int AddtionalInfoTextSize
         {
             get
@@ -169,6 +191,17 @@ namespace TVApps.ViewModels
             }
         }
 
+        /// <summary>
+        /// Additional info layout's spacing size
+        /// </summary>
+        public int AdditionalInfoSpacing
+        {
+            get
+            {
+                return SizeUtils.GetWidthSize(12);
+            }
+        }
+
         /// <summary>
         /// Regular text font size
         /// </summary>
diff --git a/TVApps/TVApps/Views/MainPage.xaml b/TVApps/TVApps/Views/MainPage.xaml
index 6f940f2..b191d31 100755
--- a/TVApps/TVApps/Views/MainPage.xaml
+++ b/TVApps/TVApps/Views/MainPage.xaml
@@ -11,7 +11,9 @@
              IsPinAppRequested="{Binding IsPinAppRequested}"
              DeletePopupAppLabel="{Binding DeletePopupAppLabel}"
              DeletePopupCommand="{Binding DeletePopupCommand}"
-             SumOfCheckedApp="{Binding SumOfCheckedApp}">
+             SumOfCheckedApp="{Binding SumOfCheckedApp}"
+             PinnedAppName="{Binding PinnedAppName}"
+             UnpinnedAppName="{Binding UnpinnedAppName}">
   <ContentPage.BindingContext>
     <ViewModels:MainPageViewModel />
   </ContentPage.BindingContext>
@@ -74,34 +76,28 @@
            Text="APPS"
            x:Name="TitleLabel"/>
 
-    <Grid Grid.Row="0" x:Name="AddtionalInfo" IsVisible="false">
-      <Grid.ColumnDefinitions>
-        <ColumnDefinition Width="50*" />
-        <ColumnDefinition Width="389*" />
-        <ColumnDefinition Width="122*" />
-        <ColumnDefinition Width="389*" />
-        <ColumnDefinition Width="50*" />
-      </Grid.ColumnDefinitions>
-      <Grid Grid.Row="0" Grid.Column="2" x:Name="AdditionalInfoText">
-        <Grid.ColumnDefinitions>
-          <ColumnDefinition Width="48*" />
-          <ColumnDefinition Width="52*" />
-        </Grid.ColumnDefinitions>
-        <Label Grid.Row="0" Grid.Column="0" x:Name="AdditionalInfoText1"
-            Style="{StaticResource AddionalInfoTextMedium}"
-            HorizontalTextAlignment="Center"
-            VerticalOptions="CenterAndExpand"
-            HorizontalOptions="CenterAndExpand"
-            FontSize="{Binding AddtionalInfoTextSize}" />
-        <Label Grid.Row="0" Grid.Column="1" x:Name="AdditionalInfoText2"
-            Style="{StaticResource AddionalInfoTextLight}"
-            HorizontalTextAlignment="Center"
-            VerticalOptions="CenterAndExpand"
-            HorizontalOptions="CenterAndExpand"
-            FontSize="{Binding AddtionalInfoTextSize}" />
-      </Grid>
-    </Grid>
-
+    <StackLayout Grid.Row="0"
+                 x:Name="AddtionalInfo"
+                 IsVisible="false"
+                 Orientation="Horizontal"
+                 HorizontalOptions="CenterAndExpand"
+                 Spacing="{Binding AdditionalInfoSpacing}">
+      <Label x:Name="AdditionalInfoText1"
+          Style="{StaticResource AddionalInfoTextMedium}"
+          HorizontalTextAlignment="Center"
+          VerticalOptions="CenterAndExpand"
+          FontSize="{Binding AddtionalInfoTextSize}" />
+      <Label Text="is"
+          Style="{StaticResource AddionalInfoTextLight}"
+          HorizontalTextAlignment="Center"
+          VerticalOptions="CenterAndExpand"
+          FontSize="{Binding AddtionalInfoTextSize}" />
+      <Label x:Name="AdditionalInfoText2"
+          Style="{StaticResource AddionalInfoTextLight}"
+          HorizontalTextAlignment="Center"
+          VerticalOptions="CenterAndExpand"
+          FontSize="{Binding AddtionalInfoTextSize}" />
+    </StackLayout>
 
     <Grid Grid.Row="0" x:Name="Header">
       <Grid.RowDefinitions>
diff --git a/TVApps/TVApps/Views/MainPage.xaml.cs b/TVApps/TVApps/Views/MainPage.xaml.cs
index 0fa0ccb..ad1693a 100755
--- a/TVApps/TVApps/Views/MainPage.xaml.cs
+++ b/TVApps/TVApps/Views/MainPage.xaml.cs
@@ -39,6 +39,7 @@ namespace TVApps.Views
         private DropdownList sortList;
         private Button doneButton;
         private Button cancelButton;
+        private static int pinnedAppCount = 0;
 
         /// <summary>
         /// SubPanel icon's transition height value when it focused.
@@ -129,8 +130,35 @@ namespace TVApps.Views
             set { SetValue(SumOfCheckedAppProperty, value); }
         }
 
+        /// <summary>
+        /// Identifies the PinnedAppName bindable property
+        /// </summary>
+        public static readonly BindableProperty PinnedAppNameProperty = BindableProperty.Create("PinnedAppName", typeof(string), typeof(MainPage), "");
 
-        private async void PlayHideAnimation()
+        /// <summary>
+        /// Gets or sets name of pinned app
+        /// </summary>
+        public string PinnedAppName
+        {
+            get { return (string)GetValue(PinnedAppNameProperty); }
+            set { SetValue(PinnedAppNameProperty, value); }
+        }
+
+        /// <summary>
+        /// Identifies the PinnedAppName bindable property
+        /// </summary>
+        public static readonly BindableProperty UnpinnedAppNameProperty = BindableProperty.Create("UnpinnedAppName", typeof(string), typeof(MainPage), "");
+
+        /// <summary>
+        /// Gets or sets name of unpinned app
+        /// </summary>
+        public string UnpinnedAppName
+        {
+            get { return (string)GetValue(UnpinnedAppNameProperty); }
+            set { SetValue(UnpinnedAppNameProperty, value); }
+        }
+
+        private void PlayHideAnimation()
         {
             var animation = new Animation();
             var headerAnimation = new Animation(v => Header.Opacity = v, 1, 0);
@@ -164,7 +192,8 @@ namespace TVApps.Views
             BackKeyInfoImage.HeightRequest = backKeyImageSize;
             BackKeyInfo.FontSize = SizeUtils.GetFontSize(28);
             BackKeyInfo.Margin = new Thickness(SizeUtils.GetWidthSize(6), 0, 0, 0);
-
+            AdditionalInfoText1.FontSize = SizeUtils.GetFontSize(32);
+            AdditionalInfoText2.FontSize = SizeUtils.GetFontSize(32);
 
             PropertyChanged += MainPagePropertyChanged;
             SetCurrentStatus(AppsStatus.Default);
@@ -200,6 +229,8 @@ namespace TVApps.Views
             await Task.Delay(1);
             AppList.InitializeFocus();
             MakeFocusChaining();
+
+            pinnedAppCount = SumOfCheckedApp;
         }
 
         private void MakeFocusChaining()
@@ -423,8 +454,23 @@ namespace TVApps.Views
             }
             else if (e.PropertyName.Equals("SumOfCheckedApp"))
             {
-                AdditionalInfoText1.Text = SumOfCheckedApp.ToString() + " Apps";
-                AdditionalInfoText2.Text = "Checked";
+                if (CurrentStatus == AppsStatus.Pin)
+                {
+                    AddtionalInfo.IsVisible = true;
+                    TitleLabel.IsVisible = false;
+                    if (pinnedAppCount > SumOfCheckedApp)
+                    {
+                        AdditionalInfoText1.Text = UnpinnedAppName;
+                        AdditionalInfoText2.Text = "Unpinned";
+                    }
+                    else
+                    {
+                        AdditionalInfoText1.Text = PinnedAppName;
+                        AdditionalInfoText2.Text = "Pinned";
+                    }
+
+                    pinnedAppCount = SumOfCheckedApp;
+                }
             }
         }
 
diff --git a/TVHome/TVHome.TizenTV/TVHome.TizenTV.csproj b/TVHome/TVHome.TizenTV/TVHome.TizenTV.csproj
index a1e47b9..29ffaa2 100755
--- a/TVHome/TVHome.TizenTV/TVHome.TizenTV.csproj
+++ b/TVHome/TVHome.TizenTV/TVHome.TizenTV.csproj
@@ -132,6 +132,7 @@
     <Content Include="res\img_apps_list_dimmed_85.9.png" />
     <Content Include="res\img_apps_list_dimmed_95.9.png" />
     <Content Include="res\img_apps_list_dimmed_check.png" />
+    <Content Include="res\img_apps_list_stroke.png" />
     <Content Include="res\img_home_list_dimmed_apps_60.png" />
     <Content Include="res\img_tizen_apps_list_dimmed.png" />
     <Content Include="res\img_tizen_apps_list_dimmed_check.png" />
diff --git a/TVHome/TVHome.TizenTV/res/img_apps_list_stroke.png b/TVHome/TVHome.TizenTV/res/img_apps_list_stroke.png
new file mode 100755
index 0000000..8730c81
Binary files /dev/null and b/TVHome/TVHome.TizenTV/res/img_apps_list_stroke.png differ