Change Panel and Panel Buttons
authorHeonjae Jang <heonjae.jang@samsung.com>
Fri, 3 Mar 2017 07:46:15 +0000 (16:46 +0900)
committerChulSeung Kim <charles0.kim@samsung.com>
Thu, 8 Jun 2017 09:34:45 +0000 (18:34 +0900)
1. Create Abstract Class "Panel"
2. ~Panel Generalize Panel
3. Change Animation Panel, Panel Buttons

Change-Id: I48d3ebbf9b9ba44699bed2fc511e889a8df4e368

14 files changed:
TVHome/TVHome/Controls/SubPanelButton.xaml
TVHome/TVHome/Controls/SubPanelButton.xaml.cs
TVHome/TVHome/Controls/SubPanelThumbnailButton.xaml.cs
TVHome/TVHome/Models/SettingShortcutFactory.cs
TVHome/TVHome/TVHome.csproj
TVHome/TVHome/Views/MainPage.xaml
TVHome/TVHome/Views/MainPage.xaml.cs
TVHome/TVHome/Views/MainPanel.xaml
TVHome/TVHome/Views/MainPanel.xaml.cs
TVHome/TVHome/Views/Panel.cs [new file with mode: 0644]
TVHome/TVHome/Views/SubPanel.xaml
TVHome/TVHome/Views/SubPanel.xaml.cs
TVHome/TVHome/Views/SubThumbnailPanel.xaml [new file with mode: 0644]
TVHome/TVHome/Views/SubThumbnailPanel.xaml.cs [new file with mode: 0644]

index 5da7f34cc54b21759ecc2b2bc465caac300e0d14..d238c9d25c86bbf3c5e7c2fc8dd7aefcb607c654 100644 (file)
@@ -3,7 +3,7 @@
                       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"\r
                       xmlns:Controls="clr-namespace:TVHome.Controls"\r
                       x:Class="TVHome.Controls.SubPanelButton">\r
-    <RelativeLayout Opacity="0.3">\r
+    <RelativeLayout Opacity="0.38">\r
         <BoxView x:Name = "ButtonBox"\r
                  RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"\r
                  RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.94}"\r
@@ -20,7 +20,7 @@
                RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.2}"\r
                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.94}"\r
                RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.8}"\r
-               Opacity="0"\r
+               Opacity="0.5"\r
                TextColor="White"\r
                LineBreakMode="TailTruncation"\r
                HorizontalTextAlignment="Center"\r
index 5d18a81a6213eeab45a6f01c7c7a81647eba47b8..bf923c3f5962359a6e36890153c6c3c5ea1525ef 100644 (file)
@@ -38,7 +38,7 @@ namespace TVHome.Controls
                 OnClickedCommand.Execute("");\r
             }\r
 \r
-            await View.FadeTo(0.9, 300);\r
+            await View.FadeTo(0.99, 300);\r
         }\r
 \r
         public override async void OnFocused(object sender, FocusEventArgs e)\r
@@ -50,17 +50,18 @@ namespace TVHome.Controls
 \r
 #pragma warning disable CS4014\r
             ButtonTitle.FadeTo(0.8, 300);\r
-            ButtonTitle.FadeTo(0.99, 300);\r
+            View.FadeTo(0.8, 300);\r
 #pragma warning restore CS4014\r
-            await View.FadeTo(0.6, 300);\r
+            await View.ScaleTo(1.3, 300);\r
         }\r
 \r
         public override async void OnUnfocused(object sender, FocusEventArgs e)\r
         {\r
 #pragma warning disable CS4014\r
-            ButtonTitle.FadeTo(0, 300);\r
+            ButtonTitle.FadeTo(0.6, 300);\r
+            View.FadeTo(0.6, 300);\r
 #pragma warning restore CS4014\r
-            await View.FadeTo(0.3, 300);\r
+            await View.ScaleTo(1, 300);\r
         }\r
     }\r
 }
