尝试根据设备大小调整图片大小

时间:2016-12-10 10:32:22

标签: xaml uwp

我正在尝试在UWP平台上调整不同尺寸设备上的图片尺寸。但是在下面的代码中面临一些问题。我正在尝试使用Visual State Manager,以便在不同大小的设备上打开时调整图像大小

<Setter Target="rowDefNavPanel" Value="0"></Setter>
<Setter Target="imglearn.(width)" Value="180"/>

任何帮助将不胜感激。 Xaml代码

<Grid>
    <Grid.Background>
        <ImageBrush Stretch="Fill" ImageSource="ms-appx:///Assets/Home/home_android.jpg"/>
    </Grid.Background>
    <Grid.RowDefinitions>            
        <RowDefinition x:Name="rowDefNavPanel" Height="*"/>            
    </Grid.RowDefinitions>        
        <RelativePanel x:Name="homepanel">            
            <Image x:Name="imglearn" Source="Assets/Home/btn_learn_color.png"              
           HorizontalAlignment="Left"
           VerticalAlignment="Bottom"
           Margin="20,90,0,60"               
           Width="180" Height="200"  Stretch="Uniform"
           />
            <Image x:Name="imgPaint" Source="Assets/Home/btn_paint.png"              
          RelativePanel.AlignLeftWith="imglearn"
           Margin="200,140,0,0"
           Width="180" Height="200"  Stretch="Uniform"
          />
            <Image x:Name="imgQuiz" Source="Assets/Home/btn_quiz.png"              
           RelativePanel.AlignTopWithPanel="True"
           RelativePanel.AlignRightWithPanel="True"
           Margin="0,50,30,0"
           Width="180" Height="200" Stretch="Uniform"
           />
            <Image x:Name="OtherApps" Source="Assets/Home/btn_other_app.png"              
           RelativePanel.AlignRightWithPanel="True"
           RelativePanel.AlignBottomWithPanel="True"
           Margin="0,0,30,0"
           Width="180" Height="200"  Stretch="Uniform"
           />
        </RelativePanel>

    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup>
            <VisualState x:Name="vsState">
                <VisualState.StateTriggers>
                    <AdaptiveTrigger MinWindowWidth="0"/>
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Target="rowDefNavPanel" Value="0"></Setter>
                    <Setter Target="imglearn.(width)" Value="180"/>
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>      
</Grid>

enter image description here

0 个答案:

没有答案