From 1ce479b203a23d9546d3eab06d2be6c73ce6247e Mon Sep 17 00:00:00 2001
From: Heonjae Jang <heonjae.jang@samsung.com>
Date: Mon, 10 Apr 2017 10:34:55 +0900
Subject: [PATCH] Change MainPage and Tabs 1. Remove GridView 2. Change Layout
 of Tabs

Change-Id: I4addb963331bf4bb08de5d2386e6c5a6aa19deba
Signed-off-by: Heonjae Jang <heonjae.jang@samsung.com>
---
 .../TVMediaHub.Tizen/TVMediaHub.Tizen.csproj       |  8 ---
 .../TVMediaHub.Tizen/Views/GalleryGridView.xaml    | 13 ----
 .../TVMediaHub.Tizen/Views/GalleryGridView.xaml.cs | 40 -----------
 TVMediaHub/TVMediaHub.Tizen/Views/ImageTab.xaml    | 33 +++++++--
 TVMediaHub/TVMediaHub.Tizen/Views/ImageTab.xaml.cs |  8 +--
 .../TVMediaHub.Tizen/Views/MediaHubMainPage.xaml   | 79 ++++++++++++++--------
 .../Views/MediaHubMainPage.xaml.cs                 | 38 ++---------
 .../TVMediaHub.Tizen/Views/MovieGridView.xaml      | 20 ------
 .../TVMediaHub.Tizen/Views/MovieGridView.xaml.cs   | 23 -------
 TVMediaHub/TVMediaHub.Tizen/Views/MusicTab.xaml    | 33 +++++++--
 TVMediaHub/TVMediaHub.Tizen/Views/MusicTab.xaml.cs |  8 +--
 TVMediaHub/TVMediaHub.Tizen/Views/VideoTab.xaml    | 33 +++++++--
 TVMediaHub/TVMediaHub.Tizen/Views/VideoTab.xaml.cs |  8 +--
 13 files changed, 142 insertions(+), 202 deletions(-)
 delete mode 100644 TVMediaHub/TVMediaHub.Tizen/Views/GalleryGridView.xaml
 delete mode 100644 TVMediaHub/TVMediaHub.Tizen/Views/GalleryGridView.xaml.cs
 delete mode 100644 TVMediaHub/TVMediaHub.Tizen/Views/MovieGridView.xaml
 delete mode 100644 TVMediaHub/TVMediaHub.Tizen/Views/MovieGridView.xaml.cs

diff --git a/TVMediaHub/TVMediaHub.Tizen/TVMediaHub.Tizen.csproj b/TVMediaHub/TVMediaHub.Tizen/TVMediaHub.Tizen.csproj
index 2ddd8b2..d7d97de 100755
--- a/TVMediaHub/TVMediaHub.Tizen/TVMediaHub.Tizen.csproj
+++ b/TVMediaHub/TVMediaHub.Tizen/TVMediaHub.Tizen.csproj
@@ -96,9 +96,6 @@
     <Compile Include="Views\MediaHubMainPage.xaml.cs">
       <DependentUpon>MediaHubMainPage.xaml</DependentUpon>
     </Compile>
-    <Compile Include="Views\MovieGridView.xaml.cs">
-      <DependentUpon>MovieGridView.xaml</DependentUpon>
-    </Compile>
     <Compile Include="Views\MusicTab.xaml.cs">
       <DependentUpon>MusicTab.xaml</DependentUpon>
     </Compile>
@@ -123,11 +120,6 @@
     </EmbeddedResource>
   </ItemGroup>
   <ItemGroup>
-    <EmbeddedResource Include="Views\MovieGridView.xaml">
-      <Generator>MSBuild:UpdateDesignTimeXaml</Generator>
-    </EmbeddedResource>
-  </ItemGroup>
-  <ItemGroup>
     <EmbeddedResource Include="Views\FooterNormalStatus.xaml">
       <Generator>MSBuild:UpdateDesignTimeXaml</Generator>
     </EmbeddedResource>
diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/GalleryGridView.xaml b/TVMediaHub/TVMediaHub.Tizen/Views/GalleryGridView.xaml
deleted file mode 100644
index 577c1c4..0000000
--- a/TVMediaHub/TVMediaHub.Tizen/Views/GalleryGridView.xaml
+++ /dev/null
@@ -1,13 +0,0 @@
-<?xml version="1.0" encoding="utf-8" ?>
-<StackLayout xmlns="http://xamarin.com/schemas/2014/forms"
-             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             x:Class="TVMediaHub.Tizen.Views.GalleryGridView"
-             xmlns:Views="clr-namespace:TVMediaHub.Tizen.Views"
-             xmlns:ViewModels="clr-namespace:TVMediaHub.Tizen.ViewModels">
-    <StackLayout.Orientation>Vertical</StackLayout.Orientation>
-    <ScrollView Orientation="Horizontal" WidthRequest="1000" HeightRequest="500">
-        <StackLayout x:Name="GalleryContentView" Orientation="Horizontal">
-
-        </StackLayout>
-    </ScrollView>
-</StackLayout>
\ No newline at end of file
diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/GalleryGridView.xaml.cs b/TVMediaHub/TVMediaHub.Tizen/Views/GalleryGridView.xaml.cs
deleted file mode 100644
index 9393ff4..0000000
--- a/TVMediaHub/TVMediaHub.Tizen/Views/GalleryGridView.xaml.cs
+++ /dev/null
@@ -1,40 +0,0 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Runtime.CompilerServices;
-using System.Text;
-using System.Threading.Tasks;
-
-using Xamarin.Forms;
-using Xamarin.Forms.Xaml;
-
-namespace TVMediaHub.Tizen.Views
-{
-    [XamlCompilation(XamlCompilationOptions.Compile)]
-    public partial class GalleryGridView : StackLayout
-    {
-
-        //bool sel = false;
-        public GalleryGridView()
-        {
-            InitializeComponent();
-            AddGroups();
-        }
-
-
-
-        void AddGroups()
-        {
-            int groupSize = 3;
-            Gallery3ColumnGroupView galleryGroup;
-
-            for (int i = 0; i < groupSize; i++)
-            {
-                galleryGroup = new Gallery3ColumnGroupView();
-                // set GroupView data
-                GalleryContentView.Children.Add(galleryGroup);
-            }
-
-        }
-    }
-}
diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/ImageTab.xaml b/TVMediaHub/TVMediaHub.Tizen/Views/ImageTab.xaml
index 4ef4ee1..1e01bca 100644
--- a/TVMediaHub/TVMediaHub.Tizen/Views/ImageTab.xaml
+++ b/TVMediaHub/TVMediaHub.Tizen/Views/ImageTab.xaml
@@ -1,6 +1,29 @@
 <?xml version="1.0" encoding="utf-8" ?>
