WindowsPhone: List view prototyping.

Related to issue #424.
ycastonguay · Sep 18, 2013 · 0c4c384 · 0c4c384
1 parent 11f2315
commit 0c4c384
Show file tree

Hide file tree

Showing 11 changed files with 258 additions and 112 deletions.
diff --git a/MPfm/MPfm.WindowsPhone/App.xaml b/MPfm/MPfm.WindowsPhone/App.xaml
@@ -8,6 +8,35 @@
     <!--Application Resources-->
     <Application.Resources>
         <local:LocalizedStrings xmlns:local="clr-namespace:MPfm.WindowsPhone" x:Key="LocalizedStrings"/>
+        <!--<Style x:Key="MyTextBlockStyle" TargetType="phone:LongListSelector" >
+            <Setter Property="LayoutMode" Value="List"/>
+            <Setter Property="FontFamily" Value="Times New Roman"/>
+            <Setter Property="ItemTemplate">
+                <Setter.Value>
+                    <DataTemplate>
+                        <UserControl>
+                            <Border x:Name="MyBorder" Background="Transparent">
+                                <VisualStateManager.VisualStateGroups  >
+                                    <VisualStateGroup x:Name="CommonStates">
+                                        <VisualState x:Name="Normal" />
+                                        <VisualState x:Name="Selected">
+                                            <Storyboard>
+                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background)" Storyboard.TargetName="MyBorder">
+                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneAccentBrush}"/>
+                                                </ObjectAnimationUsingKeyFrames>
+                                            </Storyboard>
+                                        </VisualState>
+                                    </VisualStateGroup>
+                                </VisualStateManager.VisualStateGroups>
+                                <StackPanel>
+                                    <TextBlock x:Name="textBlock" Text="{Binding}" TextWrapping="Wrap" Style="{StaticResource PhoneTextSubtleStyle}"/>
+                                </StackPanel>
+                            </Border>
+                        </UserControl>
+                    </DataTemplate>
+                </Setter.Value>
+            </Setter>
+        </Style>-->
     </Application.Resources>
 
     <Application.ApplicationLifetimeObjects>

diff --git a/MPfm/MPfm.WindowsPhone/App.xaml.cs b/MPfm/MPfm.WindowsPhone/App.xaml.cs
@@ -85,7 +85,7 @@ private void Application_Launching(object sender, LaunchingEventArgs e)
             BootstrapApp();
 
             // Instead of using WMAppManifest to automatically launch a page, do it in code.
-            RootFrame.Navigate(new Uri("/MainPage.xaml", UriKind.Relative));
+            RootFrame.Navigate(new Uri("/Classes/Pages/MainPage.xaml", UriKind.Relative));
         }
 
         // Code to execute when the application is activated (brought to foreground)

