如何通过不同的屏幕尺寸保持与XML drawable的一致性？

Question

我正在尝试为计算器应用程序创建自己的按钮。

我的麻烦在于，我发现很难支持所有不同的屏幕尺寸。

基本上我有很多按钮，就像这样创建

<Button android:text="Button" android:id="@+id/button1"
    android:background="@drawable/test"
    android:layout_height="60dip" android:layout_width="60dip" android:layout_margin="5dip"></Button>

我的背景是XML drawable

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Bottom 2dp Shadow -->
<item>
    <shape android:shape="rectangle">
        <gradient android:startColor="#E0E0E0" 
        android:endColor="#373737"
            android:angle="315" />
        <corners android:radius="20dip" />
    </shape>
</item>
<!-- White Top color -->
<item android:top="5dip" android:left="5dip" android:right="5dip"
    android:bottom="5dip">
    <shape android:shape="rectangle">
        <gradient android:startColor="#9E9E9E" android:endColor="#C5C5C5"
            android:angle="270" />
        <corners android:radius="20dip" />
    </shape>
</item>

基本上是圆角的背景，看起来像斜面，还有一些渐变，让它看起来很漂亮！

<3> 3.2 HVGA上的按钮尺寸正确

但是当我查看3.7 FWVGA中的按钮时，宽高比会丢失，并且尺寸与3.2相同，但由于在此屏幕上有更多像素可供使用，因此图像尺寸不正确。

无论如何要保持这种情况下的一致性???

Answer 1

问题

正如您已经提到的，问题是有更多可用的屏幕空间。这意味着您必须根据填充可用空间来调整按钮的大小，例如用4个按钮填充显示器的可用宽度，并缩放它们的高度，使图形的纵横比保持不变。

您在这里使用的是dp单位，这在定义布局时绝对可以。但在这种情况下，它告诉布局“这个东西有一个固定大小的XX dp”（你可以把dp看作一个固定单位，固定数量只是由显示布局的设备决定）。你不想要一个固定的大小。您希望按钮以动态方式拉伸。

解决方案

为上述布局提供解决方案：您可以使用LinearLayout及其layout_weight属性。这里有一些简短（不完整）的示例代码来说明原理：

<LinearLayout android:orientation="horizontal"
              android:layout_width="fill_parent"
              android:layout_height="wrap_content">

    <Button android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            />
    <Button android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            />
    <Button android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            />
    <Button android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            />

</LinearLayout>

这里会发生什么？

首先，我们创建一个外部LinearLayout，它填充整个父宽度（=整个屏幕宽度），并根据内容调整它的高度。标准的东西。

然后我们添加4个按钮。这里的相关部分是layout_weight。这告诉每个按钮“尽可能地填充可用空间”。由于现在每个人都试图伸展，我们必须定义每个按钮获得多少空间。这是给layout_weight的数字。在这里，每个按钮的数字相同。这意味着每个按钮的尺寸与其他任何尺寸相同。那么布局如何确定多少空间呢？它计算它的子项的总重量，这里是4，并根据child_weight / total_weight的比率给每个子项空间。所以每个按钮占宽度的1/4。 （你也可以分配任何其他数字，如果你给每个按钮增加重量3，每个按钮将获得宽度的3/12，根据数学仍然是1/4 :)）

还有一个问题：为什么layout_width="0dp"？据我所知，这只是阻止了一些不必要的内部计算。您需要知道的是，在使用layout_weight属性时，使用0dp作为缩放维度。如果你想了解更多，你可以研究一下。

<强>样品

以下是实践中的两个截图：

2.7“QVGA

3.7“FWVGA

Answer 2

您可以使用“配置限定符”并根据分辨率声明不同的布局，只需创建如下子文件夹：

drawable-mdpi
drawable-hdpi

因此，您可以根据密度更好地对齐。

另一种解决方案是扩展“Button”类并创建一个自定义小部件，通过调用getWindowManager（）。getDefaultDisplay（）并在“onCreate（）”方法中更改其大小，根据屏幕大小进行对齐。