Question

我创建了一个具有两个不同视图的自适应触发器。当程序独立于分辨率启动时，所有Setter都能正常工作，但是在我们达到breakpiont时调整大小后，正确安排会出现问题。这让我很困惑。

<VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="SmallScreen">
            <VisualState>
                <VisualState.StateTriggers>
                    <AdaptiveTrigger MinWindowWidth="0"/>
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Target="ImgPanel.(Grid.Row)" Value="0"/>
                    <Setter Target="ImgPanel.(Grid.Column)" Value="0"/>
                    <Setter Target="TextPanel.(Grid.Row)" Value="1"/>
                    <Setter Target="TextPanel.(Grid.Column)" Value="0"/>
                    <Setter Target="ImgPanel.(Grid.ColumnSpan)" Value="2"/>
                    <Setter Target="TextPanel.(Grid.ColumnSpan)" Value="2"/>
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>
        <VisualStateGroup x:Name="BigScreen">
            <VisualState>
                <VisualState.StateTriggers>
                    <AdaptiveTrigger MinWindowWidth="720"/>
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Target="ImgPanel.(Grid.Row)" Value="0"/>
                    <Setter Target="ImgPanel.(Grid.Column)" Value="0"/>
                    <Setter Target="TextPanel.(Grid.Row)" Value="0"/>
                    <Setter Target="TextPanel.(Grid.Column)" Value="1"/>
                    <Setter Target="ImgPanel.(Grid.ColumnSpan)" Value="1"/>
                    <Setter Target="TextPanel.(Grid.ColumnSpan)" Value="1"/>
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>

    </VisualStateManager.VisualStateGroups>
    <Pivot Title="Pivot">
        <PivotItem Header="Head">
            <ScrollViewer>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                    <StackPanel x:Name="ImgPanel">
                <Image x:Name="Image" Source="/Assets/someImage.jpg" Width="200" />
                        <TextBlock x:Name="TitleTxt" Text="Title" FontWeight="Bold" FontSize="18.667" HorizontalAlignment="Center"/>
                    </StackPanel>
                        <StackPanel x:Name="TextPanel">
                    <Rectangle Height="32" Fill="#C33D27" />
                        <TextBlock x:Name="Text" Text="Place for long text" TextTrimming="WordEllipsis" TextWrapping="Wrap" />
                            </StackPanel>
                </Grid>
            </ScrollViewer>
        </PivotItem>

Answer 1

那是因为这两个VisualStates位于两个不同的VisualStateGroup中。每个VisualStateGroup都可以激活一个VisualState，这意味着在您的情况下两个VisualStates同时处于活动状态。

首先，只有MinWindowWidth VisualState处于活动状态。调整窗口大小时，会激活第二个VisualState。要解决此问题，请确保这些VisualStates位于同一个VisualStateGroup中。

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="SmallScreen">
        <VisualState>
            <VisualState.StateTriggers>
                <AdaptiveTrigger MinWindowWidth="0"/>
            </VisualState.StateTriggers>
            <VisualState.Setters>
                <Setter Target="ImgPanel.(Grid.Row)" Value="0"/>
                <Setter Target="ImgPanel.(Grid.Column)" Value="0"/>
                <Setter Target="TextPanel.(Grid.Row)" Value="1"/>
                <Setter Target="TextPanel.(Grid.Column)" Value="0"/>
                <Setter Target="ImgPanel.(Grid.ColumnSpan)" Value="2"/>
                <Setter Target="TextPanel.(Grid.ColumnSpan)" Value="2"/>
            </VisualState.Setters>
        </VisualState>
        <VisualState>
            <VisualState.StateTriggers>
                <AdaptiveTrigger MinWindowWidth="720"/>
            </VisualState.StateTriggers>
            <VisualState.Setters>
                <Setter Target="ImgPanel.(Grid.Row)" Value="0"/>
                <Setter Target="ImgPanel.(Grid.Column)" Value="0"/>
                <Setter Target="TextPanel.(Grid.Row)" Value="0"/>
                <Setter Target="TextPanel.(Grid.Column)" Value="1"/>
                <Setter Target="ImgPanel.(Grid.ColumnSpan)" Value="1"/>
                <Setter Target="TextPanel.(Grid.ColumnSpan)" Value="1"/>
            </VisualState.Setters>
        </VisualState>
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

自适应触发器在断点之后不会返回初始状态

1 个答案: