Apps item layout changed.(ViewCell, relativelayout)
authorjjie.choi <jjie.choi@samsung.com>
Tue, 9 May 2017 03:32:37 +0000 (12:32 +0900)
committerChulSeung Kim <charles0.kim@samsung.com>
Thu, 8 Jun 2017 09:34:55 +0000 (18:34 +0900)
Change-Id: I94195d7c4ed3fc4c0df6ffbada0e9d39799df55a
Signed-off-by: jjie.choi <jjie.choi@samsung.com>
TVApps/TVApps/Controls/AppItemCell.xaml
TVApps/TVApps/Controls/AppItemCell.xaml.cs
TVApps/TVApps/Controls/AppListView.xaml
TVApps/TVApps/Controls/AppListView.xaml.cs
TVApps/TVApps/ViewModels/AppsHolder.cs

index 4183778..ce640a3 100755 (executable)
@@ -1,36 +1,32 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<ViewCell xmlns="http://xamarin.com/schemas/2014/forms"
-          xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-          xmlns:Control="clr-namespace:TVApps.Controls"
-          x:Class="TVApps.Controls.AppItemCell">
-
-    <RelativeLayout x:Name="IconLayout">
-        <Image x:Name="ButtonImage"
-               RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.4795}"
-               RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.6833}"
-               RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.2923}"
-               RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.1583}"
-               Source="{Binding CurrentStateDescription.IconPath}" />
-        <Image x:Name="DimImage"
-               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_dimmed_check.png"
-               Opacity="0"
-               Scale="0" />
-      <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}"
-              RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
-              RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.8244}">
-            <Grid.RowDefinitions>
+<Grid xmlns="http://xamarin.com/schemas/2014/forms"
+      xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+      xmlns:Control="clr-namespace:TVApps.Controls"
+      x:Class="TVApps.Controls.AppItemCell"
+      AppDescription ="{Binding CurrentStateDescription}"
+      IsPinned="{Binding IsPinned}"
+      IsChecked="{Binding IsChecked}"
+      IsShowOptions="{Binding IsShowOptions}"
+      IsDim="{Binding IsDim}"
+      IsFocused="{Binding IsFocused}"
+      PinCommand="{Binding OptionMenuPinToggleCommand}"
+      DeleteCommand="{Binding OptionMenuDeleteCommand}"
+      ToDefaultCommand="{Binding ToDefaultCommand}">
+    <Image x:Name="ButtonImage"
+           Source=""
+           VerticalOptions="Start"/>
+    <Image x:Name="DimImage"
+           VerticalOptions="Start"
+           Source="img_apps_list_dimmed_75.png"
+           Opacity="0"
+           Scale="0" />
+    <Image x:Name="StrokeImage"
+           VerticalOptions="Start"
+           Source="img_apps_list_stroke.png"
+           Opacity="0" />
+    <Grid x:Name="TextArea"
+          VerticalOptions="Start">
+        <Grid.RowDefinitions>
                 <RowDefinition Height="6*" />
                 <RowDefinition Height="18*" />
                 <RowDefinition Height="8*" />
                    HorizontalTextAlignment="Center"
                    VerticalTextAlignment="End"
                    FontFamily="BreezeSans"
-                   Text="{Binding CurrentStateDescription.Label}" />
+                   Text="" />
             <BoxView Grid.Row="1"
                      Grid.Column="3"
                      Opacity="0" />
         </Grid>
 
         <!-- TODO: This BoxView is temporary code for Long Press test -->
-        <BoxView x:Name="ItemDim"
-                 Color="Black"
-                 Opacity="0.0"
-                 RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.7369}"
-                 RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
-                 RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.2631}"/>
+    <BoxView x:Name="ItemDim"
+             VerticalOptions="Start"
+             Color="Black"
+             Opacity="0.0"/>
 
