|
<phone:PhoneApplicationPage
Style="{StaticResource DefaultPage}"
x:Class="RegiRide.Views.MainPage"
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"
xmlns:Navigation="clr-namespace:RegiRide.Navigation"
xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
xmlns:ext="clr-namespace:RegiRide.Utils"
xmlns:Custom="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True"
Navigation:Navigator.Source="{Binding}"
DataContext="{Binding Source={StaticResource ViewModelLocator}, Path=RideListViewModel}"
mc:Ignorable="d" d:DesignHeight="696" d:DesignWidth="480"
toolkit:TiltEffect.IsTiltEnabled="True">
<phone:PhoneApplicationPage.Resources>
<DataTemplate x:Key="GroupHeader">
<Border Background="{StaticResource PhoneAccentBrush}" Padding="{StaticResource PhoneTouchTargetOverhang}">
<StackPanel Orientation="Horizontal">
<TextBlock TextWrapping="Wrap" Text="{Binding Key}" Style="{StaticResource PhoneTextExtraLargeStyle}" Margin="0" />
</StackPanel>
</Border>
</DataTemplate>
<DataTemplate x:Key="Item">
<StackPanel Orientation="Horizontal" Margin="0,6" Height="Auto">
<StackPanel Orientation="Horizontal" Margin="13,0,0,0">
<TextBlock Text="{Binding RideDateFormatted}" Style="{StaticResource PhoneTextLargeStyle}" Margin="0,-7,12,0" VerticalAlignment="Top" Height="58" Width="82" />
<TextBlock Text="{Binding Distance}" Style="{StaticResource PhoneTextSmallStyle}" Margin="-6,0,0,0" Height="26" VerticalAlignment="Top" Width="48" TextAlignment="Right">
<TextBlock.Foreground>
<SolidColorBrush Color="{StaticResource PhoneAccentColor}"/>
</TextBlock.Foreground>
</TextBlock>
</StackPanel>
<StackPanel Orientation="Vertical" Margin="12,0" Height="Auto">
<TextBlock Style="{StaticResource PhoneTextSmallStyle}" Margin="0" Width="280" Height="26" HorizontalAlignment="Left" Text="{Binding AddressFromName}" Foreground="{StaticResource PhoneForegroundBrush}" />
<TextBlock Style="{StaticResource PhoneTextSmallStyle}" Margin="0,6,0,0" Width="280" Height="26" HorizontalAlignment="Left" Text="{Binding AddressToName}" Foreground="{StaticResource PhoneForegroundBrush}"/>
</StackPanel>
</StackPanel>
</DataTemplate>
<DataTemplate x:Key="groupItemHeader">
<Border Background="{StaticResource PhoneAccentBrush}" Margin="{StaticResource PhoneTouchTargetOverhang}" Padding="{StaticResource PhoneTouchTargetOverhang}">
<TextBlock Text="{Binding Key}" Style="{StaticResource PhoneTextLargeStyle}"/>
</Border>
</DataTemplate>
</phone:PhoneApplicationPage.Resources>
<Custom:Interaction.Triggers>
<Custom:EventTrigger>
<Custom:InvokeCommandAction Command="{Binding LoadRideListCommand}"/>
</Custom:EventTrigger>
</Custom:Interaction.Triggers>
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="{Binding LocalizedResources.ApplicationTitle, Source={StaticResource LocalizedStrings}}" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="{Binding LocalizedResources.RideListPageTitle, Source={StaticResource LocalizedStrings}}" Margin="12,-7,12,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<toolkit:LongListSelector Name="RideList"
ItemsSource="{Binding GroupedRideViewModels}"
GroupHeaderTemplate="{StaticResource GroupHeader}"
GroupItemTemplate="{StaticResource groupItemHeader}"
ItemTemplate="{StaticResource Item}"
ext:LongListSelectorExtension.Command="{Binding SelectionChangedCommand}">
<toolkit:LongListSelector.GroupItemsPanel>
<ItemsPanelTemplate>
<toolkit:WrapPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</toolkit:LongListSelector.GroupItemsPanel>
</toolkit:LongListSelector>
</Grid>
</Grid>
<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar>
<shell:ApplicationBar.MenuItems>
<shell:ApplicationBarMenuItem x:Name="AddressesMenuItem" Text="Addresses" Click="ApplicationBarMenuItemAddresses_Click"/>
<shell:ApplicationBarMenuItem x:Name="AboutMenuItem" Text="About" Click="ApplicationBarMenuItemAbout_Click"/>
</shell:ApplicationBar.MenuItems>
<shell:ApplicationBarIconButton IconUri="/icons/appbar.add.rest.png" Text="Add" Click="ApplicationBarIconButtonAdd_Click"/>
<shell:ApplicationBarIconButton IconUri="/icons/appbar.feature.settings.rest.png" Click="ApplicationBarIconButtonSettings_Click" Text="settings"/>
<shell:ApplicationBarIconButton IconUri="/icons/appbar.cabinet.out.png" Click="ApplicationBarIconButtonEmail_Click" Text="export"/>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>
</phone:PhoneApplicationPage>
|
By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.
If a file you wish to view isn't highlighted, and is a text file (not binary), please
let us know and we'll add colourisation support for it.
Patrick Kalkman is a senior Software Architect with more than 20 years professional development experience. He works for
SimpleTechture where he helps teams develop state of the art web applications.
Patrick enjoys writing his
blog. It discusses agile software development. Patrick can be reached at patrick@simpletechture.nl.
Published Windows 8 apps:
Published Windows Phone apps:
Awards:
Best Mobile article of March 2012
Best Mobile article of June 2012