\ No newline at end of file
index 8a3ce2707b49c06792810b4fcd2640a5cb07ac52..5e81e7764359609ac4fcc4ba6ef02f05ce5672c4 100644 (file)
@@ -63,9 +63,9 @@ namespace TVHome.Controls
             //Animation.Commit(ThumbnailTitle, "FocusedAnimation", 16, 300);
 
 #pragma warning disable CS4014
-            ThumbnailTitle.FadeTo(0.99, 300);
+            ThumbnailTitle.FadeTo(0.8, 300);
 #pragma warning restore CS4014
-            await View.FadeTo(0.6, 300);
+            await View.FadeTo(0.8, 300);
         }
 
         public override async void OnUnfocused(object sender, FocusEventArgs e)
@@ -85,9 +85,9 @@ namespace TVHome.Controls
             //Animation.Commit(ThumbnailTitle, "UnfocusedAnimation", 16, 300);
 
 #pragma warning disable CS4014
-            ThumbnailTitle.FadeTo(0, 300);
+            ThumbnailTitle.FadeTo(0.6, 300);
 #pragma warning restore CS4014
-            await View.FadeTo(0.3, 300);
+            await View.FadeTo(0.6, 300);
         }
     }
 }
\ No newline at end of file
index e9aaed356320624be8e076ef8276162f0e5ff641..00edc96881ebac2c2d0d26bb1b58b0adf3712856 100644 (file)
@@ -41,7 +41,7 @@ namespace TVHome.Models
                                 new StateDescription\r
                                 {\r
                                     Label = "WiFi ON",\r
-                                    IconPath = "wifion.png",\r
+                                    IconPath = "AppIcon.png",\r
                                     Action = new WiFiOffAction(),\r
                                 }\r
                             },\r
@@ -50,7 +50,7 @@ namespace TVHome.Models
                                 new StateDescription\r
                                 {\r
                                     Label = "WiFi OFF",\r
-                                    IconPath = "wifioff.png",\r
+                                    IconPath = "AppIcon.png",\r
                                     Action = new WiFiOnAction(),\r
                                 }\r
                             },\r
@@ -59,7 +59,7 @@ namespace TVHome.Models
                                 new StateDescription\r
                                 {\r
                                     Label = "WiFi Launch",\r
-                                    IconPath = "wifilaunch.png",\r
+                                    IconPath = "AppIcon.png",\r
                                     Action = new WiFiLaunchAction(),\r
                                 }\r
                             },\r
@@ -78,7 +78,7 @@ namespace TVHome.Models
                                 new StateDescription\r
                                 {\r
                                     Label = "BT ON",\r
-                                    IconPath = "bton.png",\r
+                                    IconPath = "AppIcon.png",\r
                                     Action = new BTOffAction(),\r
                                 }\r
                             },\r
@@ -87,7 +87,7 @@ namespace TVHome.Models
                                 new StateDescription\r
                                 {\r
                                     Label = "BT OFF",\r
-                                    IconPath = "btoff.png",\r
+                                    IconPath = "AppIcon.png",\r
                                     Action = new BTOnAction(),\r
                                 }\r
                             },\r
@@ -96,7 +96,7 @@ namespace TVHome.Models
                                 new StateDescription\r
                                 {\r
                                     Label = "BT Launch",\r
-                                    IconPath = "btlaunch.png",\r
+                                    IconPath = "AppIcon.png",\r
                                     Action = new BTLaunchAction(),\r
                                 }\r
                             },\r
index ad71daf98650ae2d4f44727d2a74db5f80716472..fe007c3ffb86e4be3b79c7ea871a7028c81187e0 100644 (file)
     <Compile Include="Views\MainPanel.xaml.cs">\r
       <DependentUpon>MainPanel.xaml</DependentUpon>\r
     </Compile>\r
+    <Compile Include="Views\Panel.cs" />\r
     <Compile Include="Views\SubPanel.xaml.cs">\r
       <DependentUpon>SubPanel.xaml</DependentUpon>\r
     </Compile>\r
