2013-07-13 9 views
8

Ich mag würde eine rechteckige Form mit zwei Unifarben (horizontal) zu schaffen, um so etwas zu erreichen:Vierecksform mit zwei Unifarben

enter image description here

Ich hörte von layer-list, ich allerdings konnte ich benutze Es enthält zwei Rechteck mit einer anderen Farbe, aber es scheint, dass es nur vertikal Formen legt.

Gibt es eine Möglichkeit dies mit lalyer-list zu erreichen oder sollte ich etwas völlig anderes verwenden? Ich möchte es einfach halten mit der Fähigkeit, die Form Farben zur Laufzeit zu ändern.

Danke.

+0

siehe neun patch zeichner – pskink

+0

@nathan meine antwort sehen! –

Antwort

6

Sie können hierfür benutzerdefinierte Zeichen erstellen. Erweitern Sie einfach Zeichenklasse.

Hier ist ein Beispiel-Code, der ein Rechteck zeichnet, wie Sie wollten, können Sie eine beliebige Anzahl von Farben zur Verfügung stellen.

public class ColorBarDrawable extends Drawable { 

    private int[] themeColors; 

    public ColorBarDrawable(int[] themeColors) { 
     this.themeColors = themeColors; 
    } 

    @Override 
    public void draw(Canvas canvas) { 

     // get drawable dimensions 
     Rect bounds = getBounds(); 

     int width = bounds.right - bounds.left; 
     int height = bounds.bottom - bounds.top; 

     // draw background gradient 
     Paint backgroundPaint = new Paint(); 
     int barWidth = width/themeColors.length; 
     int barWidthRemainder = width % themeColors.length; 
     for (int i = 0; i < themeColors.length; i++) { 
      backgroundPaint.setColor(themeColors[i]); 
      canvas.drawRect(i * barWidth, 0, (i + 1) * barWidth, height, backgroundPaint); 
     } 

     // draw remainder, if exists 
     if (barWidthRemainder > 0) { 
      canvas.drawRect(themeColors.length * barWidth, 0, themeColors.length * barWidth + barWidthRemainder, height, backgroundPaint); 
     } 

    } 

    @Override 
    public void setAlpha(int alpha) { 
    } 

    @Override 
    public void setColorFilter(ColorFilter cf) { 

    } 

    @Override 
    public int getOpacity() { 
     return PixelFormat.OPAQUE; 
    } 

} 
+0

Danke. Es hat funktioniert :) – nathan

+0

Wie können wir Ecken mit dieser Lösung gerundet ??? –

16

dies wird sicherlich ziehen die Form wie pro Ihre Anforderung:

anpassen Größe <item>, wie Sie benötigen!

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

    <item 
     android:left="50dip"> 
     <shape 
      xmlns:android="http://schemas.android.com/apk/res/android" 
      android:shape="rectangle" > 
      <solid android:color="#0000FF" /> 
     </shape> 
    </item> 
    <item android:right="50dip"> 
     <shape 
      xmlns:android="http://schemas.android.com/apk/res/android" 
      android:shape="rectangle" > 
      <solid android:color="#ff0000" /> 
     </shape> 
    </item> 

</layer-list> 
+2

Nice One .. Ist es möglich, nur bestimmten Seiten abgerundete Ränder hinzuzufügen? – Bora

+2

können wir die linke seite match_parent machen? – bharv14

+1

Tolle Lösung, danke! –

0

Dies gibt Ihnen zwei Farben halb und halb vertikal. Setzen Sie diesen Code in eine Ressource drawable.

<item 
    android:top="320dip"> 
    <shape 
     xmlns:android="http://schemas.android.com/apk/res/android" 
     android:shape="rectangle" > 
     <solid android:color="@color/red" /> 
    </shape> 
</item> 
<item android:bottom="320dip"> 
    <shape 
     xmlns:android="http://schemas.android.com/apk/res/android" 
     android:shape="rectangle" > 
     <solid android:color="@color/yellow" /> 
    </shape> 
</item>