自适应触发器在用户控件中不起作用答案

【问题标题】：Adaptive trigger doesn't work in a user control自适应触发器在用户控件中不起作用
【发布时间】：2016-05-23 13:06:47
【问题描述】：

我正在开发 UWP 应用。我已经在使用自适应触发器来根据窗口的宽度调整我的 xaml，并且它可以工作.. 仅在页面中。

现在我想对用户控件的 xaml 做同样的事情，但它不起作用.. 但是我将 VisualStateManager 放到用户控件的根网格中。

有区别吗？

这是我的用户控件的代码：

<UserControl
    x:Class=.....>

<UserControl.Resources>
    <ResourceDictionary>
        <vm:ViewModelLocator x:Key="Locator"/>
        <converters:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
    </ResourceDictionary>
</UserControl.Resources>

<UserControl.DataContext>
    <Binding Path="MyUserControlVM" Source="{StaticResource Locator}"/>
</UserControl.DataContext>


<Grid x:Name="LayoutRoot" Background="white">

    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup>
            <VisualState x:Name="Narrow">
                <VisualState.StateTriggers>
                    <AdaptiveTrigger MinWindowWidth="0" />
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Target="LastName.Foreground" Value="Red" />
                    <Setter Target="LastName.Fontsize" Value="10" />
                    <Setter Target="FirstName.Foreground" Value="Red"/>
                </VisualState.Setters>
            </VisualState>
            <VisualState x:Name="Normal">
                <VisualState.StateTriggers>
                    <AdaptiveTrigger MinWindowWidth="600" />
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Target="LastName.Foreground" Value="Red" />
                    <Setter Target="LastName.Fontsize" Value="25" />
                    <Setter Target="FirstName.Foreground" Value="Red"/>
                </VisualState.Setters>
            </VisualState>
            <VisualState x:Name="Wide">
                <VisualState.StateTriggers>
                    <AdaptiveTrigger MinWindowWidth="1000"/>
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Target="LastName.Foreground" Value="Red" />
                    <Setter Target="FirstName.Foreground" Value="Red"/>
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

    <Listbox>
        ...
    </ListBox>
    <TextBlock x:Name="lblNoData" Grid.ColumnSpan="2" Text="No Data"  Visibility="{Binding NoDataVisible, Converter={StaticResource BooleanToVisibilityConverter}}"/>
    <ProgressRing x:Name="prLoading" Width="60" Height="60" Foreground="Blue" IsActive="{Binding InitializationNotifier.IsNotCompleted}" />
</Grid>

（“LastName”和“FirstName”是我列表框的 DataTemplate 中的文本块。我只是想将我的文本设置为红色，以便查看触发器何时起作用）

我在这样一个简单的页面中调用用户控件：

<Grid x:Name="LayoutRoot" Background="{StaticResource white}">

    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <StackPanel Grid.Row="0" Margin="0,0,0,10">
        ...
    </StackPanel>

    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="10,0">
        <UC:MyUserControl/>
    </Grid>
</Grid>

我不明白为什么这段代码不起作用。提前感谢您的帮助！

【问题讨论】：

标签： xaml uwp

【解决方案1】：

（“LastName”和“FirstName”是我列表框的 DataTemplate 中的文本块。我只是想将我的文本设置为红色，以便查看触发器何时起作用）

您可以参考我的另一个答案here，正如我在那个答案中所说，当控件放在DataTemplate 中时，它们就变成了您的数据对象的可视结构。我认为只有在 xaml 代码中才能完成这项工作，这里的数据绑定是你的朋友。

从您的代码中，我可以看到您想要更改 Foreground（但全部更改为 Red？）和 TextBlocks 内部的 FontSize DataTemplate，具体取决于窗口的大小。所以你可以将这两个属性绑定到窗口的大小，或者你可以在窗口大小改变时使用ItemsControl.ItemTemplateSelector来选择不同的模板。

【讨论】：

谢谢，这就是我要找的解释！