+    <Compile Include="Views\SubThumbnailPanel.xaml.cs">\r
+      <DependentUpon>SubThumbnailPanel.xaml</DependentUpon>\r
+    </Compile>\r
   </ItemGroup>\r
   <ItemGroup>\r
     <EmbeddedResource Include="Views\MainPanel.xaml">\r
       <SubType>Designer</SubType>\r
     </None>\r
   </ItemGroup>\r
+  <ItemGroup>\r
+    <EmbeddedResource Include="Views\SubThumbnailPanel.xaml">\r
+      <Generator>MSBuild:UpdateDesignTimeXaml</Generator>\r
+      <SubType>Designer</SubType>\r
+    </EmbeddedResource>\r
+  </ItemGroup>\r
   <Import Project="$(MSBuildExtensionsPath32)\Microsoft\Portable\$(TargetFrameworkVersion)\Microsoft.Portable.CSharp.targets" />\r
   <Import Project="..\..\packages\Xamarin.Forms.2.3.3.193\build\portable-win+net45+wp80+win81+wpa81+MonoAndroid10+Xamarin.iOS10+xamarinmac20\Xamarin.Forms.targets" Condition="Exists('..\..\packages\Xamarin.Forms.2.3.3.193\build\portable-win+net45+wp80+win81+wpa81+MonoAndroid10+Xamarin.iOS10+xamarinmac20\Xamarin.Forms.targets')" />\r
   <Target Name="EnsureNuGetPackageBuildImports" BeforeTargets="PrepareForBuild">\r
index 5415809376a85c7de0b8bf8a9fe32abf080fa4ae..9f4169e663958b3bf2d0e01eec007683027dceeb 100755 (executable)
                              RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.390625}"
                              ItemsSource="{Binding MainList}"/>
 
-            <Views:SubPanel x:Name="RecentSubPanel"
-                            RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.18}"
+            <Views:SubThumbnailPanel x:Name="RecentSubPanel"
+                            RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.224}"
                             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
-                            RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.94}"
+                            RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.89}"
                             ItemsSource="{Binding RecentList}" >
-                <Views:SubPanel.ItemTemplate>
+                <Views:SubThumbnailPanel.ItemTemplate>
                     <DataTemplate>
                         <Controls:SubPanelThumbnailButton/>
                     </DataTemplate>
-                </Views:SubPanel.ItemTemplate>
-            </Views:SubPanel>
+                </Views:SubThumbnailPanel.ItemTemplate>
+            </Views:SubThumbnailPanel>
 
             <Views:SubPanel x:Name="AppsSubPanel"
-                            RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.18}"
+                            RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.224}"
                             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
-                            RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.94}"
+                            RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.89}"
                             ItemsSource="{Binding AppList}">
                 <Views:SubPanel.ItemTemplate>
                     <DataTemplate>
@@ -55,9 +55,9 @@
             </Views:SubPanel>
 
             <Views:SubPanel x:Name="SettingsSubPanel"
-                            RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.18}"
+                            RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.224}"
                             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
-                            RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.94}"
+                            RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.89}"
                             ItemsSource="{Binding SettingsList}">
                 <Views:SubPanel.ItemTemplate>
                     <DataTemplate>
