我应该为华为Y300和Y530使用哪种仿真器？

Question

我想模仿华为Y530.根据该网站,它具有以下规格:

屏幕:480 x 854像素,4.5英寸(~218 ppi像素密度)

这是我的WEB APP在实际设备上的样子:

这就是它在仿真器上的样子,具有以下规范:

目标:Android 4.3 - API级别18
设备:4"WVGA(Nexus S)(480x800 hdpi)

我知道两个设备的高度存在差异,但我仍然认为仿真器应该显示类似于实际设备显示的内容.

我试图找到innerWidth并innerHeight用下面的代码真正的设备:

var viewportwidth;
var viewportheight;

 // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight

 if (typeof window.innerWidth != 'undefined')
 {
      viewportwidth = window.innerWidth,
      viewportheight = window.innerHeight
 }
alert (viewportwidth);
alert(viewportheight);

结果是宽度:320px和高度:544px

在innerWidth对emualtor是:480像素和innerHeight:756px

由于真实设备的宽度为320px,我尝试使用具有以下规格的仿真器:

屏幕:3.2"QVGA(ADP2)(320 x 480 mdpi)

结果如下:

Answer 1

在不太了解您如何完成应用程序的情况下，您似乎正在使用固定单位（如像素）来指定大小。由于这个项目是一个网络应用程序，也许你应该考虑使用所谓的方法Responsive Design。这样您的内容就可以调整以适应屏幕的任何尺寸。

我将为您提供几篇有用的文章来了解更多相关信息：

• 维基百科中的响应式网页设计
• 响应式设计演示
• 响应式设计示例