Question

我正在开发一个uwp应用程序，我正在使用模板10.我已经完成了这个代码：

<VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="AdaptiveVisualStateGroup">
                <VisualState x:Name="VisualStateNarrow">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="{StaticResource NarrowMinWidth}" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <!--  TODO: change properties for narrow view  -->
                        <!--<Setter Target="stateTextBox.Text" Value="Narrow Visual State" />-->
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="VisualStateNormal">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="{StaticResource NormalMinWidth}" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <!--  TODO: change properties for normal view  -->
                        <!--<Setter Target="stateTextBox.Text" Value="Normal Visual State" />-->
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="VisualStateWide">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="{StaticResource WideMinWidth}" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <!--  TODO: change properties for wide view  -->
                        <!--<Setter Target="stateTextBox.Text" Value="Wide Visual State" />-->
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

我正在应用中设置目前的广告。在桌面上我想：

<UI:AdControl ApplicationId="3f83fe91-d6be-434d-a0ae-7351c5a997f1"
                          AdUnitId="test"
                          RelativePanel.AlignTopWithPanel="True"
                          RelativePanel.AlignHorizontalCenterWithPanel="True"
                          Margin="0,25,0,0"
                          Height="90"
                          Width="728"/>

在移动设备上这样：

<UI:AdControl ApplicationId="3f83fe91-d6be-434d-a0ae-7351c5a997f1"
                          AdUnitId="test"
                          RelativePanel.AlignTopWithPanel="True"
                          RelativePanel.AlignHorizontalCenterWithPanel="True"
                          Margin="0,25,0,0"
                          Height="50"
                          Width="300"/>

如何更改桌面和移动设备的尺寸？

Answer 1

您有2个选择可以使用自适应，或者您已使用设备系列视图

自适应将是我的选择，只需使用setter进行控制。给adcontrol一个名称，然后在setter中你将有类似的东西

  <UI:AdControl ApplicationId="GUID" AdUnitId="Test" 
               Name="SomeAdControl" ... />     


  <!-- narrow -->
 <VisualState.Setter>
   <Setter Target="SomeAdControl.Width" Value="300" />
   <Setter Target="SomeAdControl.Height" Value="50" />
 <VisualState.Setter/>

 <!--- Normal -->
 <VisualState.Setter>
   <Setter Target="SomeAdControl.Width" Value="768" />
   <Setter Target="SomeAdControl.Height" Value="90" />
 </VisualState.Setter>

根据触发的VisualTrigger，它是具有不同尺寸的相同控件。

第二个选项是设备系列视图，例如，您可以为分隔创建文件夹，或者您可以创建特定于此情况的视图

  MainPage.DeviceFamily-Mobile.xaml
  MainPage.DeviceFamily-Desktop.xaml
  MainPage.xaml

所有这些都是局部的，具有不同的视图布局。或者命名文件夹 DeviceFamily-Mobile并将部分类MainPage.xaml放在该文件夹中

调整内容到屏幕大小（UWP应用程序）

1 个答案: