egret精确获取屏幕分辨率的方法

目前egret默认的屏幕适配策略是，分辨率定为480x800，然后根据实际屏幕的大小进行拉伸。这个方法比较简单粗暴。而我们如果想做一个比较专业一点的游戏，最好还是根据屏幕的实际分辨率在游戏中定位每个元素的坐标。这样能根据不同的屏幕做到精确适配。友情提示：个人做的小游戏不要使用这个方法。这个是专业团队使用的，一般美术会出3-4套素材共不同的分辨率来适配使用。个人这么做成本就太高了。

那么怎么做呢。egret本身是不能够获得屏幕的相关信息的，需要我们在初始的js文件里修改。
打开launcher/egret_loader.js
只要把480和800修改成屏幕的分辨率就可以了

1. egret.StageDelegate.getInstance().setDesignSize(480, 800);

复制代码

获得屏幕分辨率的方法有很多种，我实际测试，发现下面这种方法是最有效的。这个拿到的高度是除去浏览器上下方地址栏的实际有效高度。

1. var wid = document.documentElement.clientWidth;
   
2. var hei = document.documentElement.clientHeight;

复制代码

直接把480和800替换成wid和hei就可以了。
安卓手机这样是没问题的，但在iphone上会有问题。比如iphone4\5\5c\5s的宽度都是640，但我们拿到的wid是320。具体的原因就不详说了，可以自己百度。下面写一下解决方法。

1. var bet=1;//iphone系列比较特殊，尺寸需要翻倍
   
2. switch(wid){
   
3.     case 320://iphone4\5
   
4.         bet = 2;
   
5.         break;
   
6.     case 375://iphone 6
   
7.         bet = 2;
   
8.         break;
   
9.     case 414://iphone 6+
   
10.         bet = 3;
    
11.         break;
    
12.     default :
    
13.         bet =1;
    
14.         break;
    
15. }
    
16. wid *= bet; hei*= bet;

复制代码

这段代码就是把得到的宽高乘上相应的倍数，就是手机中实际的分辨率。
iphone6和6+没真机测试过，理论上是可以的。

1. egret.StageDelegate.getInstance().setDesignSize(wid, hei);

复制代码

ok，搞定。


效果演示地址
附件是源代码

感谢大神指导～

非常实用  谢谢

前来顶帖，但是有个疑问，这样做后，不同手机不同分辨率，那ui图也需要几套额

xsstomy 发表于 2014-10-7 22:29
前来顶帖，但是有个疑问，这样做后，不同手机不同分辨率，那ui图也需要几套额 ...

你做手机原生的app，也是要做几套ui来适配的

我按你的代码取到值都在1000以上  游戏画面会大大超过窗口大小 果然还是选择拉伸去吧

slert 发表于 2014-10-8 15:38
我按你的代码取到值都在1000以上  游戏画面会大大超过窗口大小 果然还是选择拉伸去吧 ...

你是什么手机？我测试iphone和note2是正常的

张宇 发表于 2014-10-8 16:09
你是什么手机？我测试iphone和note2是正常的

锤子手机

slert 发表于 2014-10-8 16:35
锤子手机

锤子的分辨率不是1920x1080么，取到的值就应该都超过1000啊

张宇 发表于 2014-10-8 17:16
锤子的分辨率不是1920x1080么，取到的值就应该都超过1000啊

是啊 但是显示出来就是游戏界面巨大。。超出窗口很多，原因不明