android - 为具有不同 ppi 像素的多个设备设置图像

Question

我正在根据官方谷歌文档为不同的设备设置图像。根据谷歌文档，我们应该始终使用 dp（密度独立像素），因为不同设备的像素可能会有所不同。所以我按照 dp（密度独立像素）管理图像。我已将图像放入可绘制的 xhdpi、hdpi、mdpi 和 ldpi 中。它适用于大多数设备，但对于不同的设备，ppi 像素可能因设备而异，因此 dp（密度独立像素）不是固定的，因此我根据 dp（密度独立像素）进行的所有计算都会出错并且无法正确设置。

让我用例子来解释一下。这是我正在设置的 xml：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ll_footer"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="#FF0000"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/ft_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ico_test" />

    <ImageView
        android:id="@+id/ft_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ico_test" />

    <ImageView
        android:id="@+id/ft_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ico_test" />

    <ImageView
        android:id="@+id/ft_4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ico_test" />

    <ImageView
        android:id="@+id/ft_5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ico_test" />

    <ImageView
        android:id="@+id/ft_6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:src="@drawable/ico_test" />

</LinearLayout>

当我在 Micromax 画布 4（294 ppi 像素）中看到这种布局时，它看起来很完美。但在 Google Nexus 4（318 ppi 像素）中，它会从右侧留下更多空间（您可以在我附加的图像中看到它。）。

我试图获取以下详细信息

density :
dpHeight :
dpWidth :

使用下面的java代码：

Display display = getWindowManager().getDefaultDisplay();
DisplayMetrics outMetrics = new DisplayMetrics ();
display.getMetrics(outMetrics);

float density  = getResources().getDisplayMetrics().density;
float dpHeight = outMetrics.heightPixels / density;
float dpWidth  = outMetrics.widthPixels / density;

我得到 nexus 4 和 canvas 4 的以下结果：

(canvas 4)
density : 2.0
dpHeight : 640
dpWidth : 360

(nexus 4)
density : 2.0
dpHeight : 592
dpWidth : 384

正如您在这里看到的，dp（密度独立像素）因这些设备而异，我认为这是因为 ppi 像素不同，所以我根据 dp（密度独立像素）进行的所有计算都出错了。那么如果 dp 不固定，我该如何管理图像。？？

我还附上了图像在画布 4 和 nexus 4 中的布局外观的屏幕截图。

我还提到了这个问题How do I convert ppi into dpi for Android images？

我知道我可以使用布局权重调整布局，但我认为必须有另一种解决方案来解决这个问题。

请查看并帮助我解决问题。

Answer 1

您只是无法支持所有设备，您可以创建不同的布局或不同的可绘制对象以针对每个设备。

您可以做的最好的事情是制作一个灵活的 UI，按比例划分视图，并为此WEIGHT生成。只需使用权重将 UI 分成这样的比例

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ll_footer"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="#FF0000"
    android:orientation="horizontal" 
    android:weightSum="6">

    <ImageView
        android:layout_weight="1"
        android:id="@+id/ft_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ic_launcher" />

    <ImageView
        android:layout_weight="1"
        android:id="@+id/ft_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ic_launcher" />

    <ImageView
        android:layout_weight="1"
        android:id="@+id/ft_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ic_launcher" />

    <ImageView
        android:layout_weight="1"
        android:id="@+id/ft_4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ic_launcher" />

    <ImageView
        android:layout_weight="1"
        android:id="@+id/ft_5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ic_launcher" />

    <ImageView
        android:layout_weight="1"
        android:id="@+id/ft_6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:src="@drawable/ic_launcher" />

</LinearLayout>

Answer 2

尝试这个

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ll_footer"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="#FF0000"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/ft_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="3dp"
        android:layout_weight="1"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_launcher" />

    <ImageView
        android:id="@+id/ft_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="3dp"
        android:layout_weight="1"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_launcher" />

    <ImageView
        android:id="@+id/ft_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="3dp"
        android:layout_weight="1"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_launcher" />

    <ImageView
        android:id="@+id/ft_4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="3dp"
        android:layout_weight="1"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_launcher" />

    <ImageView
        android:id="@+id/ft_5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="3dp"
        android:layout_weight="1"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_launcher" />

    <ImageView
        android:id="@+id/ft_6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="3dp"
        android:layout_weight="1"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_launcher" />

</LinearLayout>

Answer 3

我这样做

Display display = getWindowManager().getDefaultDisplay();
int screenWidth = display.getWidth()/6; //number of buttons
button.setLayoutParams(new LinearLayout.LayoutParams(screenWidth, android.view.ViewGroup.LayoutParams.WRAP_CONTENT));
button2.setLayoutParams(new LinearLayout.LayoutParams(screenWidth, android.view.ViewGroup.LayoutParams.WRAP_CONTENT));
....

以相同的方式制作每个按钮..

或者

Tabbar 概念以另一种方式工作。

Answer 4

对于您在屏幕截图中看到的问题，您的背景具有可重复的纹理。裁剪图像以获得纹理并使用可重复的背景代替单个图像。您可以将以下 XML 用于可重复背景 bg_repeat.xml

 <?xml version="1.0" encoding="utf-8"?>
 <bitmap xmlns:android="http://schemas.android.com/apk/res/android"
 android:src="@drawable/background" 
 android:tileMode="repeat" /> 

背景.png

在此处将您裁剪的图像作为 src 并将此 XML 文件放入您的可绘制对象中。现在，在您的布局中执行此操作 -

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        tools:context=".MainActivity" >

        <ImageView 
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/bg_repeat"/>

    </LinearLayout>

IMO 这将满足您的目的，它还将为您节省一些食物。

Answer 5

dp 像素与密度无关，与比例无关。两个设备之间的高度与宽度的比例差异是您遇到的问题，而不是非标准 dp 的出现。唯一合适的解决方案是根据比例差异调整权重。

如果与密度无关的像素依赖于每英寸的像素，一个依赖于密度的单位，那么它们也将依赖于密度。

Answer 6

我认为您需要在这里使用权重。只需将相同的代码放入您的 XML 中，看看有什么不同：

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1" 
    android:gravity="center">

    <ImageView
        android:id="@+id/ft_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ico_test" />
</LinearLayout>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1" 
    android:gravity="center">

    <ImageView
        android:id="@+id/ft_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ico_test" />
</LinearLayout>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:gravity="center" >

    <ImageView
        android:id="@+id/ft_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ico_test" />
</LinearLayout>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:gravity="center" >

    <ImageView
        android:id="@+id/ft_4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ico_test" />
</LinearLayout>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1" 
    android:gravity="center">

    <ImageView
        android:id="@+id/ft_5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/ico_test" />
</LinearLayout>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1" 
    android:gravity="center">

    <ImageView
        android:id="@+id/ft_6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:src="@drawable/ico_test" />
</LinearLayout>

Answer 7

您只是无法支持所有设备，您可以创建不同的布局或不同的可绘制对象以针对每个设备。

而不是线性布局，而是使用对所有设备都更好的相对布局。