Рисование нескольких прямоугольников в xml drawable

Question

Я пытаюсь понять, как создать 3x3 ряд маленьких прямоугольников в iroid-образе.
Это на самом деле не получает мне близко (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

Пожалуйста, смотрите documentation of Layer Lists.

Это прояснится, что top, left, bottom и right атрибуты в измерения для смещений элемента: насколько сам элемент должен быть помещен от границы из его родителей (слой-лист) ,

Если вы знаете, что ваш слой-список сказать 130 дп в ширину и 130 дп высокой, и вы хотите 3x3 прямоугольники там, смещает первые должны быть

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

и следующий (в первой строке, второй столбец):

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

Answer 2

Часть проблемы заключается в том, что отдельные элементы в списке слоев масштабируются до общего размера извлекаемого. Как описано в the docs, вы можете обойти это, обернув небольшие квадраты в bitmap. Что-то вроде этого может сработать. Во-первых, определить основную форму в виде отдельного вытяжке:

вытяжке/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> 

(EDIT: Было бы хорошо, если бы вы могли бы сделать выше, но , к сожалению, как отмечалось в комментарии @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 3

Как уже говорилось, использование растрового изображения ограничено действительными растровыми изображениями; другие (XML) чертежи нельзя использовать здесь.

ScaleDrawables должно быть подходящим решением для вас. Они должны предлагать атрибуты, необходимые для настройки их положения в результирующей ограничивающей рамке.

Однако ScaleDrawables страдает от того, что они предназначены для анимации. Кажется, они начинаются с уровня 0, что делает их невидимо маленькими. Кроме того, не представляется возможным установить уровень в XML.

Если вы можете жить с настройкой уровня вашего ScaleDrawables в своем коде, попробуйте его.

Также см. this question.