使用UWP中的Visual State Manager更改网格内部的样式

Question

我是Visual Studio的新手。如何使用Visual State Manager创建自适应触发器？最近我有使用网格的XAML代码。因此，我希望每次更改应用程序大小时，都应更改单元格内的文本（大小和颜色）。但这并没有改变。这是代码。

感谢您的任何帮助。

<Page
    x:Class="_251707_lab2.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:_251707_lab2"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid Name="coffeeMachineGrid" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" FocusVisualPrimaryBrush="White">


        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="VisualStateGroup">
                <VisualState x:Name="forTablet">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="600"/>
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="coffeeMachineGrid.whichCofeeCell.Fill" Value="Green"/>
                        <Setter Target="myName.(TextBlock.FontSize)" Value="40" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

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

        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <Rectangle  Fill="Beige" Grid.Row="0"/>
        <Rectangle x:Name="whichCofeeCell" Grid.Row="1" Fill="LightSteelBlue" />
        <Rectangle Fill="PaleVioletRed" Grid.Row="2"/>
        <Rectangle Fill="LightGreen" Grid.Row="3"/>

        <Rectangle Fill="Black" Grid.Column="1"/>
        <Rectangle Fill="Purple" Grid.Column="2"/>

        <Rectangle Fill="ForestGreen" Grid.Column="1" Grid.Row="1"/>
        <Rectangle Fill="AliceBlue"  Grid.Column="2" Grid.Row="1"/>

        <Rectangle Fill="HotPink" Grid.Column="1" Grid.Row="2"/>
        <Rectangle Fill="Chocolate"  Grid.Column="2" Grid.Row="2"/>

        <Rectangle Fill="DarkBlue" Grid.Column="1" Grid.Row="3"/>
        <Rectangle Fill="Crimson"  Grid.Column="2" Grid.Row="3"/>

        <TextBox x:Name="theTitle" HorizontalAlignment="Center" Margin="0,27,0,0" Text="Wonderful Coffee machine. " TextWrapping="Wrap" VerticalAlignment="Top" IsReadOnly="True"/>
        <TextBlock x:Name="myName" Grid.Column="2" HorizontalAlignment="Center" Text="zen huzaini 251707" TextWrapping="Wrap" VerticalAlignment="Center" Width="98" RenderTransformOrigin="-0.396,0.361"/>
        <TextBox x:Name="whihCoffee" HorizontalAlignment="Center" Margin="0,21,0,0" Text="Which Coffee" TextWrapping="Wrap" VerticalAlignment="Top" Grid.Row="1" FocusVisualPrimaryBrush="#FF4D0303" IsReadOnly="True"/>
        <TextBox x:Name="price" IsReadOnly="True" Grid.Column="2" HorizontalAlignment="Center" Grid.Row="3" Text="Price" TextWrapping="Wrap" VerticalAlignment="Center" FocusVisualPrimaryBrush="White" Foreground="White" FontSize="20"/>
        <TextBox x:Name="withSugar" Grid.Column="2" HorizontalAlignment="Left" Margin="13,21,0,0" Grid.Row="1" Text="With Sugar" TextWrapping="Wrap" VerticalAlignment="Top" Foreground="#FF36023E" FocusVisualPrimaryBrush="#FF3E0228" FontSize="14" IsReadOnly="True"/>
        <TextBox x:Name="withCream" IsReadOnly="True" Grid.Column="1" HorizontalAlignment="Center" Margin="0,21,0,0" Grid.Row="1" Text="With Cream" TextWrapping="Wrap" VerticalAlignment="Top" RenderTransformOrigin="-1.415,0.098" Foreground="White" FontSize="14" FocusVisualPrimaryBrush="White"/>
        <TextBox x:Name="getDiscount" IsReadOnly="True" HorizontalAlignment="Left" Margin="8,23,0,0" Grid.Row="2" Text="Get Discount" TextWrapping="Wrap" VerticalAlignment="Top"/>
        <TextBox x:Name="enterNumber" HorizontalAlignment="Left" Margin="21,0,0,0" Grid.Row="2" Text="TextBox" TextWrapping="Wrap" VerticalAlignment="Center" FocusVisualPrimaryBrush="White" Foreground="White" FontSize="16"/>
        <Button x:Name="checkDiscount" Content="Chek Now" Grid.Column="1" Margin="0,59,0,0" Grid.Row="2" VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="18" FocusVisualPrimaryBrush="White" Foreground="White"/>
        <TextBox x:Name="doIgetDiscount" Grid.Column="2" HorizontalAlignment="Center" Grid.Row="2" Text="???" TextWrapping="Wrap" VerticalAlignment="Center" IsReadOnly="True" FontSize="20" Foreground="White" FocusVisualPrimaryBrush="White"/>
        <Button x:Name="pay" Content="Pay" Grid.Column="1" Margin="0,59,0,0" Grid.Row="3" VerticalAlignment="Top" HorizontalAlignment="Center" FocusVisualPrimaryBrush="White" Foreground="White"/>

    </Grid>
</Page>

Answer 1

Setter的目标设置目标元素上属性的路径以将值应用到该对象，首先，您设置的目标“ coffeeMachineGrid.whichCofeeCell.Fill”不正确，因为whichCofeeCell不是coffeeMachineGrid的属性，因此目标元素，您只需要使用whichCofeeCell.Fill作为目标即可。例如：