diff --git a/MPfm/MPfm.WindowsPhone/Classes/Controls/ListArtistControl.xaml b/MPfm/MPfm.WindowsPhone/Classes/Controls/ListArtistControl.xaml
@@ -0,0 +1,28 @@
+<UserControl x:Class="MPfm.WindowsPhone.Classes.Controls.ListArtistControl"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    mc:Ignorable="d"
+    FontFamily="{StaticResource PhoneFontFamilyNormal}"
+    FontSize="{StaticResource PhoneFontSizeNormal}"
+    Foreground="{StaticResource PhoneForegroundBrush}"
+    d:DesignHeight="480" d:DesignWidth="480">
+
+    <Grid x:Name="LayoutRoot" Background="{StaticResource PhoneBackgroundBrush}">
+        <VisualStateManager.VisualStateGroups>
+            <VisualStateGroup x:Name="CommonStates">
+                <VisualState x:Name="Normal"/>
+                <VisualState x:Name="Selected">
+                    <Storyboard>
+                        <!--<DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(Control.FontSize)" Storyboard.TargetName="textBlock" />-->
+                        <ColorAnimation Duration="0" To="DarkGray" Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="textBlock" />
+                    </Storyboard>
+                </VisualState>
+            </VisualStateGroup>
+        </VisualStateManager.VisualStateGroups>
+        <StackPanel Margin="0,0,0,17">
+            <TextBlock x:Name="textBlock" Text="{Binding}" TextWrapping="Wrap" Style="{StaticResource PhoneTextLargeStyle}"/>
+        </StackPanel>
+    </Grid>
+</UserControl>
diff --git a/MPfm/MPfm.WindowsPhone/Classes/Controls/ListArtistControl.xaml.cs b/MPfm/MPfm.WindowsPhone/Classes/Controls/ListArtistControl.xaml.cs
@@ -0,0 +1,29 @@
+// Copyright © 2011-2013 Yanick Castonguay
+//
+// This file is part of MPfm.
+//
+// MPfm is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// MPfm is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with MPfm. If not, see <http://www.gnu.org/licenses/>.
+
+using System.Windows.Controls;
+
+namespace MPfm.WindowsPhone.Classes.Controls
+{
+    public partial class ListArtistControl : UserControl
+    {
+        public ListArtistControl()
+        {
+            InitializeComponent();
+        }
+    }
+}
diff --git a/MPfm/MPfm.WindowsPhone/Classes/Controls/ListSimpleControl.xaml b/MPfm/MPfm.WindowsPhone/Classes/Controls/ListSimpleControl.xaml
@@ -0,0 +1,29 @@
+<UserControl x:Class="MPfm.WindowsPhone.Classes.Controls.ListSimpleControl"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    mc:Ignorable="d"
+    FontFamily="{StaticResource PhoneFontFamilyNormal}"
+    FontSize="{StaticResource PhoneFontSizeNormal}"
+    Foreground="{StaticResource PhoneForegroundBrush}"
+    d:DesignHeight="480" d:DesignWidth="480">
+
+    <Grid x:Name="LayoutRoot" Background="{StaticResource PhoneBackgroundBrush}">
+        <VisualStateManager.VisualStateGroups>
+            <VisualStateGroup x:Name="CommonStates">
+                <VisualState x:Name="Normal"/>
+                <VisualState x:Name="Selected">
+                    <Storyboard>
+                        <!--<DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(Control.FontSize)" Storyboard.TargetName="textBlock" />-->
+                        <ColorAnimation Duration="0" To="DarkGray" Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="textBlock" />
+                    </Storyboard>
+                </VisualState>
+            </VisualStateGroup>
+        </VisualStateManager.VisualStateGroups>
+        <StackPanel Margin="0,0,0,17">
+            <TextBlock x:Name="textBlock" Text="{Binding}" TextWrapping="Wrap" Style="{StaticResource PhoneTextLargeStyle}"/>
+            <TextBlock x:Name="textBlock2" Text="{Binding}" TextWrapping="Wrap" Style="{StaticResource PhoneTextSmallStyle}"/>
+        </StackPanel>
+    </Grid>
+</UserControl>
diff --git a/MPfm/MPfm.WindowsPhone/Classes/Controls/ListSimpleControl.xaml.cs b/MPfm/MPfm.WindowsPhone/Classes/Controls/ListSimpleControl.xaml.cs
@@ -0,0 +1,29 @@
+// Copyright © 2011-2013 Yanick Castonguay
+//
+// This file is part of MPfm.
+//
+// MPfm is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// MPfm is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with MPfm. If not, see <http://www.gnu.org/licenses/>.
+
+using System.Windows.Controls;
+
+namespace MPfm.WindowsPhone.Classes.Controls
+{
+    public partial class ListSimpleControl : UserControl
+    {
+        public ListSimpleControl()
+        {
+            InitializeComponent();
+        }
+    }
+}
diff --git a/MPfm/MPfm.WindowsPhone/MainPage.xaml → ....WindowsPhone/Classes/Pages/MainPage.xaml b/MPfm/MPfm.WindowsPhone/MainPage.xaml → ....WindowsPhone/Classes/Pages/MainPage.xaml
@@ -6,6 +6,7 @@
     xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:controls="clr-namespace:MPfm.WindowsPhone.Classes.Controls"
     mc:Ignorable="d"
     FontFamily="{StaticResource PhoneFontFamilyNormal}"
     FontSize="{StaticResource PhoneFontSizeNormal}"