index 45ff941f9bb18e0ccf2e6dbd4d30d91f0f98ff41..6747528534fce88e2aef320c54a23bb7c51a47fc 100644 (file)
@@ -31,17 +31,18 @@ namespace TVHome.Views
     public partial class MainPage : ContentPage\r
     {\r
 \r
-        private Dictionary<string, SubPanel> SubPanelDictionary;\r
-        private SubPanel currentSubPanel;\r
+        private Dictionary<string, Panel> SubPanelDictionary;\r
+        private Panel currentSubPanel;\r
         public ICommand ChangeSubPanelCommand;\r
 \r
         public MainPage()\r
         {\r
             InitializeComponent();\r
-            SubPanelDictionary = new Dictionary<string, SubPanel>();\r
+            SubPanelDictionary = new Dictionary<string, Panel>();\r
             SubPanelDictionary.Add("Recent", RecentSubPanel);\r
             SubPanelDictionary.Add("Apps", AppsSubPanel);\r
             SubPanelDictionary.Add("Settings", SettingsSubPanel);\r
+\r
             PageMainPanel.OnFocusedCommand = new Command<string>((key) =>\r
             {\r
                 DebuggingUtils.Dbg("MainPage : " + key);\r
@@ -53,6 +54,21 @@ namespace TVHome.Views
                 currentSubPanel = SubPanelDictionary[key];\r
                 currentSubPanel.ShowPanel();\r
             });\r
+\r
+            RecentSubPanel.OnFocusedCommand = new Command(() =>\r
+            {\r
+                PageMainPanel.SelectPanel();\r
+            });\r
+\r
+            AppsSubPanel.OnFocusedCommand = new Command(() =>\r
+            {\r
+                PageMainPanel.SelectPanel();\r
+            });\r
+\r
+            SettingsSubPanel.OnFocusedCommand = new Command(() =>\r
+            {\r
+                PageMainPanel.SelectPanel();\r
+            });\r
         }\r
 \r
         private void OnAppearing(object sender, EventArgs e)\r
index 096191cc93fa1ae112ca9ea8ef92e6bbe51f7933..b881fff0cefd23691cfbe26312eef57c34db3fd2 100644 (file)
@@ -1,14 +1,13 @@
 <?xml version="1.0" encoding="UTF-8"?>\r
-<ContentView xmlns="http://xamarin.com/schemas/2014/forms"\r
+<Views:Panel xmlns="http://xamarin.com/schemas/2014/forms"\r
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"\r
+             xmlns:Views="clr-namespace:TVHome.Views"\r
              x:Class="TVHome.Views.MainPanel">\r
-    <ContentView.Content>\r
-        <Grid x:Name="PanelButtonGrid">\r
-            <Grid.ColumnDefinitions>\r
-                <ColumnDefinition Width="1*" />\r
-                <ColumnDefinition Width="1*" />\r
-                <ColumnDefinition Width="1*" />\r
-            </Grid.ColumnDefinitions>\r
-        </Grid>\r
-    </ContentView.Content>\r
-</ContentView>
\ No newline at end of file
+    <Grid x:Name="PanelButtonGrid">\r
+        <Grid.ColumnDefinitions>\r
+            <ColumnDefinition Width="1*" />\r
+            <ColumnDefinition Width="1*" />\r
+            <ColumnDefinition Width="1*" />\r
+        </Grid.ColumnDefinitions>\r
+    </Grid>\r
+</Views:Panel>
\ No newline at end of file
index e4ff6adc9aa8cf452686d0031f006c4a29dbc180..527e92ea191ea37eb236c1adca1e9cb0a3b78ffe 100644 (file)
@@ -29,24 +29,8 @@ namespace TVHome.Views
     /// <summary>\r
     /// Main Panel in Main Page\r
     /// </summary>\r
-    public partial class MainPanel : ContentView\r
+    public partial class MainPanel : Panel\r
     {\r
-        public static readonly BindableProperty ItemsSourceProperty = BindableProperty.Create("ItemsSource", typeof(IEnumerable<ShortcutInfo>), typeof(MainPanel));\r
-\r
-        public IEnumerable<ShortcutInfo> ItemsSource\r
-        {\r
-            get { return (IEnumerable<ShortcutInfo>)GetValue(ItemsSourceProperty); }\r
-            set { SetValue(ItemsSourceProperty, value); }\r
-        }\r
-\r
-        public static readonly BindableProperty OnFocusedCommandProperty = BindableProperty.Create("OnFocusedCommand", typeof(ICommand), typeof(MainPanel));\r
-\r
-        public ICommand OnFocusedCommand\r
-        {\r
-            get { return (ICommand)GetValue(OnFocusedCommandProperty); }\r
-            set { SetValue(OnFocusedCommandProperty, value); }\r
-        }\r
-\r
         public MainPanel()\r
         {\r
             InitializeComponent();\r
@@ -68,6 +52,7 @@ namespace TVHome.Views
                 button.View.BindingContext = item;\r
                 button.OnFocusedCommand = new Command(() =>\r
                 {\r
+                    FocusPanel();\r
                     OnFocusedCommand.Execute(item.StateDescriptions["default"].Label);\r
                 });\r
                 button.OnClickedCommand = new Command(() =>\r
@@ -80,8 +65,28 @@ namespace TVHome.Views
 \r
         public void InitialFocusing()\r
         {\r
-            var button = PanelButtonGrid.Children[1] as RelativeLayout;\r
+            var button = PanelButtonGrid.Children[1];\r
             button.FindByName<Button>("ButtonFocusArea").Focus();\r
         }\r
+\r
+        public override async void FocusPanel()\r
+        {\r
+            await PanelButtonGrid.TranslateTo(0, 0);\r
+        }\r
+\r
+        public override async void HidePanel()\r
+        {\r
+            await PanelButtonGrid.ScaleTo(0, 0);\r
+        }\r
+\r
+        public async void SelectPanel()\r
+        {\r
+            await PanelButtonGrid.TranslateTo(0, -78);\r
+        }\r
+\r
+        public override async void ShowPanel()\r
+        {\r
+            await PanelButtonGrid.ScaleTo(1, 0);\r
+        }\r
     }\r
 }
\ No newline at end of file
diff --git a/TVHome/TVHome/Views/Panel.cs b/TVHome/TVHome/Views/Panel.cs
new file mode 100644 (file)
index 0000000..6a31850
--- /dev/null
@@ -0,0 +1,58 @@
+/*
+ * Copyright (c) 2017 Samsung Electronics Co., Ltd
+ *
+ * Licensed under the Flora License, Version 1.1 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://floralicense.org/license/
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+using System;
+using System.Collections.Generic;
+using System.ComponentModel;
+using System.Windows.Input;
+using TVHome.DataModels;
+using Xamarin.Forms;
+
+namespace TVHome.Views
+{
+    public abstract class Panel : ContentView
+    {
+        public static readonly BindableProperty OnFocusedCommandProperty = BindableProperty.Create("OnFocusedCommand", typeof(ICommand), typeof(MainPanel));
+
+        public ICommand OnFocusedCommand
+        {
+            get { return (ICommand)GetValue(OnFocusedCommandProperty); }
+            set { SetValue(OnFocusedCommandProperty, value); }
+        }
+
+        public static readonly BindableProperty ItemsSourceProperty = BindableProperty.Create("ItemsSource", typeof(IEnumerable<ShortcutInfo>), typeof(MainPanel));
+
+        public IEnumerable<ShortcutInfo> ItemsSource
+        {
+            get { return (IEnumerable<ShortcutInfo>)GetValue(ItemsSourceProperty); }
+            set { SetValue(ItemsSourceProperty, value); }
+        }
+
+        public static readonly BindableProperty ItemTemplateProperty = BindableProperty.Create("ItemTemplate", typeof(DataTemplate), typeof(SubPanel));
+
+        public DataTemplate ItemTemplate
+        {
+            get { return (DataTemplate)GetValue(ItemTemplateProperty); }
+            set { SetValue(ItemTemplateProperty, value); }
+        }
+
+        public bool isFocused;
+
+        public abstract void FocusPanel();
+        public abstract void HidePanel();
+        public abstract void ShowPanel();
+    }
+}
index 4256e657ba459d6fa2eb9c40c2a6218c01766a3c..ea4d1c1bf854383246af88a01f2c44d036886b71 100644 (file)
@@ -1,15 +1,15 @@
 <?xml version="1.0" encoding="UTF-8"?>\r
-<ContentView xmlns="http://xamarin.com/schemas/2014/forms"\r
+<Views:Panel xmlns="http://xamarin.com/schemas/2014/forms"\r
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"\r
+             xmlns:Views="clr-namespace:TVHome.Views"\r
              x:Class="TVHome.Views.SubPanel">\r
-    <ContentView.Content>\r
-        <ScrollView x:Name="PanelScrollView"\r
-                    Orientation="Horizontal"\r
-                    HorizontalOptions="Center">\r
-            <StackLayout x:Name="PanelButtonStack"\r
-                         Orientation="Horizontal"\r
-                         Padding="96,0,96,0">\r
-            </StackLayout>\r
-        </ScrollView>\r
-    </ContentView.Content>\r
-</ContentView>
\ No newline at end of file
+    <ScrollView x:Name="PanelScrollView"\r
+                Orientation="Horizontal"\r
+                HorizontalOptions="Center">\r
+        <StackLayout x:Name="PanelButtonStack"\r
+                     Orientation="Horizontal"\r
+                     Padding="96,28,96,28"\r
+                     Spacing="78">\r
+        </StackLayout>\r
+    </ScrollView>\r
+</Views:Panel>
\ No newline at end of file
index c067d11826ebf6bb846a461c95b42c5a35c6e465..97053cb35937115e3ca37ec19c4c976b318ebfef 100644 (file)
@@ -29,26 +29,8 @@ namespace TVHome.Views
     /// <summary>\r
     /// Sub Panel in Main Page\r
     /// </summary>\r
-    public partial class SubPanel : ContentView\r
+    public partial class SubPanel : Panel\r
     {\r
-        public static readonly BindableProperty ItemsSourceProperty = BindableProperty.Create("ItemsSource", typeof(IEnumerable<ShortcutInfo>), typeof(SubPanel));\r
-\r
-        public IEnumerable<ShortcutInfo> ItemsSource\r
-        {\r
-            get { return (IEnumerable<ShortcutInfo>)GetValue(ItemsSourceProperty); }\r
-            set { SetValue(ItemsSourceProperty, value); }\r
-        }\r
-\r
-        public static readonly BindableProperty ItemTemplateProperty = BindableProperty.Create("ItemTemplate", typeof(DataTemplate), typeof(SubPanel));\r
-\r
-        public DataTemplate ItemTemplate\r
-        {\r
-            get { return (DataTemplate)GetValue(ItemTemplateProperty); }\r
-            set { SetValue(ItemTemplateProperty, value); }\r
-        }\r
-\r
-        private bool isFocused;\r
-\r
         public SubPanel()\r
         {\r
             InitializeComponent();\r
@@ -64,7 +46,6 @@ namespace TVHome.Views
             }\r
 \r
             PanelButtonStack.Children.Clear();\r
-\r
             foreach (ShortcutInfo item in ItemsSource)\r
             {\r
                 var button = ItemTemplate.CreateContent() as PanelButton;\r
@@ -83,7 +64,7 @@ namespace TVHome.Views
             HidePanel();\r
         }\r
 \r
-        public async void HidePanel()\r
+        public override async void HidePanel()\r
         {\r
             isFocused = false;\r
             foreach (var item in PanelButtonStack.Children)\r
@@ -98,7 +79,7 @@ namespace TVHome.Views
             await this.FadeTo(0, 0);\r
         }\r
 \r
-        public async void ShowPanel()\r
+        public override async void ShowPanel()\r
         {\r
             isFocused = false;\r
             foreach (var item in PanelButtonStack.Children)\r
@@ -112,15 +93,17 @@ namespace TVHome.Views
             await this.FadeTo(0.3, 0);\r
         }\r
 \r
-        public async void FocusPanel()\r
+        public override async void FocusPanel()\r
         {\r
             if (isFocused)\r
             {\r
                 return;\r
             }\r
 \r
+            OnFocusedCommand.Execute("");\r
+\r
             isFocused = true;\r
-            var button = PanelButtonStack.Children[1] as RelativeLayout;\r
+            var button = PanelButtonStack.Children[1];\r
             button.FindByName<Button>("ButtonFocusArea").Focus();\r
 \r
 #pragma warning disable CS4014\r
diff --git a/TVHome/TVHome/Views/SubThumbnailPanel.xaml b/TVHome/TVHome/Views/SubThumbnailPanel.xaml
new file mode 100644 (file)
index 0000000..2dcd243
--- /dev/null
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<Views:Panel xmlns="http://xamarin.com/schemas/2014/forms"
+             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+             xmlns:Views="clr-namespace:TVHome.Views"
+             x:Class="TVHome.Views.SubThumbnailPanel">
+    <ScrollView x:Name="PanelScrollView"
+                Orientation="Horizontal"
+                HorizontalOptions="Center">
+        <StackLayout x:Name="PanelButtonStack"
+                     Orientation="Horizontal"
+                     Padding="96,18,96,18">
+        </StackLayout>
+    </ScrollView>
+</Views:Panel>
\ No newline at end of file
diff --git a/TVHome/TVHome/Views/SubThumbnailPanel.xaml.cs b/TVHome/TVHome/Views/SubThumbnailPanel.xaml.cs
new file mode 100644 (file)
index 0000000..459a7b3
--- /dev/null
@@ -0,0 +1,115 @@
+/*
+ * Copyright (c) 2017 Samsung Electronics Co., Ltd
+ *
+ * Licensed under the Flora License, Version 1.1 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://floralicense.org/license/
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+using System;
+using System.Collections.Generic;
+using System.Windows.Input;
+using System.ComponentModel;
+using TVHome.Controls;
+using TVHome.DataModels;
+using TVHome.ViewModels;
+using Xamarin.Forms;
+using TVHome.Utils;
+
+namespace TVHome.Views
+{
+    /// <summary>
+    /// Sub Panel in Main Page
+    /// </summary>
+    public partial class SubThumbnailPanel : Panel
+    {
+        public SubThumbnailPanel()
+        {
+            InitializeComponent();
+            isFocused = false;
+            PropertyChanged += OnItemsSourcePropertyChanged;
+        }
+
+        private void OnItemsSourcePropertyChanged(object sender, PropertyChangedEventArgs e)
+        {
+            if (e.PropertyName != "ItemsSource")
+            {
+                return;
+            }
+
+            PanelButtonStack.Children.Clear();
+            foreach (ShortcutInfo item in ItemsSource)
+            {
+                var button = ItemTemplate.CreateContent() as PanelButton;
+                button.View.BindingContext = item;
+                button.OnFocusedCommand = new Command(() =>
+                {
+                    FocusPanel();
+                });
+                button.OnClickedCommand = new Command(() =>
+                {
+                    item.DoAction();
+                });
+                PanelButtonStack.Children.Add(button.View);
+            }
+
+            HidePanel();
+        }
+
+        public override async void HidePanel()
+        {
+            isFocused = false;
+            foreach (var item in PanelButtonStack.Children)
+            {
+                item.IsEnabled = false;
+            }
+
+#pragma warning disable CS4014
+            PanelScrollView.ScrollToAsync(0, 0, true);
+            this.TranslateTo(0, 1, 0);
+#pragma warning restore CS4014
+            await this.FadeTo(0, 0);
+        }
+
+        public override async void ShowPanel()
+        {
+            isFocused = false;
+            foreach (var item in PanelButtonStack.Children)
+            {
+                item.IsEnabled = true;
+            }
+
+#pragma warning disable CS4014
+            this.TranslateTo(0, 0, 0);
+#pragma warning restore CS4014
+            await this.FadeTo(0.3, 0);
+        }
+
+        public override async void FocusPanel()
+        {
+            if (isFocused)
+            {
+                return;
+            }
+
+            OnFocusedCommand.Execute("");
+
+            isFocused = true;
+            var button = PanelButtonStack.Children[1];
+            button.FindByName<Button>("ButtonFocusArea").Focus();
+
+#pragma warning disable CS4014
+            this.TranslateTo(0, -140, 300);
+#pragma warning restore CS4014
+            await this.FadeTo(0.99, 300);
+        }
+    }
+}
\ No newline at end of file