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的分辨率做一套就可以了.
系统会自动缩放合适的大小.
下面是如何动态加载[应用初始化图]
- 把图像的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
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 没有源码,如何修改代码逻辑?
· 一个奇形怪状的面试题:Bean中的CHM要不要加volatile?
· [.NET]调用本地 Deepseek 模型
· 一个费力不讨好的项目,让我损失了近一半的绩效!
· .NET Core 托管堆内存泄露/CPU异常的常见思路
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 没有源码,如何修改代码逻辑?
· DeepSeek R1 简明指南:架构、训练、本地部署及硬件要求
· NetPad:一个.NET开源、跨平台的C#编辑器
· PowerShell开发游戏 · 打蜜蜂