-<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
-             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             x:Class="TVMediaHub.Tizen.Views.ImageTab">
-  <Label Text="{Binding MainText}" VerticalOptions="Center" HorizontalOptions="Center" />
-</ContentPage>
\ No newline at end of file
+<RelativeLayout xmlns="http://xamarin.com/schemas/2014/forms"
+                xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+                x:Class="TVMediaHub.Tizen.Views.ImageTab"
+                xmlns:Views="clr-namespace:TVMediaHub.Tizen.Views"
+                RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"
+                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}">
+    <ScrollView RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.855}"
+                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
+                Orientation="Horizontal">
+        <StackLayout Orientation="Horizontal">
+            <Views:GalleryGridItem HeightRequest="500" WidthRequest="500" Command="{Binding OnSeleteModeCommand}"/>
+            <BoxView BackgroundColor="Aqua" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="Bisque" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="SaddleBrown" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="Coral" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="GreenYellow" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="SteelBlue" HeightRequest="500" WidthRequest="500"/>
+        </StackLayout>
+    </ScrollView>
+    <!-- TODO : Remove Label -->
+    <Label Text="Image Tab"></Label>
+
+    <!-- TODO : Add Footer -->
+    <RelativeLayout RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.145}"
+                    RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
+                    RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.855}">
+    </RelativeLayout>
+</RelativeLayout>
\ No newline at end of file
diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/ImageTab.xaml.cs b/TVMediaHub/TVMediaHub.Tizen/Views/ImageTab.xaml.cs
index f68a11d..e81e3f4 100644
--- a/TVMediaHub/TVMediaHub.Tizen/Views/ImageTab.xaml.cs
+++ b/TVMediaHub/TVMediaHub.Tizen/Views/ImageTab.xaml.cs
@@ -14,17 +14,11 @@
  * limitations under the License.
  */
 
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-
 using Xamarin.Forms;
 
 namespace TVMediaHub.Tizen.Views
 {
-    public partial class ImageTab : ContentPage
+    public partial class ImageTab : RelativeLayout
     {
         public ImageTab()
         {
diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/MediaHubMainPage.xaml b/TVMediaHub/TVMediaHub.Tizen/Views/MediaHubMainPage.xaml
index bd6953a..ba70330 100755
--- a/TVMediaHub/TVMediaHub.Tizen/Views/MediaHubMainPage.xaml
+++ b/TVMediaHub/TVMediaHub.Tizen/Views/MediaHubMainPage.xaml
@@ -2,8 +2,7 @@
 <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
              x:Class="TVMediaHub.Tizen.Views.MediaHubMainPage"
-             xmlns:Views="clr-namespace:TVMediaHub.Tizen.Views"
-             xmlns:ViewModels="clr-namespace:TVMediaHub.Tizen.ViewModels">
+             xmlns:Views="clr-namespace:TVMediaHub.Tizen.Views">
     <ContentPage.Resources>
         <ResourceDictionary>
             <Style x:Key="titleText" TargetType="Label">
@@ -26,34 +25,58 @@
                 <Setter Property="TextColor" Value="#FFFFFF"/>
                 <Setter Property="FontFamily" Value="Breeze Sans Medium"/>
             </Style>
-            <ViewModels:MediaHubMainPageViewModel x:Key="viewModel"/>
         </ResourceDictionary>
     </ContentPage.Resources>
-    <StackLayout Orientation="Vertical" BindingContext="{StaticResource viewModel}">
-        <Label Text="MEDIA HUB"
-               Style="{StaticResource titleText}"
-               HeightRequest="78"
-               Margin="0, 60, 0, 26"
-               HorizontalOptions="CenterAndExpand" VerticalOptions="Start"></Label>
-        <StackLayout Orientation="Horizontal" HorizontalOptions="CenterAndExpand" HeightRequest="36">
-            <Button Text="MOVIE" Style="{StaticResource buttonTextNormal}"
-                    CommandParameter="0"
-                    Clicked="OnPageButtonClicked"
-                    Margin="0, 0, 56, 0">
-            </Button>
-            <Button Text="GALLERY" Style="{StaticResource buttonTextSelected}" CommandParameter="1" Clicked="OnPageButtonClicked"
-                    Margin="0, 0, 56, 0"></Button>
-            <Button Text="ViewerTest" Style="{StaticResource buttonTextSelected}" CommandParameter="2" Clicked="OnPageButtonClicked" />
-        </StackLayout>
-        <StackLayout x:Name="contentArea" HeightRequest="594" WidthRequest="1500" Margin="0, 74, 0, 84">
-            <Views:MovieGridView x:Name="contentMovie" IsVisible="True"/>
-            <Views:GalleryGridView x:Name="contentGallery" IsVisible="False"/>
-        </StackLayout>
+    <RelativeLayout>
+        <Grid RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"
+              RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}">
+            <Grid.RowDefinitions>
+                <RowDefinition Height="200*"/>
+                <RowDefinition Height="880*"/>
+            </Grid.RowDefinitions>
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="1*"/>
+            </Grid.ColumnDefinitions>
 
-        <StackLayout x:Name="footerArea" Orientation="Horizontal" Margin="96, 0, 96, 48">
-            <Views:FooterNormalStatus x:Name="footerNor"  IsVisible="{Binding IsFooterNorStatus}"/>
-            <Views:FooterSelectedStatus x:Name="footerSel" IsVisible="{Binding IsFooterSelStatus}"/>
-        </StackLayout>
+            <!-- Header Area -->
+            <StackLayout Orientation="Vertical"
+                         HorizontalOptions="Center"
+                         Grid.Column="0"
+                         Grid.Row="0">
+                <Label Style="{StaticResource titleText}"
+                       HeightRequest="78"
+                       Margin="0, 60, 0, 26"
+                       HorizontalOptions="CenterAndExpand"
+                       Text="MEDIA HUB"
+                       VerticalOptions="Start"/>
+                <StackLayout Orientation="Horizontal"
+                             HorizontalOptions="CenterAndExpand"
+                             HeightRequest="36"
+                             Spacing="56">
+                    <Button Text="VIDEO"
+                            Style="{StaticResource buttonTextNormal}"
+                            Clicked="OnPageButtonClicked"
+                            CommandParameter="0"/>
+                    <Button Text="IMAGE"
+                            Style="{StaticResource buttonTextNormal}"
+                            Clicked="OnPageButtonClicked"
+                            CommandParameter="1"/>
+                    <Button Text="MUSIC"
+                            Style="{StaticResource buttonTextNormal}"
+                            Clicked="OnPageButtonClicked"
+                            CommandParameter="2"/>
+                </StackLayout>
+            </StackLayout>
+            <!-- Header Area -->
 
-    </StackLayout>
+            <!-- Tab Area -->
+            <RelativeLayout Grid.Row="1"
+                            Grid.Column="0">
+                <Views:VideoTab x:Name="VideoTab" IsVisible="true"/>
+                <Views:ImageTab x:Name="ImageTab" IsVisible="false"/>
+                <Views:MusicTab x:Name="MusicTab" IsVisible="false"/>
+            </RelativeLayout>
+            <!-- Tab Area -->
+        </Grid>
+    </RelativeLayout>
 </ContentPage>
\ No newline at end of file
diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/MediaHubMainPage.xaml.cs b/TVMediaHub/TVMediaHub.Tizen/Views/MediaHubMainPage.xaml.cs
index 4645efa..040263a 100755
--- a/TVMediaHub/TVMediaHub.Tizen/Views/MediaHubMainPage.xaml.cs
+++ b/TVMediaHub/TVMediaHub.Tizen/Views/MediaHubMainPage.xaml.cs
@@ -15,12 +15,6 @@
  */
 
 using System;
-using System.Collections.Generic;
-using System.ComponentModel;
-using System.Linq;
-using System.Runtime.CompilerServices;
-using System.Text;
-using System.Threading.Tasks;
 
 using Xamarin.Forms;
 using Xamarin.Forms.Xaml;
@@ -64,20 +58,10 @@ namespace TVMediaHub.Tizen.Views
         void OnPageButtonClicked(object sender, EventArgs e)
         {
             string a = (string)((Button)sender).CommandParameter;
-
-            if (a.Equals("0"))
-            {
-                curStatus.pageMode = 0;
-                curStatus.footerStatus = 0;
-                changeViewVisible();
-            }
-            else if (a.Equals("1"))
-            {
-                curStatus.pageMode = 1;
-                curStatus.footerStatus = 0;
-                changeViewVisible();
-            }
-            else
+            VideoTab.IsVisible = (a == "0");
+            ImageTab.IsVisible = (a == "1");
+            MusicTab.IsVisible = (a == "2");
+            if (a == "2")
             {
                 PushNavigationPage();
             }
@@ -88,19 +72,5 @@ namespace TVMediaHub.Tizen.Views
             await Navigation.PushAsync(new ImageViewer());
         }
 
-        void changeViewVisible()
-        {
-            if (curStatus.pageMode == MainPageStatus.PAGE_MOVIE)
-            {
-                contentMovie.IsVisible = true;
-                contentGallery.IsVisible = false;
-            }
-            else
-            {
-                contentMovie.IsVisible = false;
-                contentGallery.IsVisible = true;
-            }
-        }
-
     }
 }
diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/MovieGridView.xaml b/TVMediaHub/TVMediaHub.Tizen/Views/MovieGridView.xaml
deleted file mode 100644
index f40f3e0..0000000
--- a/TVMediaHub/TVMediaHub.Tizen/Views/MovieGridView.xaml
+++ /dev/null
@@ -1,20 +0,0 @@
-<?xml version="1.0" encoding="utf-8" ?>
-<StackLayout xmlns="http://xamarin.com/schemas/2014/forms"
-             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             x:Class="TVMediaHub.Tizen.Views.MovieGridView"
-             xmlns:Views="clr-namespace:TVMediaHub.Tizen.Views">
-    <StackLayout.Orientation>Vertical</StackLayout.Orientation>
-    <Label Text="Movie ~~~~~~~~~~~~~~~~~~~~~~ "></Label>
-    <ScrollView Orientation="Horizontal" WidthRequest="1000" HeightRequest="500">
-        <StackLayout Orientation="Horizontal">
-            <Views:GalleryGridItem HeightRequest="500" WidthRequest="500" Command="{Binding OnSeleteModeCommand}"/>
-            <BoxView BackgroundColor="Aqua" HeightRequest="500" WidthRequest="500"/>
-            <BoxView BackgroundColor="Bisque" HeightRequest="500" WidthRequest="500"/>
-            <BoxView BackgroundColor="SaddleBrown" HeightRequest="500" WidthRequest="500"/>
-            <BoxView BackgroundColor="Coral" HeightRequest="500" WidthRequest="500"/>
-            <BoxView BackgroundColor="GreenYellow" HeightRequest="500" WidthRequest="500"/>
-            <BoxView BackgroundColor="SteelBlue" HeightRequest="500" WidthRequest="500"/>
-        </StackLayout>
-    </ScrollView>
-
-</StackLayout>
\ No newline at end of file
diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/MovieGridView.xaml.cs b/TVMediaHub/TVMediaHub.Tizen/Views/MovieGridView.xaml.cs
deleted file mode 100644
index 8266eb1..0000000
--- a/TVMediaHub/TVMediaHub.Tizen/Views/MovieGridView.xaml.cs
+++ /dev/null
@@ -1,23 +0,0 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Runtime.CompilerServices;
-using System.Text;
-using System.Threading.Tasks;
-
-using Xamarin.Forms;
-using Xamarin.Forms.Xaml;
-
-namespace TVMediaHub.Tizen.Views
-{
-    [XamlCompilation(XamlCompilationOptions.Compile)]
-    public partial class MovieGridView : StackLayout
-    {
-        public MovieGridView()
-        {
-            InitializeComponent();
-        }
-
-    }
-
-}
diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/MusicTab.xaml b/TVMediaHub/TVMediaHub.Tizen/Views/MusicTab.xaml
index 3ae63de..083abe8 100644
--- a/TVMediaHub/TVMediaHub.Tizen/Views/MusicTab.xaml
+++ b/TVMediaHub/TVMediaHub.Tizen/Views/MusicTab.xaml
@@ -1,6 +1,29 @@
 <?xml version="1.0" encoding="utf-8" ?>
