Android Warum wird meine Layer-Liste nicht skalierbar skalierbar für meine Schaltfläche?

Question

Ich versuche, einen phantasievollen Gradientenrahmen für meine Android-Schaltfläche zu erstellen. Ich habe ein Zeichen mit einer Ebenenliste und einigen Farbverläufen erstellt, und die Vorschau sieht gut aus. Aber wenn ich versuche, das Zeichen auf meine Schaltfläche anzuwenden, sieht es nicht einmal so aus, wie es in der Vorschau aussieht. Ich hatte gehofft, dass sich das Zeichenmuster strecken und skalieren würde, um zu meinem Knopf zu passen, aber das scheint es nicht zu tun.

Kann mir jemand sagen, was ich falsch mache?

Hier ist meine ziehbar:

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item> 
     <shape android:shape="rectangle"> 
      <corners android:radius="1dp"/> 
      <solid android:color="@color/colorLightGray"/> 
      <size android:width="40dp" android:height="10dp"/> 
     </shape> 
    </item> 
    <item android:left="38dp"> 
     <shape android:shape="rectangle"> 
      <corners 
        android:topRightRadius="1dp" 
        android:bottomRightRadius="1dp"/> 
      <gradient 
       android:endColor="@color/colorDarkGreen" 
       android:startColor="@color/colorLightGray" 
       android:type="linear"/> 
     </shape> 
    </item> 
    <item android:right="38dp"> 
     <shape android:shape="rectangle"> 
      <corners 
        android:topLeftRadius="1dp" 
        android:bottomLeftRadius="1dp"/> 
      <gradient 
        android:endColor="@color/colorLightGray" 
        android:startColor="@color/colorDarkGreen" 
        android:type="linear"/> 
     </shape> 
    </item> 
    <item android:bottom="8dp"> 
     <shape android:shape="rectangle"> 
      <corners 
        android:topLeftRadius="1dp" 
        android:topRightRadius="1dp"/> 
      <gradient 
        android:endColor="@color/colorLightGray" 
        android:startColor="@color/colorDarkGreen" 
        android:angle="270" 
        android:type="linear"/> 
     </shape> 
    </item> 
    <item android:top="8dp"> 
     <shape android:shape="rectangle"> 
      <corners 
        android:bottomLeftRadius="1dp" 
        android:bottomRightRadius="1dp"/> 
      <gradient 
        android:endColor="@color/colorLightGray" 
        android:startColor="@color/colorDarkGreen" 
        android:angle="90" 
        android:type="linear"/> 
     </shape> 
    </item> 
    <item 
      android:bottom="8dp" 
      android:right="38dp"> 
     <shape android:shape="rectangle"> 
      <corners android:topLeftRadius="1dp"/> 
      <gradient 
        android:endColor="@color/colorDarkGreen" 
        android:centerColor="@color/colorDarkGreen" 
        android:startColor="@color/colorLightGray" 
        android:centerX="100%" 
        android:centerY="100%" 
        android:gradientRadius="200%" 
        android:type="radial"/> 
     </shape> 
    </item> 
    <item 
      android:bottom="8dp" 
      android:left="38dp"> 
     <shape android:shape="rectangle"> 
      <corners android:topRightRadius="1dp"/> 
      <gradient 
        android:endColor="@color/colorDarkGreen" 
        android:centerColor="@color/colorDarkGreen" 
        android:startColor="@color/colorLightGray" 
        android:centerX="0%" 
        android:centerY="100%" 
        android:gradientRadius="200%" 
        android:type="radial"/> 
     </shape> 
    </item> 
    <item 
      android:top="8dp" 
      android:left="38dp"> 
     <shape android:shape="rectangle"> 
      <corners android:bottomRightRadius="1dp"/> 
      <gradient 
        android:endColor="@color/colorDarkGreen" 
        android:centerColor="@color/colorDarkGreen" 
        android:startColor="@color/colorLightGray" 
        android:centerX="0%" 
        android:centerY="0%" 
        android:gradientRadius="200%" 
        android:type="radial"/> 
     </shape> 
    </item> 
    <item 
      android:top="8dp" 
      android:right="38dp"> 
     <shape android:shape="rectangle"> 
      <corners android:bottomLeftRadius="1dp"/> 
      <gradient 
        android:endColor="@color/colorDarkGreen" 
        android:centerColor="@color/colorDarkGreen" 
        android:startColor="@color/colorLightGray" 
        android:centerX="100%" 
        android:centerY="0%" 
        android:gradientRadius="200%" 
        android:type="radial"/> 
     </shape> 
    </item> 
</layer-list> 

hier xml meine Schaltfläche:

<Button 
      android:id="@+id/add_some_stuff" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:background="@drawable/gradient_border" 
      android:textAllCaps="false" 
      android:textStyle="normal" 
      android:textSize="@dimen/settings_text_size" 
      android:textColor="@color/colorSettingsText" 
      android:text="@string/add_some_stuff"/> 

Hier ist, was die Vorschau zeigt:

Hier ist, was ich sehe eigentlich:

Answer 1

Ihre Zeichengröße ist statisch definiert und passt sich nicht an, wenn Sie den Hintergrund einer Ansicht anpassen möchten. Die Layer-Listen-Eigenschaften android:width, android:height, android:left usw. müssen alle mit einer bestimmten Dichtepixelgröße definiert werden. Sobald Ihre Ansicht dieser Größe nicht mehr entspricht, passt sie nicht mehr ordnungsgemäß zum Zeichenbereich (dies passiert, wenn Sie oder wrap_content verwenden). Wenn Sie dynamisches Sizing verwenden müssen (was ich vorschlage), würde ich ein Vektorbild anstelle eines layer-list verwenden.