Scrollviewer中的自适应触发器不起作用

时间:2015-12-19 18:41:43

标签: xaml uwp

我使用自适应触发器使我的UWP应用程序的内容适合窗口大小。如果窗口小于1000px,则将堆叠所有三个矩形。如果不是,前两个矩形将并排,第三个将填充两个第一个矩形下方的整个窗口宽度。

<Page
x:Class="App4.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App4"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled" HorizontalScrollMode="Disabled">
    <Grid  Margin="10,0,10,0" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup>
                    <VisualState>
                        <VisualState.StateTriggers>
                            <AdaptiveTrigger MinWindowWidth="1000" />
                        </VisualState.StateTriggers>

                        <VisualState.Setters>
                            <Setter Target="Rect2.(Grid.Row)" Value="0" />
                            <Setter Target="Rect2.(Grid.Column)" Value="1" />
                            <Setter Target="Rect2.(Grid.ColumnSpan)" Value="1"/>
                            <Setter Target="Rect1.(Grid.ColumnSpan)" Value="1"/>
                        </VisualState.Setters>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>

            <Grid.ColumnDefinitions>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition></RowDefinition>
            </Grid.RowDefinitions>

            <Rectangle Name="Rect1" Grid.Row="0" Grid.ColumnSpan="2" Grid.Column="0"  Margin="10" Height="170" Fill="Red"/>
            <Rectangle Name="Rect2" Grid.Row="1" Grid.ColumnSpan="2" Grid.Column="0"  Margin="10" Height="170" Fill="Green"/>
            <Rectangle Grid.Row="2" Grid.ColumnSpan="2" Grid.Column="0" Height="400" Margin="10" Fill="Yellow"/>
        </Grid>
</ScrollViewer>

但是,只有删除ScrollViewer周围的Grid后,自适应触发才有效。 HorizontalScrollMode的{​​{1}}已被停用,但仍然无法正常工作:所有矩形都已堆叠,更改窗口宽度无效。

有没有办法让这个工作ScrollViewer

1 个答案:

答案 0 :(得分:2)

你必须在XAML的第一个控件中设置setter,如果你将第一个Grid更改为ScrollViewer,你必须在Grid之前设置setter:

char*
strcpy(char *dst, const char *src)
{
   char *s = dst;
   while(*dst++ = *src++); // copy so long as there is
                           // '\0' found in src (including copying of that '\0')
   return s;
}