javascript - 调整多个 Android 平板电脑屏幕的大小不起作用

Question

我已经阅读了 Android 上的屏幕支持部分，并查看了 stackoverflow 上的其他帖子，但似乎没有一个解决方案对我有用......

我正在使用 Cordova 2.9.0、JavaScript、HTML 和 CSS 来创建这个应用程序。

我尝试通过添加代码来更改 AndroidManifest.XML：

    <supports-screens android:smallScreens="false"
              android:normalScreens="true"
              android:largeScreens="true"
              android:xlargeScreens="true"
              android:anyDensity="true"
              android:requiresSmallestWidthDp="600"
              android:largestWidthLimitDp="720"/>

我也尝试过更改 res -> layout 下的 main.xml 代码：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    >
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello World, ShowMeWhere"
    />
</LinearLayout>

这是页面在 Android 模拟器中的样子：

这也是我想要的样子（显示完整图像）：

谢谢参观！

Answer 1

我找到了一个临时解决方案，但由于图像像素化，它看起来不太好。

我通过将所有图像引用放入<div>'s 然后使用 CSS 设置max-height和max-width设置每个<div>'s 来做到这一点。

HTML 代码：

CSS 代码：

.leftImage{
    margin-left:5%;
    max-width:45%;
    max-height:65%;
}

.leftImage img{
    max-width:100%;
    max-height:100%;
}