UWP 适配不同设备 屏幕

 1、DeviceFamily-Type文件夹

将Index.xaml拷贝到DeviceFamily-Desktop 和DeviceFamily-Mobile,删除这2个目录下的Index.xmal.cs 文件。

UWP 适配不同设备 屏幕

 2、DeviceFamily-Type扩展

 通过创建新的XAML视图达到同样的效果,使用同样的名称,但是DeviceFamily-Type是扩展的。比如MainPage页面,它意思是添加一个新的XAML视图文件叫MainPage.DeviceFamily-Mobile.xaml,它放在和MainPage同样的文件夹。

UWP 适配不同设备 屏幕

3、InitializeComponent重载

public MainPage() 
{
    if (AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Mobile")
    {
        if (usePrimary)
        {
            InitializeComponent(new Uri("ms-appx:///PrimaryMainPage.xaml", UriKind.Absolute));
        }
        else
        {
            InitializeComponent(new Uri("ms-appx:///SecondaryMainPage.xaml", UriKind.Absolute));
        }
    }
    else
    {
        InitializeComponent();
    }
}

4、VisualStateManager

<VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="VisualStateGroup">
                <VisualState x:Name="Narrow">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="0" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="tabLayout.(Grid.Column)" Value="1" />
                        <Setter Target="tabLayout.(Grid.Row)" Value="1" />
                        <Setter Target="pivot.(Grid.Column)" Value="1" />
                        <Setter Target="pivot.(Grid.Row)" Value="0" />
                        <Setter Target="tabLayout.Orientation" Value="Horizontal" />
                        <Setter Target="tabLayout.Width" Value="Auto" />
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="Wide">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="501" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="tabLayout.(Grid.Column)" Value="0" />
                        <Setter Target="tabLayout.(Grid.Row)" Value="0" />
                        <Setter Target="pivot.(Grid.Column)" Value="1" />
                        <Setter Target="pivot.(Grid.Row)" Value="0" />
                        <Setter Target="tabLayout.Orientation" Value="Vertical" />
                        <Setter Target="tabLayout.Width" Value="60" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

原文出处

http://www.cnblogs.com/kiminozo/p/4738355.html

http://www.cnblogs.com/mushroom/p/5080032.html

相关推荐