@@ -41,16 +42,45 @@
 
         <!--TitlePanel contains the name of the application and page title-->
         <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
-            <TextBlock Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
-            <TextBlock Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
+            <phone:Pivot Height="736" Title="SESSIONS" Margin="0,0,10,0">
+                <phone:PivotItem CacheMode="{x:Null}" Header="artists">
+                    <phone:LongListSelector x:Name="listArtists" HorizontalAlignment="Left" Height="571" VerticalAlignment="Top" Width="424" SelectionChanged="listArtists_SelectionChanged">
+                        <phone:LongListSelector.ItemTemplate>
+                            <DataTemplate>
+                                <controls:ListArtistControl />
+                            </DataTemplate>
+                        </phone:LongListSelector.ItemTemplate>
+                    </phone:LongListSelector>
+                </phone:PivotItem>
+                <phone:PivotItem CacheMode="{x:Null}" Header="albums">
+                    <phone:LongListSelector x:Name="listAlbums" HorizontalAlignment="Left" Height="571" VerticalAlignment="Top" Width="424"/>
+                </phone:PivotItem>
+                <phone:PivotItem CacheMode="{x:Null}" Header="songs">
+                    <Grid>
+                        <Grid.ColumnDefinitions>
+                            <ColumnDefinition Width="61*"/>
+                            <ColumnDefinition Width="87*"/>
+                        </Grid.ColumnDefinitions>
+                        <Button Content="Button" HorizontalAlignment="Left" Margin="59,0,0,463" Click="Button_Click" Height="72" VerticalAlignment="Bottom"/>
+                        <TextBlock x:Name="txtStuff" HorizontalAlignment="Left" Margin="56,48,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top" Grid.Column="1"/>
+                    </Grid>
+                </phone:PivotItem>
+                <phone:PivotItem CacheMode="{x:Null}" Header="playlists">
+                    <Grid/>
+                </phone:PivotItem>
+                <phone:PivotItem CacheMode="{x:Null}" Header="more">
+                    <phone:LongListSelector x:Name="listMore" HorizontalAlignment="Left" Height="571" VerticalAlignment="Top" Width="424" SelectionChanged="listMore_SelectionChanged">
+                        <phone:LongListSelector.ItemTemplate>
+                            <DataTemplate>
+                                <controls:ListSimpleControl />
+                            </DataTemplate>
+                        </phone:LongListSelector.ItemTemplate>
+                    </phone:LongListSelector>
+                </phone:PivotItem>
+            </phone:Pivot>
         </StackPanel>
 
         <!--ContentPanel - place additional content here-->
-        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
-            <Button Content="Button" HorizontalAlignment="Left" Margin="204,157,0,0" VerticalAlignment="Top" Click="Button_Click"/>
-            <TextBlock x:Name="txtStuff" HorizontalAlignment="Left" Margin="92,52,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top"/>
-
-        </Grid>
 
         <!--Uncomment to see an alignment grid to help ensure your controls are
             aligned on common boundaries.  The image has a top margin of -32px to

diff --git a/MPfm/MPfm.WindowsPhone/Classes/Pages/PlayerPage.xaml b/MPfm/MPfm.WindowsPhone/Classes/Pages/PlayerPage.xaml
@@ -0,0 +1,32 @@
+<phone:PhoneApplicationPage
+    x:Class="MPfm.WindowsPhone.PlayerPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
+    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    mc:Ignorable="d"
+    FontFamily="{StaticResource PhoneFontFamilyNormal}"
+    FontSize="{StaticResource PhoneFontSizeNormal}"
+    Foreground="{StaticResource PhoneForegroundBrush}"
+    SupportedOrientations="Portrait"  Orientation="Portrait"
+    shell:SystemTray.IsVisible="True">
+
+    <!--LayoutRoot is the root grid where all page content is placed-->
+    <Grid x:Name="LayoutRoot" Background="Transparent">
+        <!--Pivot Control-->
+        <phone:Pivot Title="MY APPLICATION">
+            <!--Pivot item one-->
+            <phone:PivotItem Header="item1">
+                <Grid/>
+            </phone:PivotItem>
+
+            <!--Pivot item two-->
+            <phone:PivotItem Header="item2">
+                <Grid/>
+            </phone:PivotItem>
+        </phone:Pivot>
+    </Grid>
+
+</phone:PhoneApplicationPage>
diff --git a/MPfm/MPfm.WindowsPhone/Classes/Pages/PlayerPage.xaml.cs b/MPfm/MPfm.WindowsPhone/Classes/Pages/PlayerPage.xaml.cs
@@ -0,0 +1,20 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Net;
+using System.Windows;
+using System.Windows.Controls;
+using System.Windows.Navigation;
+using Microsoft.Phone.Controls;
+using Microsoft.Phone.Shell;
+
+namespace MPfm.WindowsPhone
+{
+    public partial class PlayerPage : PhoneApplicationPage
+    {
+        public PlayerPage()
+        {
+            InitializeComponent();
+        }
+    }
+}
diff --git a/MPfm/MPfm.WindowsPhone/MPfm.WindowsPhone.csproj b/MPfm/MPfm.WindowsPhone/MPfm.WindowsPhone.csproj
@@ -123,11 +123,20 @@
     <Compile Include="App.xaml.cs">
       <DependentUpon>App.xaml</DependentUpon>
     </Compile>
+    <Compile Include="Classes\Controls\ListArtistControl.xaml.cs">
+      <DependentUpon>ListArtistControl.xaml</DependentUpon>
+    </Compile>
     <Compile Include="Classes\WindowsPhoneSyncDeviceSpecifications.cs" />
+    <Compile Include="Classes\Controls\ListSimpleControl.xaml.cs">
+      <DependentUpon>ListSimpleControl.xaml</DependentUpon>
+    </Compile>
     <Compile Include="LocalizedStrings.cs" />
-    <Compile Include="MainPage.xaml.cs">
+    <Compile Include="Classes\Pages\MainPage.xaml.cs">
       <DependentUpon>MainPage.xaml</DependentUpon>
     </Compile>
+    <Compile Include="Classes\Pages\PlayerPage.xaml.cs">
+      <DependentUpon>PlayerPage.xaml</DependentUpon>
+    </Compile>
     <Compile Include="Properties\AssemblyInfo.cs" />
     <Compile Include="Resources\AppResources.Designer.cs">
       <AutoGen>True</AutoGen>
@@ -140,7 +149,19 @@
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </ApplicationDefinition>
-    <Page Include="MainPage.xaml">
+    <Page Include="Classes\Controls\ListArtistControl.xaml">
+      <Generator>MSBuild:Compile</Generator>
+      <SubType>Designer</SubType>
+    </Page>
+    <Page Include="Classes\Controls\ListSimpleControl.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
+    <Page Include="Classes\Pages\MainPage.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
+    <Page Include="Classes\Pages\PlayerPage.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
@@ -201,6 +222,7 @@
     </ProjectReference>
   </ItemGroup>
   <ItemGroup>
+    <Reference Include="Microsoft.Phone.Controls, Version=8.0.0.0, Culture=neutral, PublicKeyToken=24eec0d8c86cda1e, processorArchitecture=MSIL" />
     <Reference Include="TinyIoC, Version=1.2.0.0, Culture=neutral, processorArchitecture=MSIL">
       <SpecificVersion>False</SpecificVersion>
       <HintPath>..\MPfm.Core\Lib\PCL\TinyIoC.dll</HintPath>