不做浮躁的人
正在行走的人...
posts - 171,  comments - 51,  trackbacks - 0
源于移动设备的dpi不同,可能导致一个设备上运行展现正常的界面,到另外一个设备上惨不忍睹。

flex sdk4.5及以上在Application及其子类上提供了ApplicationDpi,并支持3种类型的dpi:160,240,320,基本上可以涵盖目前已有的设备的dpi。

如果设定Application的applicationDpi,flex runtime会针对矢量图以及文本自动做dpi自适应,由于矢量图绘制会产生痕迹,所以最好在设计时按照低dpi(比如160,Adobe官方建议)来设计,在dpi=240的设备上,runtime会自动将矢量图放到为1.5倍。

对于位图来说,放大会导致痕迹,因此flex sdk提供了MultiDPIBitmapSource类,允许用户针对160,240,320分别提供位图。mobile app的splash不能采用MultiDPIBitmapSource,最好使用大位图,让runtime自动缩小它。

在skin中,判断applicationDpi:
switch (applicationDPI) {
case DPIClassification.DPI_320: {
upBorderSkin = skins.assets320.TransparentRoundedButton_up;
downBorderSkin = skins.assets320.TransparentRoundedButton_down;
break;
}


在css中,采用@media:
@media (application-dpi: 160) {
 Button { fontSize: 20; }
}

要提供良好体验的splash,需要扩展SplashScreen类,重写getImageClass方法,比如:
override mx_internal function getImageClass(dpi:Number, aspectRatio:String):Class {
if (dpi == DPIClassification.DPI_160)
return SplashImage160;
else if (dpi == DPIClassification.DPI_240)
return SplashImage240;
else if (dpi == DPIClassification.DPI_320)
return SplashImage320; return null;
}
}

posted on 2014-02-06 19:26 不做浮躁的人 阅读(381) 评论(0)  编辑  收藏

只有注册用户登录后才能发表评论。


网站导航:
 

<2014年2月>
2627282930311
2345678
9101112131415
16171819202122
2324252627281
2345678

常用链接

留言簿(9)

随笔分类(31)

随笔档案(75)

文章分类(1)

文章档案(3)

搜索

  •  

最新评论

阅读排行榜

评论排行榜