Android中的双色水平线

Question

我目前正在构建的Android应用程序的图形设计师提出了一种两色线作为布局框中项目之间的分隔符:

两色分隔线 http://img7.imageshack.us/img7/3351/twocolorline.png

如果你仔细观察这张图片，你会看到一个深灰色的线，紧接着下面是一个非常浅的灰色（几乎白色）线。这些线条应该根据容器的宽度进行调整大小。

在UI中实现这个功能的最佳方法是什么？

- Pieter Kuijpers

Answer 1

最佳做法是将您展示的图像转换为 9-patch，将其作为资源添加到 res/drawable 文件夹中，并通过一个 ImageView 在布局中显示它，设置 android:width="fill_parent"。

9-patch 图像允许您指定在调整图像大小时要拉伸的区域（在本例中是整个图像，但您可能希望考虑“淡出”其边缘处的线以符合一些本机 Android 样式）。

在布局文件中， ImageView 的定义应该类似于以下内容：

<ImageView
  android:src="@drawable/my_separater_nine_patch"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:scaleType="fitXY"
/>

- Reto Meier

Answer 2

如果您不想使用9-patch，可以尝试使用LayerList。

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape >
            <solid android:color="#ffffff" />
        </shape>
    </item>
    <item android:bottom="1px">
        <shape >
            <solid android:color="#252525" />
        </shape>
    </item>

</layer-list>

- Mo Kargas

Answer 3

<ImageView android:layout_width="match_parent" android:id="@+id/line1"
            android:layout_height="1dp" android:background="#FFFFFF"
            android:layout_weight="1" android:layout_marginTop="5dp"
            android:layout_marginBottom="5dp" android:layout_marginLeft="5dp"
        android:layout_marginRight="5dp"/>

将内容插入到LinearLayout视图中

- EliSherer

Answer 4

你可以创建两个视图，每个视图对应一行。将这些视图的背景颜色设置为所需的颜色，然后将高度设置为1像素，宽度设置为“fill_parent”。与9 patch方法相比，这种方法的优点是不需要加载资源，并且可以动态更改颜色以适应用户需求。缺点是会创建更多的布局对象。

- hacken