WP8多分辨率解决方案

// 潜水多年来第一次写这么多字^_^

看见你出剪刀我再出石头

由于之前Windows Phone OS 7.1只有一个分辨率,所以我们无须担心我们的应用在这台手机运行ok在其他机型上会出问题.

我常听到同事抱怨,人类已经无法阻止android的分辨率了.苹果的开发者是幸福的^_^.

单一的分辨率,也意味着单一的机型.

不能给用户提供多样化的体验,也不是一件好事.作为后来者,微软在这两者间做出了权衡.要多分辨率.但不要泛滥!

WP8支持的分辨率

下面是WP8 开发者预览版所支持的分辨率,及比例

分辨率

分辨率

长宽比

Delta from Windows Phone OS 7.1

缩放结果

WVGA

480 × 800

15:9

None

480 × 800

WXGA

768 × 1280

15:9

1.6x scale

480 × 800

720p

720 × 1280

16:9

1.5x scale, 80 pixels taller (53 pixels, before scaling)

480 × 853

 

如何以最小的成本,适应这三款分辨率.是我们接下来要思考的话题.

在布局上最好是使用Grid

使用Grid,我们可以使用*和auto.来自适应分辨率.

比如:

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="14,0,10,0">
 
        <ScrollViewer HorizontalAlignment="Left" Height="540" VerticalAlignment="Top" Width="456">
 
             <Grid HorizontalAlignment="Center" Height="618" VerticalAlignment="Top" Width="456">
 
                 <Grid.RowDefinitions>
 
                     <RowDefinition Height="98*"/>
 
                     <RowDefinition Height="13*"/>
 
                 </Grid.RowDefinitions>
 
                 <TextBlock TextWrapping="Wrap" Margin="22,20,10,0" Text="fasdfasdfasd"/>
 
             </Grid>
 
        </ScrollViewer>
 
 </Grid>

 

这里

<RowDefinition Height="98*"/>

<RowDefinition Height="13*"/>

不要写死数值硬编码. 要使用*或auto.

像canvas那种绝对定位,布局的控件尽量少的使用.

 

根据不同的分辨率加载图像

 

[注意]这里的图像不是我们想像的所有图片.只是像背景图像,应用初始化图.

由于分辨率的比例不同.我们需要做一些适配的工作.至于其他的如瓦片,应用图标.我们只需要按着WXGA的分辨率做一套就可以了.

系统会自动缩放合适的大小.

下面是如何动态加载[应用初始化图]

  1. 把图像的Copy to Output Directory属性值设成copy always.

2.

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");
 
      }
 
   }
 
}

 

3.

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");
 
           }
 
        }
 
     }
 
}

 

4.xaml中

<!--ContentPanel - place additional content here-->

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

   <Image Source="{Binding BestResolutionImage, Source={StaticResource    MultiResImageChooser}}"/>

</Grid>

5.在app.xaml

xmlns:h="clr-namespace:MultiResSnippet"

6.

App.xaml

<!--Application Resources-->

<Application.Resources>

   <h:MultiResImageChooser x:Key="MultiResImageChooser"/>

</Application.Resources>

瓦片和图标

前面说过,对于瓦片和图标我们只需要制作一套WXGA的资源.

不过官方的说法很奇怪.用了[必须只有一套]…

下面是瓦片的尺寸

Tile size

WXGA

App list

100 × 100

Small

159 × 159

Medium

336 × 336

Large

691 × 336

关于从7.1升级到8.0

基于7.1的应用,基本上是不需要任何改动,就能运行于wp8.0的.

至于分辨率.如果是7.1的应用运行于8.0的WXGA的话.应用会像是一张480*800的图片放大成768*1280的样子.

在模拟器中100%显示的时候会有写模糊.

如果可以的话,推荐首先把7.1的应用打开转换成8.0

这样就可以使用8.0的新api了.

对于不同分辨率的逻辑上的处理.

我们可以使用条件编译来解决.

  #if WP8

  #end if

  这里只是举例,条件编译用法请查一下相关资料 .

另外.如果不能使一个项目实现就实现多辨率.可以再建一个项目.

不过维护起来要麻烦不少了.

觉得对您有用,请点支持谢谢!

转载请注明出处.

作者:蝗虫的大腿

http://www.cnblogs.com/beyoung/archive/2012/08/07/2627448.html

 

 

 

posted @   蝗虫的大腿  阅读(4455)  评论(8编辑  收藏  举报
编辑推荐:
· 没有源码,如何修改代码逻辑?
· 一个奇形怪状的面试题:Bean中的CHM要不要加volatile?
· [.NET]调用本地 Deepseek 模型
· 一个费力不讨好的项目,让我损失了近一半的绩效!
· .NET Core 托管堆内存泄露/CPU异常的常见思路
阅读排行:
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 没有源码,如何修改代码逻辑?
· DeepSeek R1 简明指南:架构、训练、本地部署及硬件要求
· NetPad:一个.NET开源、跨平台的C#编辑器
· PowerShell开发游戏 · 打蜜蜂
点击右上角即可分享
微信分享提示