代码之家 › 专栏 › 技术社区 › Craig

VisualStateManager在使用嵌套网格控件时不更新网格属性

uwp-xaml uwp xaml

Craig · 技术社区 · 6 年前

上下文 :我想在某些情况下使用VisualStateManager将StackPanel移动到其他网格列。

问题 :嵌套的网格控件似乎阻止了VisualState setter的应用。在下面的示例中(已从原始代码中简化),如果OuterGrid被注释掉,VisualState setter将触发,但当OuterGrid存在时不会触发。

问题 :使用嵌套网格时,如何触发VisualState setter?

示例:

<Grid x:Name="OuterGrid">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="12"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <StackPanel 
            Grid.Column="0"
            >
            <Button 
                x:Name="Button1"
                HorizontalAlignment="Stretch"
                Content="Button1"
                />
        </StackPanel>

        <StackPanel 
            x:Name="Button2"
            Grid.Column="2"
            >
            <HyperlinkButton
                Height="36"
                HorizontalAlignment="Stretch"
                >
                <TextBlock
                    Text="Button2"
                    />
            </HyperlinkButton>
        </StackPanel>

        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="ButtonAlignments">
                <VisualState>
                    <!-- Move Button2 to the left column -->
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="600" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="Button2.(Grid.Column)" Value="0" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
    </Grid>
</Grid>

1 回复 | 直到 6 年前

Mikolaj Kieres 6 年前

您需要在XAML树的根级别定义视觉状态, as per docs 。

只需移动 <VisualStateManager.VisualStateGroups> 进入 OuterGrid .我把你的样品改了一点-它正在与 Visibility 而不是 Grid.Column :

<Grid x:Name="OuterGrid">
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="ButtonAlignments">
            <VisualState>
                <!-- Move Button2 to the left column -->
                <VisualState.Setters>
                    <!--<Setter Target="Button2.(Grid.Column)"
                                Value="0" />-->
                    <Setter Target="Button2.(UIElement.Visibility)"
                            Value="Visible" />
                </VisualState.Setters>
                <VisualState.StateTriggers>
                    <AdaptiveTrigger MinWindowWidth="600" />
                </VisualState.StateTriggers>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    <Grid>

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

        <StackPanel Grid.Column="0">
            <Button x:Name="Button1"
                    HorizontalAlignment="Stretch"
                    Content="Button1" />
        </StackPanel>

        <StackPanel x:Name="Button2"
                    Grid.Column="2"
                    Visibility="Collapsed">
            <HyperlinkButton Height="36"
                             HorizontalAlignment="Stretch">
                <TextBlock Text="Button2" />
            </HyperlinkButton>
        </StackPanel>

    </Grid>
</Grid>