Skip to content

Instantly share code, notes, and snippets.

@brendankowitz
Created May 21, 2013 11:23
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save brendankowitz/5619131 to your computer and use it in GitHub Desktop.
Save brendankowitz/5619131 to your computer and use it in GitHub Desktop.
WinRT + ExtendedVisualStateManager + Caliburn = Visual State Groups in a ListItem DataTemplate
<ListBox x:Name="SpecialsList"
ItemsSource="{Binding MaxFares}"
SelectedItem="{Binding SelectedFare, Mode=TwoWay}"
ScrollViewer.VerticalScrollBarVisibility="Disabled"
BorderThickness="0" BorderBrush="Transparent"
HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch"
Foreground="{StaticResource VirginCharcoalBrush}"
Background="{StaticResource VirginRedBrush}"
ScrollViewer.VerticalScrollMode="Disabled"
ScrollViewer.IsVerticalScrollChainingEnabled="True"
ItemContainerStyle="{StaticResource AlertsListBoxItemStyleTouch}"
Style="{StaticResource NoScrollListBoxStyle}"
cal:Action.TargetWithoutContext="SetListItemDataTemplateState"
cal:Message.Attach="[Event SelectionChanged] = [Action SelectionChanged($source, $eventArgs)]">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid x:Name="RootLayout">
<VisualStateManager.CustomVisualStateManager>
<common:ExtendedVisualStateManager />
</VisualStateManager.CustomVisualStateManager>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="ToSelected">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="PriceContainer" EnableDependentAnimation="True">
<DiscreteObjectKeyFrame KeyTime="0" Value="Green"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="PriceSymbol" EnableDependentAnimation="True">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource VirginRedBrush}"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PriceText" EnableDependentAnimation="True">
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Normal"/>
<VisualState x:Name="Unselected"/>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
public class SetListItemDataTemplateState
{
public void SelectionChanged(dynamic sender, dynamic args)
{
var container = sender.ItemContainerGenerator;
foreach (var item in args.AddedItems)
{
var listItem = container.ContainerFromItem(item);
var layout = FrameworkElementExtensions.FindDescendantByName(listItem, "RootLayout");
ExtendedVisualStateManager.GoToElementState(layout, "ToSelected", true);
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment