2010-10-30 27 views
33

Actualmente estoy dibujando un número de círculos en un lienzo en una vista personalizada en el código. los círculos son estáticos y no cambian. Me gustaría dibujarlos usando ShapeDrawable en xml para ayudar a limpiar mi código. Dispondré de una serie de tipos diferentes que el usuario puede seleccionar y, por lo tanto, no quiero hacer esto en el código. tener 3 o 4 xml dibujables parece mucho más ordenado para mí.Dibujar formas múltiples con ShapeDrawable en xml con Android

He creado un círculo en xml usando ShapeDrawable pero no puedo agregar más de una forma al xml.

Cómo agrego varias formas a un documento xml usando ShapeDrawable.

Respuesta

33

Creo que he encontrado una solución para agregar varias formas a mi archivo xml utilizando Layer-list. No he intentado esto todavía pero esto parece ser exactamente lo que quiero ya que las formas se dibujarán en el orden de su índice de matriz.

<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item> 
     <shape> 
     <solid android:color="#FFF8F8F8" /> 
     </shape> 
    </item> 
    <item android:top="23px"> 
     <shape> 
     <solid android:color="#FFE7E7E8" /> 
     </shape> 
    </item> 
</layer-list> 

Blog post

Android docs

63

Así es como lo hice un círculo relleno de color rojo con un borde negro de un píxel, con un número blanco 72 en el medio:

Crear un archivo XML en res \ drawable y asígnele un nombre apropiado, por ejemplo red_circle_black_border.xml

<?xml version="1.0" encoding="UTF-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item> 
     <shape android:shape="oval"> 
      <solid android:color="@android:color/black" /> 
     </shape> 
    </item> 
    <item android:top="1dp" android:left="1dp" android:right="1dp" android:bottom="1dp"> 
     <shape android:shape="oval"> 
      <solid android:color="@android:color/red" /> 
     </shape> 
    </item> 
</layer-list> 

Luego, para utilizarlo en su diseño, la declararemos como sigue:

<TextView 
    android:text="72" 
    android:textSize="14dp" 
    android:textStyle="bold" 
    android:background="@drawable/red_circle_black_border" 
    android:layout_width="22dp" 
    android:layout_height="22dp" 
    android:gravity="center_vertical|center_horizontal" 
    android:textColor="@android:color/white" /> 

Obviamente, cambie la TEXTSIZE y layout_width/altura que requiere :-)

+0

Asumo puede utilizar un imageview si tiene no hay texto para mostrar? – skyfoot

+2

Claro. De hecho, es solo dibujable ahora, así que úsalo como una imagen. –

Cuestiones relacionadas