|
|
<Controls:MetroWindow
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="WpfApplication1.MainWindow"
xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
xmlns:pan="clr-namespace:PanoramaControl;assembly=PanoramaControl"
xmlns:local="clr-namespace:WpfApplication1"
x:Name="Window"
Title="MainWindow"
ShowTitleBar="True"
ShowIconOnTitleBar="false"
ResizeMode="CanResizeWithGrip"
Width="960" MinWidth="960" Height="540">
<Window.Resources>
<!-- JH Start - Copied from Generic.xaml so we can modify PanoramaGroup template -->
<Style x:Key="headerLabelStyle"
TargetType="Label">
<Setter Property="FontSize"
Value="{Binding RelativeSource={RelativeSource
AncestorType={x:Type pan:Panorama}, Mode=FindAncestor}, Path=HeaderFontSize}" />
<Setter Property="Foreground"
Value="{Binding RelativeSource={RelativeSource
AncestorType={x:Type pan:Panorama}, Mode=FindAncestor}, Path=HeaderFontColor}" />
<Setter Property="FontFamily"
Value="{Binding RelativeSource={RelativeSource
AncestorType={x:Type pan:Panorama}, Mode=FindAncestor}, Path=HeaderFontFamily}" />
<Setter Property="FontWeight"
Value="Normal" />
<Setter Property="HorizontalAlignment"
Value="Left" />
<Setter Property="HorizontalContentAlignment"
Value="Left" />
<Setter Property="VerticalAlignment"
Value="Center" />
<Setter Property="VerticalContentAlignment"
Value="Center" />
<Setter Property="Margin"
Value="10,0,0,20" />
</Style>
<!-- JH End - Copied from Generic.xaml so we can modify PanoramaGroup template -->
<!-- JH Start - PanoramaGroup: Replaces ItemsControl template for listbox with GridPanel and sets attached property ItemWidthSpan for double width items -->
<DataTemplate DataType="{x:Type pan:PanoramaGroup}">
<DataTemplate.Resources>
<Style x:Key="transparentListBoxItemStyle"
TargetType="{x:Type ListBoxItem}">
<Style.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}"
Color="Transparent" />
</Style.Resources>
<Setter Property="Padding"
Value="0" />
<Setter Property="Margin"
Value="0" />
<Style.Triggers>
<DataTrigger Binding="{Binding IsDoubleWidth}"
Value="True">
<Setter Property="pan:GridPanel.ItemWidthSpan"
Value="2" />
</DataTrigger>
</Style.Triggers>
</Style>
</DataTemplate.Resources>
<DockPanel LastChildFill="True"
Background="Transparent">
<Label Style="{StaticResource headerLabelStyle}"
Content="{Binding Header}"
DockPanel.Dock="Top" />
<ListBox ItemsSource="{Binding Tiles}"
SelectionMode="Single"
BorderThickness="0"
BorderBrush="Transparent"
Background="Transparent"
IsSynchronizedWithCurrentItem="True"
ItemContainerStyle="{StaticResource transparentListBoxItemStyle}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<pan:GridPanel ItemMargin="5"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ListBox>
</DockPanel>
</DataTemplate>
<!-- JH End - PanoramaGroup: Replaces ItemsControl template for listbox with GridPanel and sets attached property ItemWidthSpan for double width items -->
<DataTemplate DataType="{x:Type local:PanoramaTileViewModel}">
<Border x:Name="bord"
BorderThickness="2"
BorderBrush="{Binding RelativeSource={RelativeSource Mode=Self},
Path=Background}"
Background="{Binding RelativeSource={RelativeSource
AncestorType={x:Type pan:Panorama},
Mode=FindAncestor},
Path=TileColorPair[0]}"
Width="120" Height="120" Margin="0">
<StackPanel Orientation="Horizontal">
<Image x:Name="img"
Source="{Binding ImageUrl}"
Width="100"
Height="100"
HorizontalAlignment="Center"
VerticalAlignment="Center"
ToolTip="{Binding Text}" />
<Grid Margin="30,0,0,0"
HorizontalAlignment="Left"
VerticalAlignment="Center">
<Ellipse Stroke="White"
StrokeThickness="2"
Width="50"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Height="50" Fill="Transparent"/>
<Label x:Name="liveUpdate"
Content="{Binding Counter}"
Visibility="Collapsed"
HorizontalAlignment="Center"
HorizontalContentAlignment="Center"
VerticalAlignment="Center"
VerticalContentAlignment="Center"
Foreground="White"
FontFamily="Segoe UI"
FontSize="30"
FontWeight="DemiBold"/>
</Grid>
</StackPanel>
</Border>
<DataTemplate.Triggers>
<!-- JH Start - Bind to IsPressed as the selection state is not a reliable indicator
<DataTrigger Binding="{Binding RelativeSource={RelativeSource
AncestorType={x:Type ListBoxItem}, Mode=FindAncestor},
Path=IsSelected}"
Value="True">
<Setter TargetName="bord"
Property="BorderBrush"
Value="{Binding RelativeSource={RelativeSource
AncestorType={x:Type pan:Panorama}, Mode=FindAncestor},
Path=TileColorPair[1]}"/>
</DataTrigger>
JH End -->
<!-- JH Start - Handle IsPressed -->
<DataTrigger Binding="{Binding IsPressed}"
Value="True">
<!--<Setter TargetName="bord"
Property="BorderBrush"
Value="{Binding RelativeSource={RelativeSource
AncestorType={x:Type pan:Panorama}, Mode=FindAncestor},
Path=TileColorPair[1]}" />-->
<Setter TargetName="bord"
Property="Margin"
Value="4" />
<Setter TargetName="bord"
Property="Opacity"
Value="0.5" />
</DataTrigger>
<!-- JH End - Handle IsPressed -->
<DataTrigger Binding="{Binding IsDoubleWidth}"
Value="True">
<!-- JH Start - Handle IsDoubleWidth (include margins) -->
<Setter TargetName="bord"
Property="Width"
Value="250" />
<!-- JH End - Handle IsDoubleWidth -->
<Setter TargetName="img"
Property="HorizontalAlignment"
Value="Left" />
<Setter TargetName="img"
Property="Margin"
Value="10,0,0,0" />
<Setter TargetName="liveUpdate"
Property="Visibility"
Value="Visible" />
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</Window.Resources>
<Grid x:Name="LayoutRoot" Background="CornflowerBlue" Width="960" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<CheckBox x:Name="chkUseSNapBackScrolling"
Foreground="White"
Content="Use Snap Back Scrolling"
Margin="20,10,0,10"
IsChecked="True"
VerticalAlignment="Center"
VerticalContentAlignment="Center"
HorizontalAlignment="Left"
HorizontalContentAlignment="Left" />
<!-- UseSnapBackScrolling changed to TwoWay as the Panorama code can change it -->
<pan:Panorama Grid.Row="1" x:Name="pan"
UseSnapBackScrolling="{Binding ElementName=chkUseSNapBackScrolling, Path=IsChecked, Mode=TwoWay}"
ItemsSource="{Binding PanoramaItems}"
ItemBox="120"
GroupHeight="360"
Background="Transparent" />
</Grid>
</Controls:MetroWindow>
|
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.
I currently hold the following qualifications (amongst others, I also studied Music Technology and Electronics, for my sins)
- MSc (Passed with distinctions), in Information Technology for E-Commerce
- BSc Hons (1st class) in Computer Science & Artificial Intelligence
Both of these at Sussex University UK.
Award(s)
I am lucky enough to have won a few awards for Zany Crazy code articles over the years
- Microsoft C# MVP 2016
- Codeproject MVP 2016
- Microsoft C# MVP 2015
- Codeproject MVP 2015
- Microsoft C# MVP 2014
- Codeproject MVP 2014
- Microsoft C# MVP 2013
- Codeproject MVP 2013
- Microsoft C# MVP 2012
- Codeproject MVP 2012
- Microsoft C# MVP 2011
- Codeproject MVP 2011
- Microsoft C# MVP 2010
- Codeproject MVP 2010
- Microsoft C# MVP 2009
- Codeproject MVP 2009
- Microsoft C# MVP 2008
- Codeproject MVP 2008
- And numerous codeproject awards which you can see over at my blog
Submit an article or tip