-<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
-             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             x:Class="TVMediaHub.Tizen.Views.MusicTab">
-  <Label Text="{Binding MainText}" VerticalOptions="Center" HorizontalOptions="Center" />
-</ContentPage>
\ No newline at end of file
+<RelativeLayout xmlns="http://xamarin.com/schemas/2014/forms"
+                xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+                x:Class="TVMediaHub.Tizen.Views.MusicTab"
+                xmlns:Views="clr-namespace:TVMediaHub.Tizen.Views"
+                RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"
+                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}">
+    <ScrollView RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.855}"
+                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
+                Orientation="Horizontal">
+        <StackLayout Orientation="Horizontal">
+            <Views:GalleryGridItem HeightRequest="500" WidthRequest="500" Command="{Binding OnSeleteModeCommand}"/>
+            <BoxView BackgroundColor="Aqua" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="Bisque" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="SaddleBrown" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="Coral" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="GreenYellow" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="SteelBlue" HeightRequest="500" WidthRequest="500"/>
+        </StackLayout>
+    </ScrollView>
+    <!-- TODO : Remove Label -->
+    <Label Text="Music Tab"></Label>
+
+    <!-- TODO : Add Footer -->
+    <RelativeLayout RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.145}"
+                    RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
+                    RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.855}">
+    </RelativeLayout>
+</RelativeLayout>
\ No newline at end of file
diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/MusicTab.xaml.cs b/TVMediaHub/TVMediaHub.Tizen/Views/MusicTab.xaml.cs
index e928377..e23a775 100644
--- a/TVMediaHub/TVMediaHub.Tizen/Views/MusicTab.xaml.cs
+++ b/TVMediaHub/TVMediaHub.Tizen/Views/MusicTab.xaml.cs
@@ -14,17 +14,11 @@
  * limitations under the License.
  */
 
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-
 using Xamarin.Forms;
 
 namespace TVMediaHub.Tizen.Views
 {
-    public partial class MusicTab : ContentPage
+    public partial class MusicTab : RelativeLayout
     {
         public MusicTab()
         {
diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/VideoTab.xaml b/TVMediaHub/TVMediaHub.Tizen/Views/VideoTab.xaml
index 5abfe30..25560cc 100644
--- a/TVMediaHub/TVMediaHub.Tizen/Views/VideoTab.xaml
+++ b/TVMediaHub/TVMediaHub.Tizen/Views/VideoTab.xaml
@@ -1,6 +1,29 @@
 <?xml version="1.0" encoding="utf-8" ?>
-<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
-             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             x:Class="TVMediaHub.Tizen.Views.VideoTab">
-  <Label Text="{Binding MainText}" VerticalOptions="Center" HorizontalOptions="Center" />
-</ContentPage>
\ No newline at end of file
+<RelativeLayout xmlns="http://xamarin.com/schemas/2014/forms"
+                xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+                x:Class="TVMediaHub.Tizen.Views.VideoTab"
+                xmlns:Views="clr-namespace:TVMediaHub.Tizen.Views"
+                RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"
+                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}">
+    <ScrollView RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.855}"
+                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
+                Orientation="Horizontal">
+        <StackLayout Orientation="Horizontal">
+            <Views:GalleryGridItem HeightRequest="500" WidthRequest="500" Command="{Binding OnSeleteModeCommand}"/>
+            <BoxView BackgroundColor="Aqua" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="Bisque" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="SaddleBrown" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="Coral" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="GreenYellow" HeightRequest="500" WidthRequest="500"/>
+            <BoxView BackgroundColor="SteelBlue" HeightRequest="500" WidthRequest="500"/>
+        </StackLayout>
+    </ScrollView>
+    <!-- TODO : Remove Label -->
+    <Label Text="Video Tab"></Label>
+
+    <!-- TODO : Add Footer -->
+    <RelativeLayout RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.145}"
+                    RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
+                    RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.855}">
+    </RelativeLayout>
+</RelativeLayout>
\ No newline at end of file
diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/VideoTab.xaml.cs b/TVMediaHub/TVMediaHub.Tizen/Views/VideoTab.xaml.cs
index 13ebd35..7cdc82a 100644
--- a/TVMediaHub/TVMediaHub.Tizen/Views/VideoTab.xaml.cs
+++ b/TVMediaHub/TVMediaHub.Tizen/Views/VideoTab.xaml.cs
@@ -14,17 +14,11 @@
  * limitations under the License.
  */
 
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-
 using Xamarin.Forms;
 
 namespace TVMediaHub.Tizen.Views
 {
-    public partial class VideoTab : ContentPage
+    public partial class VideoTab : RelativeLayout
     {
         public VideoTab()
         {
-- 
2.7.4