none
VisualStates and Triggers Within an ItemTemplate/DataTemplate RRS feed

  • Question

  • I have a Flipview with a item template defined and I'm trying to use a visual state trigger to change the font size.

    Below is a basic version of what I have, but it isn't working. I have similar triggers working elsewhere in my app, but when I use the triggers in a datatemplate it doesn''t work. I'm sure I'm not doing something right, but need some guidance on what to do. I appreciate any help.

            <FlipView x:Name="m_pFlipView" Background="Transparent">
                <FlipView.ItemTemplate>
                    <DataTemplate>
                        <Grid HorizontalAlignment="Left" Margin="25">
    
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup>
                                    <VisualState>
                                        <VisualState.StateTriggers>
                                            <AdaptiveTrigger MinWindowWidth="1024" />
                                        </VisualState.StateTriggers>
                                        <VisualState.Setters>
                                            <Setter Target="lblDate.FontSize" Value="50" />
                                        </VisualState.Setters>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
    
                            <TextBlock x:Name="lblDate" Text="Example Text" FontSize="20"/>
                        </Grid>
                    </DataTemplate>
                </FlipView.ItemTemplate>
            </FlipView>



    • Edited by RobertLewis Wednesday, November 18, 2015 9:41 PM Further stripped xaml down to only relevant parts.
    Wednesday, November 18, 2015 9:40 PM

Answers

  • Hi,

    I haven't yet tried your specific example here but I think this article;

    https://marcominerva.wordpress.com/2015/05/12/adaptive-triggers-relativepanel-and-datatemplate-in-universal-windows-platform/

    might help here - i.e. making your template into a UserControl and putting the triggers in that control.

    Does that help?

    Thanks,

    Mike.

    Wednesday, November 18, 2015 10:49 PM

All replies

  • Hi,

    I haven't yet tried your specific example here but I think this article;

    https://marcominerva.wordpress.com/2015/05/12/adaptive-triggers-relativepanel-and-datatemplate-in-universal-windows-platform/

    might help here - i.e. making your template into a UserControl and putting the triggers in that control.

    Does that help?

    Thanks,

    Mike.

    Wednesday, November 18, 2015 10:49 PM
  • Hi RobertLewis,

    Welcome to the Developing Universal Windows apps forum!

    As a friendly reminder please make sure to add the appropriate tags to the title of your post as per Guide to posting: subject line tags

    I have tested @Mike Taulty's solution it should work for you, we can not add the AdaptiveTrigger directly to the DataTemplate, we need to wrap the DataTemplate inside a UserControl as following:

    <FlipView x:Name="m_pFlipView" Background="Transparent">
                <FlipView.ItemTemplate>
                    <DataTemplate>
                      <UserControl>
                        <Grid HorizontalAlignment="Left" Margin="25">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup>
                                    <VisualState>
                                        <VisualState.StateTriggers>
                                            <AdaptiveTrigger MinWindowWidth="1024" />
                                        </VisualState.StateTriggers>
                                        <VisualState.Setters>
                                            <Setter Target="lblDate.FontSize" Value="50" />
                                        </VisualState.Setters>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <TextBlock x:Name="lblDate" Text="Example Text" FontSize="20"/>
                        </Grid>
                       </UserControl>
                    </DataTemplate>
                </FlipView.ItemTemplate>
     </FlipView>


    Best Regards,
    Amy Peng


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.


    Thursday, November 19, 2015 6:03 AM
    Owner
  • Yes, that works. Thank you!
    Thursday, November 19, 2015 3:33 PM
  • Hi RobertSladeLewis,

    Since your problem has been solved, please mark the replies which help you as answer, it will help the others who meet the same question as you. :)

    Best Regards,
    Amy Peng


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Friday, November 20, 2015 1:56 AM
    Owner