在xml drawable中绘制多个矩形

Question

我试图弄清楚如何在android xml drawable中创建一个3x3行的小矩形.
这不是真正让我接近(2个小的,但它们重叠):

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:left="20dp" android:top="20dp" android:right="25dp" android:bottom="25dp" >
        <shape android:shape="rectangle">
            <stroke android:width="1px" android:color="#fff" />
            <solid android:color="#00FF0000" />
            <corners android:radius="3dp" />
        </shape>
    </item>


    <item android:left="30dp" android:top="30dp" android:right="35dp" android:bottom="25dp" >
    <shape android:shape="rectangle">
            <stroke android:width="1px" android:color="#fff" />
            <solid android:color="#00FF0000" />
            <corners android:radius="3dp" />
            <size android:width="10dp"
                  android:height="10dp"/>
        </shape>
    </item>


</layer-list>

Answer 1

部分问题是图层列表中的各个项目会缩放到可绘制的整体大小.如文档中所述,您可以通过将小方块包装在bitmapdrawable中来解决这个问题.这样的事可能有用.首先,将基本形状定义为单独的drawable:

绘制/ square.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke android:width="1px" android:color="#fff" />
    <solid android:color="#00FF0000" />
    <corners android:radius="3dp" />
    <size android:width="10dp" android:height="10dp"/>
</shape>

(编辑:如果你能做到这一点会很好,但不幸的是,正如@Someone Somewhere在评论中指出的那样,你不能在<bitmap>标签中引用形状可绘制的东西.你必须创建正方形作为其余部分的实际位图图形.)

然后,您可以定义不会缩放单个方块的图层列表:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- first row -->
    <item android:left="20dp" android:top="20dp">
        <bitmap android:src="@drawable/square" android:gravity="top|left" />
    </item>
    <item android:left="35dp" android:top="20dp">
        <bitmap android:src="@drawable/square" android:gravity="top|left" />
    </item>
    <item android:left="50dp" android:top="20dp">
        <bitmap android:src="@drawable/square" android:gravity="top|left" />
    </item>

    <!-- second row -->
    <item android:left="20dp" android:top="35dp">
        <bitmap android:src="@drawable/square" android:gravity="top|left" />
    </item>
    <item android:left="35dp" android:top="35dp">
        <bitmap android:src="@drawable/square" android:gravity="top|left" />
    </item>
    <item android:left="50dp" android:top="35dp">
        <bitmap android:src="@drawable/square" android:gravity="top|left" />
    </item>

    <!-- third row -->
    <item android:left="20dp" android:top="50dp">
        <bitmap android:src="@drawable/square" android:gravity="top|left" />
    </item>
    <item android:left="35dp" android:top="50dp">
        <bitmap android:src="@drawable/square" android:gravity="top|left" />
    </item>
    <item android:left="50dp" android:top="50dp">
        <bitmap android:src="@drawable/square" android:gravity="top|left" />
    </item>
</layer-list>

我没有测试过这个,所以它可能有点偏,但你应该能够调整它以获得你想要的东西.重要的是摆脱缩放.

Answer 2

请参阅图层列表的文档。

可以清楚地看出，top、left、bottom和right是项目偏移量的维度属性：项目本身应该距离其父项（图层列表）的边框有多远。

如果你知道你的图层列表是 130 dp 宽和 130 dp 高，并且你想要 3x3 矩形，那么第一个的偏移量应该是

top: 10
left: 10
bottom: 90
right: 90

和下一个（第一行，第二列）：

top: 10
left: 50
bottom: 90
right: 50