zoukankan      html  css  js  c++  java
  • WP8开发中多分辨率支持详解

    支持的分辨率
    Windows Phone 8中支持三种分辨率,下表中描述相应分辨率以及与OS 7.1分辨率的缩放关系

    Resolution 分辨率 横纵比例 OS7.1缩放关系 按比例缩放后分辨率
    WVGA 480 × 800 15:9 未缩放 480 × 800
    WXGA 768 × 1280 15:9 为7.1系统的1.6倍 480 × 800
    720p 720 × 1280 16:9 为7.1系统的1.5倍,
    高度另增加80,
    缩放前增加53
    480 × 853

    为不同分辨率设备准备不同的背景和asset
    利用binding函数,运行时根据屏幕分辨率动态加载背景图片。
    步骤如下:
    1. 创建一个c# application工程--MyMultiBg
    2. 准备三张图片,分别为MyImage.screen-wvga.jpg, MyImage.screen-wxga.jpg, and MyImage.screen-720p.jpg,放到Assets目录下,设置Copy to Output Directory 属性为copy always.

    3. 工程添加ResolutionHelper.cs,代码如下: 

     public enum Resolutions { WVGA, WXGA, HD720p };

    public static class ResolutionHelper
    {
       private static bool IsWvga
       {
          get
          {
             return Application.Current.Host.Content.ActualHeight == 800
             && Application.Current.Host.Content.ScaleFactor == 100;
          }
       }

       private static bool IsWxga
       {
          get 
          { 
             return Application.Current.Host.Content.ScaleFactor == 160
          }
       }
         
       private static bool Is720p
       {
          get 
          { 
             return Application.Current.Host.Content.ScaleFactor == 150
          }
       }

       public static Resolutions CurrentResolution
       {
          get
          {
             if (IsWvga) return Resolutions.WVGA;
             else if (IsWxga) return Resolutions.WXGA;
             else if (Is720p) return Resolutions.HD720p;
             else throw new InvalidOperationException("Unknown resolution");
          }
       }
    }

    4. 工程添加MultiResImageChooser.cs,代码如下: 

     public class MultiResImageChooser

    {
       public Uri BestResolutionImage
       {
          get
          {
             switch (ResolutionHelper.CurrentResolution)
             {
                case Resolutions.HD720p:
                   return new Uri("Assets/MyImage.screen-720p.jpg",             UriKind.Relative);
                case Resolutions.WXGA:
                   return new Uri("Assets/MyImage.screen-wxga.jpg", UriKind.Relative);
                case Resolutions.WVGA:
                    return new Uri("Assets/MyImage.screen-wvga.jpg", UriKind.Relative);
                default:
                   throw new InvalidOperationException("Unknown resolution type");
               }
            }
         }
    }

     5. 打开mainpage.xaml,修改为如下内容:

    <phone:PhoneApplicationPage
        x:Class="MyMultiBg.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
        xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d"
        FontFamily="{StaticResource PhoneFontFamilyNormal}"
        FontSize="{StaticResource PhoneFontSizeNormal}"
        Foreground="{StaticResource PhoneForegroundBrush}"
        SupportedOrientations="Portrait" Orientation="Portrait"
        shell:SystemTray.IsVisible="True">

        <!--LayoutRoot is the root grid where all page content is placed-->
        <Grid x:Name="LayoutRoot">
            <Grid.Background>
                <ImageBrush ImageSource="{Binding BestResolutionImage, Source={StaticResource MultiResImageChooser}}"/>
            </Grid.Background>
        </Grid>

    </phone:PhoneApplicationPage> 

     6. 运行效果如图,分别对应为WVGA/WXGA/720p设备截图,从图中我们可以看出,在不同分辨率的设备中背景图片是不同的。

     Splash screens,即应用程序启动过程中显示图片

    Windows Phone 8中已经将默认的480*800的SplashScreenImage.jpg替换为768*1280。如果不提供其他尺寸的图片,程序启动时候会根据手机分辨率对SplashScreenImage.jpg缩放。
    另外,我们也可以为每种分辨率提供一个splash screen图片,
    为每种分辨率提供不同的splash screen不像设置背景和asset那么复杂,把以下文件添加工程中就可以:
    SplashScreenImage.Screen-WVGA.jpg
    SplashScreenImage.Screen-WXGA.jpg
    SplashScreenImage.Screen-720p.jpg
    除了这些文件以外,工程中必须要包含SplashScreenImage.jpg文件。

    Tile和应用程序图标 
    Tile和应用程序图标只需要提供WXGA分辨率的,框架将自动为WVGA/720p缩放。
    下表为WXGA中Tile的尺寸
    Tile sizeWXGA
    App list(图标)100 × 100
    Small159 × 159
    Medium336 × 336
    Large691 × 336

  • 相关阅读:
    预习笔记 多态 --S2 4.3
    织梦CMS标签生成器
    socketCluster 使用
    JS工具库之Lodash
    socketcluster 客户端请求
    AngularJS自定义指令directive:scope属性 (转载)
    angularjs报错问题记录
    Angularjs中的事件广播 —全面解析$broadcast,$emit,$on
    angularJS中directive与controller之间的通信
    AngularJs Type error : Cannot read property 'childNodes' of undefined
  • 原文地址:https://www.cnblogs.com/mondol/p/2882763.html
Copyright © 2011-2022 走看看