-        <Button x:Name = "ButtonFocusArea"
-                RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"
-                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
-                Focused="OnFocused"
-                Unfocused="OnUnFocused"
-                Clicked="OnClicked"
-                Opacity="0" />
-    </RelativeLayout>
-</ViewCell>
+    <Button x:Name = "ButtonFocusArea"
+            Focused="OnFocused"
+            Unfocused="OnUnFocused"
+            Clicked="OnClicked"
+            Opacity="0" />
+</Grid>
 
index e6680f9..1f08323 100755 (executable)
@@ -24,6 +24,7 @@ using Tizen.Xamarin.Forms.Extension;
 
 namespace TVApps.Controls
 {
+    using LibTVRefCommonPortable.DataModels;
     using Tizen = Xamarin.Forms.PlatformConfiguration.Tizen;
     /// <summary>
     /// A enumeration for AppItemCell icon size
@@ -37,7 +38,7 @@ namespace TVApps.Controls
     /// <summary>
     /// A custom control for AppListView item template
     /// </summary>
-    public partial class AppItemCell : ViewCell
+    public partial class AppItemCell : Grid
     {
         /// <summary>
         /// A command will be executed if the button is clicked
@@ -143,31 +144,32 @@ namespace TVApps.Controls
             set { SetValue(ToDefaultCommandProperty, value); }
         }
 
-        /// <summary>
-        /// 2 px height size
-        /// </summary>
-        private int height2 = SizeUtils.GetHeightSize(2);
 
-        /// <summary>
-        /// 19 px height size
-        /// </summary>
-        private int height19 = SizeUtils.GetHeightSize(19);
+        public static readonly BindableProperty AppDescriptionProperty = BindableProperty.Create("AppDescription", typeof(StateDescription), typeof(AppItemCell));
 
-        /// <summary>
-        /// 28 px height size
-        /// </summary>
-        private int height28 = SizeUtils.GetHeightSize(28);
+        public StateDescription AppDescription
+        {
+            get { return (StateDescription)GetValue(AppDescriptionProperty); }
+            set { SetValue(AppDescriptionProperty, value); }
+        }
 
-        /// <summary>
-        /// 90 px height size
-        /// </summary>
-        private int height90 = SizeUtils.GetHeightSize(90);
+        private int height16 = SizeUtils.GetHeightSize(16);
+
+        private int height32 = SizeUtils.GetHeightSize(32);
+
+        private int height84 = SizeUtils.GetHeightSize(84);
+
+        private int height100 = SizeUtils.GetHeightSize(100);
 
         /// <summary>
         /// 144 px height size
         /// </summary>
         private int height144 = SizeUtils.GetHeightSize(144);
 
+        private int height284 = SizeUtils.GetHeightSize(284);
+
+        private int height300 = SizeUtils.GetHeightSize(300);
+
         private bool isPopupShowing = false;
 
         /// <summary>
@@ -177,15 +179,44 @@ namespace TVApps.Controls
         public AppItemCell()
         {
             InitializeComponent();
-
-            // TODO : set proper size
-            IconLayout.WidthRequest = SizeUtils.GetWidthSize(240);
-            // TODO : set proper size
-            IconLayout.HeightRequest = SizeUtils.GetHeightSize(342);
-            ButtonTitle.FontSize = SizeUtils.GetFontSize(25);
+            InitializeSize();
 
             ButtonTitle.PropertyChanged += ButtonTitlePropertyChanged;
             PropertyChanged += AppItemCellPropertyChanged;
+
+        }
+
+        private void InitializeSize()
+        {
+            int Width240 = SizeUtils.GetWidthSize(240);
+            int Height332 = SizeUtils.GetHeightSize(332);
+            int Width164 = SizeUtils.GetWidthSize(164);
+
+            WidthRequest = Width240;
+            HeightRequest = Height332;
+
+            ButtonImage.WidthRequest = Width164;
+            ButtonImage.HeightRequest = Width164;
+            ButtonImage.TranslationY = height100;
+
+
+            DimImage.WidthRequest = Width164;
+            DimImage.HeightRequest = Width164;
+            DimImage.TranslationY = height100;
+
+            StrokeImage.WidthRequest = Width164;
+            StrokeImage.HeightRequest = Width164;
+            StrokeImage.TranslationY = height100;
+
+            TextArea.WidthRequest = Width240;
+            TextArea.HeightRequest = height32;
+            TextArea.TranslationY = height284;
+            ButtonTitle.FontSize = SizeUtils.GetFontSize(28);
+            ItemDim.WidthRequest = Width164;
+            ItemDim.HeightRequest = Width164;
+
+            ButtonFocusArea.WidthRequest = Width240;
+            ButtonFocusArea.HeightRequest = Height332;
         }
 
         /// <summary>
@@ -207,32 +238,31 @@ namespace TVApps.Controls
                 // TODO : Change Animation (Add Pin Contents Item : Unselected)
                 if (IsFocused)
                 {
-                    View.AbortAnimation("CheckedAnimation");
-                    View.Animate("CheckedAnimation", (v) =>
+                    this.AbortAnimation("CheckedAnimation");
+                    this.Animate("CheckedAnimation", (v) =>
                     {
-                        var scale = 1.32 - (0.22) * v;
-                        var translationY = 28 - (11) * v;
+                        var scale = 1.195 - (0.22) * v;
+                        var translationY = height300 - (11) * v;
                         ButtonImage.Scale = scale;
                         TextArea.TranslationY = translationY;
                     },
                     length: 150,
                     finished: (a, b) =>
                     {
-                        ButtonImage.ScaleTo(1.32, 150);
-                        TextArea.TranslateTo(0.0, height28, 150);
+                        ButtonImage.ScaleTo(1.195, 150);
+                        TextArea.TranslateTo(0.0, height300, 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);
+                        StrokeImage.ScaleTo((IsChecked) ? 1.195 : 0.0, 300);
+                        DimImage.ScaleTo((IsChecked) ? 1.195 : 0.0, 300);
                     });
                 }
                 else
                 {
                     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);
+                    DimImage.ScaleTo((IsChecked) ? 1.195 : 0.0, 300);
+                    TextArea.TranslateTo(0.0, height284, 300);
                 }
 
                 return;
@@ -246,6 +276,11 @@ namespace TVApps.Controls
             {
                 ItemDim.FadeTo((IsDim) ? 0.5 : 0.0, 100);
             }
+            else if(e.PropertyName.CompareTo("AppDescription") == 0)
+            {
+                ButtonImage.Source = AppDescription.IconPath;
+                ButtonTitle.Text = AppDescription.Label;
+            }
         }
 
         /// <summary>
@@ -254,9 +289,8 @@ 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, 167);
-            ButtonImage.TranslateTo(0.0, (size == IconSize.Normal) ? 0.0 : height2, 167);
-            TextArea.TranslateTo(0.0, (size == IconSize.Normal) ? 0.0 : height19, 167);
+            ButtonImage.ScaleTo((size == IconSize.Normal) ? 1.0 : 1.195, 167);
+            TextArea.TranslateTo(0.0, (size == IconSize.Normal) ? height284 : height300, 167);
         }
 
         /// <summary>
@@ -265,10 +299,10 @@ 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.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);
+            ButtonImage.ScaleTo((isShow) ? 1 : 1.195, 167);
+            ButtonImage.TranslateTo(0, (isShow) ? 0 : height84, 334);
+            TextArea.TranslateTo(0, (isShow) ? height300 : height284, 167);
+            TextArea.FadeTo((isShow) ? 0.0 : 0.99, 50);
 
             if (isShow)
             {
@@ -335,10 +369,9 @@ namespace TVApps.Controls
 
                 isPopupShowing = false;
                 ShowOptionMenu(false);
-                View.Focus();
             };
 
-            popup.Show(this.View, this.View.Width / 2, this.View.Height - height144);
+            popup.Show(this, this.Width / 2, this.Height - height144);
             isPopupShowing = true;
         }
 
@@ -380,9 +413,8 @@ namespace TVApps.Controls
 
             if (IsChecked)
             {
-                DimImage.ScaleTo(1.34, 167);
-                StrokeImage.ScaleTo(1.34, 167);
-                DimImage.TranslateTo(0.0, height2, 167);
+                DimImage.ScaleTo(1.195, 167);
+                StrokeImage.ScaleTo(1.195, 167);
             }
 
             if (!IsShowOptions)
@@ -409,9 +441,8 @@ namespace TVApps.Controls
 
             if (IsChecked)
             {
-                DimImage.ScaleTo(1.1, 167);
-                DimImage.TranslateTo(0.0, 0.0, 167);
-                StrokeImage.ScaleTo(1.1, 167);
+                DimImage.ScaleTo(1.0, 167);
+                StrokeImage.ScaleTo(1.0, 167);
             }
         }
     }
index 1cd1e85..ddb51ca 100755 (executable)
                     RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0}">
 
         <StackLayout x:Name="AppUpperList"
-                     RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.5197}"
+                     RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.541}"
                      RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0}"
                      RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0}"
                      Orientation="Horizontal"
                      HorizontalOptions="Start"/>
 
         <StackLayout x:Name="AppLowerList"
-                     RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.5197}"
-                     RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToView, ElementName=AppUpperList, Property=Height, Factor=0.8}"
+                     RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.541}"
+                     RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.459}"
                      RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0}"
                      Orientation="Horizontal"
                      HorizontalOptions="Start"/>
index 1fc20a5..94a3017 100755 (executable)
@@ -164,16 +164,8 @@ namespace TVApps.Controls
 
             foreach (var item in ItemsSource)
             {
-                var viewCell = ItemTemplate.CreateContent() as AppItemCell;
-                viewCell.View.BindingContext = item;
-                viewCell.SetBinding(AppItemCell.IsPinnedProperty, new Binding("BindingContext.IsPinned", source: viewCell.View));
-                viewCell.SetBinding(AppItemCell.IsCheckedProperty, new Binding("BindingContext.IsChecked", source: viewCell.View));
-                viewCell.SetBinding(AppItemCell.IsShowOptionsProperty, new Binding("BindingContext.IsShowOptions", source: viewCell.View));
-                viewCell.SetBinding(AppItemCell.IsDimProperty, new Binding("BindingContext.IsDim", source: viewCell.View));
-                viewCell.SetBinding(AppItemCell.IsFocusedProperty, new Binding("BindingContext.IsFocused", mode: BindingMode.TwoWay, source: viewCell.View));
-                viewCell.SetBinding(AppItemCell.PinCommandProperty, new Binding("BindingContext.OptionMenuPinToggleCommand", source: viewCell.View));
-                viewCell.SetBinding(AppItemCell.DeleteCommandProperty, new Binding("BindingContext.OptionMenuDeleteCommand", source: viewCell.View));
-                viewCell.SetBinding(AppItemCell.ToDefaultCommandProperty, new Binding("BindingContext.ToDefaultCommand", source: viewCell.View));
+                var viewCell = new AppItemCell();
+                viewCell.BindingContext = item;
                 viewCell.OnClickedCommand = new Command(() =>
                 {
                     item.DoAction();
@@ -186,11 +178,11 @@ namespace TVApps.Controls
 
                 if (AppCount % 2 == 0)
                 {
-                    AppUpperList.Children.Add(viewCell.View);
+                    AppUpperList.Children.Add(viewCell);
                 }
                 else
                 {
-                    AppLowerList.Children.Add(viewCell.View);
+                    AppLowerList.Children.Add(viewCell);
                 }
 
                 AppCount = AppCount + 1;
index c41a961..2fc9ded 100755 (executable)
@@ -18,6 +18,7 @@ using LibTVRefCommonPortable.DataModels;
 using LibTVRefCommonPortable.Utils;
 using System.Collections.Generic;
 using System.Linq;
+using System.Threading;
 using System.Threading.Tasks;
 using Xamarin.Forms;
 
@@ -75,8 +76,11 @@ namespace TVApps.ViewModels
             {
                 SetApps();
             });
+            SynchronizationContext.Current.Post((o) =>
+            {
+                SetApps();
+            }, "");
 
-            SetApps();
         }
 
         /// <summary>