Ich entwickle eine App, in der ich das Layout des Spinner-Hintergrunds an die Hintergrundfarbe anpassen muss. Ich recherchierte und fand heraus, dass ich ein 9-Patch-Bild erstellen muss. Ich habe das 9-Patch-Image erstellt und in der App verwendet, aber es sieht größer aus als der normale Spinner. Außerdem konnte ich den Dropdown-Button im Spinner nicht sehen.
Ich bin so glücklich, wenn ihr mir ein klares Tutorial von der Erstellung des 9-Patch-Images für Spinner und dessen Verwendung in der App bereitstellt.
Code für den Spinner
<Spinner
Android:id="@+id/spnIncredientone"
Android:layout_width="fill_parent"
Android:layout_height="wrap_content"
Android:layout_below="@+id/txtMixtureTitle"
Android:layout_marginLeft="5dip"
Android:layout_marginRight="5dip"
Android:background="@drawable/spinner_background"
Android:Prompt="@string/selectmixture" />
Sie können die Hintergrundfarbe des Spinners in xml folgendermaßen einstellen:
Android:background="YOUR_HEX_COLOR_CODE"
und wenn Sie das Dropdown-Menü mit Ihrem Spinner verwenden, können Sie die Hintergrundfarbe folgendermaßen einstellen:
Android:popupBackground="YOUR_HEX_COLOR_CODE"
Sie können die Hintergrundfarbe und das Dropdown-Symbol auf diese Weise ändern
Schritt1: Erstellen Sie im Zeichnungsordner background.xml als Rand des Spinners.
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android">
<solid Android:color="@Android:color/transparent" />
<corners Android:radius="5dp" />
<stroke
Android:width="1dp"
Android:color="@color/darkGray" />
</shape> //edited
Schritt 2: Für das Layout-Design des Spinners verwenden Sie dieses Dropdown-Symbol oder ein beliebiges Bild drop.pnj .
<RelativeLayout
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:layout_marginRight="3dp"
Android:layout_weight=".28"
Android:background="@drawable/spinner_border"
Android:orientation="horizontal">
<Spinner
Android:id="@+id/spinner2"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:layout_centerVertical="true"
Android:layout_gravity="center"
Android:background="@Android:color/transparent"
Android:gravity="center"
Android:layout_marginLeft="5dp"
Android:spinnerMode="dropdown" />
<ImageView
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:layout_alignParentRight="true"
Android:layout_centerVertical="true"
Android:layout_gravity="center"
Android:src="@mipmap/drop" />
</RelativeLayout>
Schließlich sieht es aus wie unter dem Bild und es ist überall in einem runden Bereich anklickbar, und Sie müssen nicht auf Lister für imageView klicken.
Für weitere Details sehen Sie Hier
Obwohl es ein älterer Beitrag ist, aber als ich darauf stieß, während ich nach demselben Problem suchte, dachte ich, ich würde auch meine zwei Cents hinzufügen. Hier ist meine Version von Spinners Hintergrund mit DropDown-Pfeil. Nur der komplette Hintergrund, nicht nur der Pfeil.
Anwenden auf Spinner wie ...
<Spinner
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:background="@drawable/spinner_bg" />
spinner_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item>
<color Android:color="@color/InputBg" />
</item>
<item Android:gravity="center_vertical|right" Android:right="8dp">
<layer-list>
<item Android:width="12dp" Android:height="12dp" Android:gravity="center" Android:bottom="10dp">
<rotate
Android:fromDegrees="45"
Android:toDegrees="45">
<shape Android:shape="rectangle">
<solid Android:color="#666666" />
<stroke Android:color="#aaaaaa" Android:width="1dp"/>
</shape>
</rotate>
</item>
<item Android:width="30dp" Android:height="10dp" Android:bottom="21dp" Android:gravity="center">
<shape Android:shape="rectangle">
<solid Android:color="@color/InputBg"/>
</shape>
</item>
</layer-list>
</item>
</layer-list>
@color/InputBg
sollte durch die Farbe ersetzt werden, die Sie als Hintergrund verwenden möchten.
Zuerst füllt es den Hintergrund mit der gewünschten Farbe. Dann erstellt eine untergeordnete Ebenenliste ein Quadrat und dreht es um 45 Grad, und dann deckt ein zweites Rechteck mit Hintergrundfarbe den oberen Teil des gedrehten Quadrats ab, sodass es wie ein Abwärtspfeil aussieht. (Es gibt einen zusätzlichen Strich im gedrehten Rechteck, der nicht wirklich erforderlich ist.)
Sie müssen ein neues personalisiertes Layout für Ihre Spinner-Artikel erstellen. Ich nenne es:
spinner_item.xml:
<TextView xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:id="@Android:id/text1"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:textSize="20sp"
Android:textColor="#ff0000" />
Dann müssen Sie bei Ihrer Spinner-Deklaration das neue Layout im Adapter verwenden:
ArrayAdapter adapter = ArrayAdapter.createFromResource(this,
R.layout.spinner_item, YOUR_SPINNER_CONTENT);
spinner.setAdapter(adapter);
Um Elemente aus der Dropdown-Liste zu personalisieren, müssen Sie ein anderes Layout erstellen. Ich nenne es spinner_dropdown_item.xml:
<CheckedTextView xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:id="@Android:id/text1"
style="?android:attr/spinnerDropDownItemStyle"
Android:singleLine="true"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:ellipsize="Marquee"
Android:textColor="#aa66cc"/>
und dann auf dem Adapter:
ArrayAdapter adapter = ArrayAdapter.createFromResource(this,
R.layout.spinner_item, YOUR_SPINNER_CONTENT);
adapter.setDropDownViewResource(R.layout.spinner_dropdown_item);
spinner.setAdapter(adapter);
Wie Jakob darauf hinwies , ist Android:popupBackground
das Schlüsselattribut für das Dropdown-Menü (geöffneter Status des Spinners), aber anstatt nur eine Farbe zu verwenden, erhielt ich mit einem 9-Patch-Draw das beste Ergebnis:
menu_dropdown_panel.9.png
Beachten Sie, dass es sehr einfach ist, dieses 9-Patch-Bild für die Hintergrundfarbe Ihrer Wahl zu generieren, z. B. mit diesem Online-Tool wie ich in dieser Antwort erläutert !
Meine XML-Definition für Spinner sieht also so aus:
<Spinner
Android:id="@+id/spinner"
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:background="@color/navigationBlue"
Android:spinnerMode="dropdown"
Android:popupBackground="@drawable/menu_dropdown_panel"
/>
Und das Ergebnis:
(Für benutzerdefinierte Schriftarten ist, wie in der Abbildung oben, ein benutzerdefinierter SpinnerAdapter ebenfalls erforderlich.)
Funktioniert mindestens auf Android 4.0+ (API Level 14+).
Spinnercode
<Spinner
Android:id="@+id/spinner"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:textColor="@color/text.white"
Android:paddingBottom="13dp"
Android:background="@drawable/bg_spinner"/>
bg_spinner.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item>
<shape Android:shape="rectangle">
<solid Android:color="@color/colorPrimaryDark"/>
<corners Android:radius="10dp" />
</shape>
</item>
<item Android:gravity="center_vertical|right" Android:right="8dp">
<layer-list>
<item Android:width="12dp" Android:height="12dp" Android:gravity="center" Android:bottom="10dp">
<rotate
Android:fromDegrees="45"
Android:toDegrees="45">
<shape Android:shape="rectangle">
<solid Android:color="#ffffff" />
<stroke Android:color="#ffffff" Android:width="1dp"/>
</shape>
</rotate>
</item>
<item Android:width="20dp" Android:height="10dp" Android:bottom="21dp" Android:gravity="center">
<shape Android:shape="rectangle">
<solid Android:color="@color/colorPrimaryDark"/>
</shape>
</item>
</layer-list>
</item>
</layer-list>
spinnercode:
<TextView
Android:id="@+id/spinner"
Android:gravity="bottom"
Android:layout_marginTop="16dp"
Android:background="@drawable/spinner_selector"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:clickable="true"
Android:paddingLeft="16dp"
Android:textSize="16sp"
Android:text="TextView" />
spinner_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item Android:drawable="@drawable/spinner_enable" Android:state_enabled="true" Android:state_pressed="false" /> <!-- enable -->
<item Android:drawable="@drawable/spinner_clicked" Android:state_pressed="true" Android:state_enabled="true" />
<item Android:drawable="@drawable/spinner_disable" Android:state_enabled="false" /> <!-- disable -->
</selector>
spinner_disable.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android" >
<item>
<shape Android:shape="rectangle" >
<solid Android:color="#ddf" />
<padding Android:bottom="1dp" />
</shape>
</item>
<item Android:bottom="1dp">
<shape Android:shape="rectangle" >
<solid Android:color="#fff" />
<padding
Android:left="0dp"
Android:right="0dp" />
</shape>
</item>
<item>
<shape Android:shape="rectangle" >
<solid Android:color="#fff" />
</shape>
</item>
<item
Android:gravity="center_vertical|right"
Android:right="8dp">
<layer-list>
<item
Android:width="12dp"
Android:height="12dp"
Android:bottom="10dp"
Android:gravity="center">
<rotate
Android:fromDegrees="45"
Android:toDegrees="45">
<shape Android:shape="rectangle">
<solid Android:color="#ddf" />
<stroke
Android:width="1dp"
Android:color="#aaaaaa" />
</shape>
</rotate>
</item>
<item
Android:width="30dp"
Android:height="10dp"
Android:bottom="21dp"
Android:gravity="center">
<shape Android:shape="rectangle">
<solid Android:color="@Android:color/white" />
</shape>
</item>
</layer-list>
</item>
</layer-list>
spinner_clicked.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android" >
<item>
<shape Android:shape="rectangle" >
<solid Android:color="#00f" />
<padding Android:bottom="1dp" />
</shape>
</item>
<item Android:bottom="1dp">
<shape Android:shape="rectangle" >
<solid Android:color="#fff" />
<padding
Android:left="0dp"
Android:right="0dp" />
</shape>
</item>
<item>
<shape Android:shape="rectangle" >
<solid Android:color="#fff" />
</shape>
</item>
<item
Android:gravity="center_vertical|right"
Android:right="8dp">
<layer-list>
<item
Android:width="12dp"
Android:height="12dp"
Android:bottom="10dp"
Android:gravity="center">
<rotate
Android:fromDegrees="45"
Android:toDegrees="45">
<shape Android:shape="rectangle">
<solid Android:color="#00f" />
<stroke
Android:width="1dp"
Android:color="#aaaaaa" />
</shape>
</rotate>
</item>
<item
Android:width="30dp"
Android:height="10dp"
Android:bottom="21dp"
Android:gravity="center">
<shape Android:shape="rectangle">
<solid Android:color="@Android:color/white" />
</shape>
</item>
</layer-list>
</item>
</layer-list>
spinner_enable.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android" >
<item>
<shape Android:shape="rectangle" >
<solid Android:color="#00f" />
<padding Android:bottom="1dp" />
</shape>
</item>
<item Android:bottom="1dp">
<shape Android:shape="rectangle" >
<solid Android:color="#BBDEFB" />
<padding
Android:left="0dp"
Android:right="0dp" />
</shape>
</item>
<item>
<shape Android:shape="rectangle" >
<solid Android:color="#BBDEFB" />
</shape>
</item>
<item
Android:gravity="center_vertical|right"
Android:right="8dp">
<layer-list>
<item
Android:width="12dp"
Android:height="12dp"
Android:bottom="10dp"
Android:gravity="center">
<rotate
Android:fromDegrees="45"
Android:toDegrees="45">
<shape Android:shape="rectangle">
<solid Android:color="#00f" />
<stroke
Android:width="1dp"
Android:color="#aaaaaa" />
</shape>
</rotate>
</item>
<item
Android:width="30dp"
Android:height="10dp"
Android:bottom="21dp"
Android:gravity="center">
<shape Android:shape="rectangle">
<solid Android:color="#BBDEFB" />
</shape>
</item>
</layer-list>
</item>
</layer-list>
spinner_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item Android:drawable="@drawable/spinner_enabled" Android:state_enabled="true" Android:state_pressed="false" /> <!-- enable -->
<item Android:drawable="@drawable/spinner_clicked" Android:state_enabled="true" Android:state_pressed="true" />
<item Android:drawable="@drawable/spinner_disabled" Android:state_enabled="false" /> <!-- disable -->
</selector>
spinner_enabled.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item>
<shape Android:shape="rectangle" >
<solid Android:color="#00f" />
<padding Android:bottom="2dp" />
</shape>
</item>
<item>
<shape Android:shape="rectangle" >
<solid Android:color="#fff" />
</shape>
</item>
<item>
<rotate
Android:fromDegrees="90"
Android:pivotX="100%"
Android:pivotY="60%"
Android:toDegrees="135">
<rotate
Android:fromDegrees="135"
Android:pivotX="100%"
Android:pivotY="60%"
Android:toDegrees="45">
<shape Android:shape="rectangle">
<stroke
Android:width="10dp"
Android:color="#00f" />
<solid Android:color="#00f" />
</shape>
</rotate>
</rotate>
</item>
</layer-list>
spinner_disabled.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item>
<shape Android:shape="rectangle" >
<solid Android:color="#ddf" />
<padding Android:bottom="2dp" />
</shape>
</item>
<item>
<shape Android:shape="rectangle" >
<solid Android:color="#fff" />
</shape>
</item>
<item>
<rotate
Android:fromDegrees="90"
Android:pivotX="100%"
Android:pivotY="60%"
Android:toDegrees="135">
<rotate
Android:fromDegrees="135"
Android:pivotX="100%"
Android:pivotY="60%"
Android:toDegrees="45">
<shape Android:shape="rectangle">
<stroke
Android:width="10dp"
Android:color="#ddf" />
<solid Android:color="#ddf" />
</shape>
</rotate>
</rotate>
</item>
</layer-list>
spinner_focused.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item>
<shape Android:shape="rectangle" >
<solid Android:color="#00f" />
<padding Android:bottom="2dp" />
</shape>
</item>
<item>
<shape Android:shape="rectangle" >
<solid Android:color="#BBDEFB" />
</shape>
</item>
<item>
<rotate
Android:fromDegrees="90"
Android:pivotX="100%"
Android:pivotY="60%"
Android:toDegrees="135">
<rotate
Android:fromDegrees="135"
Android:pivotX="100%"
Android:pivotY="60%"
Android:toDegrees="45">
<shape Android:shape="rectangle">
<stroke
Android:width="10dp"
Android:color="#00f" />
<solid Android:color="#00f" />
</shape>
</rotate>
</rotate>
</item>
</layer-list>
Wenn Sie die Spinner-Hintergrundfarbe mit
Android:background="@color/your_color"
Ihrem Spinner einstellen Standardpfeil wird ausgeblendet
Außerdem müssen Sie dem Spinner eine feste Breite und Höhe hinzufügen, damit Sie den gesamten Inhalt des Spinners anzeigen können.
also habe ich einen weg gefunden, genau wie das obige bild.
Schreiben Sie Ihren Spinner-Code in ein Frame-Layout. Hier brauchen Sie keine separate Bildansicht, um das Dropdown-Symbol anzuzeigen.
<TextView
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:text="Floor"
Android:textColor="@color/white"/>
<FrameLayout
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:layout_marginLeft="@dimen/margin_short"
Android:background="@drawable/custom_spn_background">
<Spinner
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:dropDownSelector="@color/colorAccent"
Android:dropDownWidth="@dimen/dp_70"
Android:spinnerMode="dropdown"
Android:tooltipText="Select floor" />
</FrameLayout>
Erstellen Sie eine neue XML-Datei für den Hintergrund des Frame-Layouts oder legen Sie .__ fest.
Android:background="@color/your_color"
custom_spn_background.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:shape="rectangle">
<corners Android:radius="@dimen/dp_5" />
<solid Android:color="@color/white" />
Ich habe die obigen Proben ausprobiert, aber für mich nicht funktioniert. Die einfachste Lösung arbeitet für mich fantastisch:
<RelativeLayout
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:background="#fff" >
<Spinner
Android:id="@+id/spinner1"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:entries="@array/Area"/>
</RelativeLayout>
<FrameLayout
Android:layout_width="match_parent"
Android:layout_height="wrap_content">
<Spinner
Android:layout_marginTop="8dp"
Android:background="@drawable/edit_border"
Android:visibility="visible"
Android:id="@+id/teach_repeat"
Android:entries="@array/on_off"
Android:textSize="12sp"
Android:textColor="#ffffff"
Android:layout_width="match_parent"
Android:layout_height="40dp" />
<ImageView
Android:layout_marginTop="8dp"
Android:layout_gravity="end"
Android:src="@drawable/ic_arrow_drop_down_white_18dp"
Android:layout_width="wrap_content"
Android:layout_height="wrap_content" />
</FrameLayout>
Verwenden Sie einfach diesen Code
<LinearLayout
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:orientation="horizontal"
Android:baselineAligned="false">
<LinearLayout
Android:layout_width="0dp"
Android:layout_height="match_parent"
Android:layout_weight="0.80">
<FrameLayout
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:layout_gravity="center_vertical|start"
Android:paddingBottom="5dp"
Android:paddingTop="5dp">
<Spinner
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:background="@drawable/spiner_back"
Android:visibility="visible" />
<ImageView
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:layout_gravity="center_vertical|end"
Android:src="@drawable/ic_arrow_drop_down_black_24dp" />
</FrameLayout>
</LinearLayout>
<LinearLayout
Android:layout_width="0dp"
Android:layout_height="match_parent"
Android:layout_weight="0.20">
<Button
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:background="@color/colorred"
Android:fontFamily="@font/raleway_extrabold"
Android:text="GO"
Android:textColor="@color/colorwhite" />
</LinearLayout>
</LinearLayout>
Und das ist Hintergrund, den ich benutzt habe ...
<?xml version="1.0" encoding="utf-8"?><shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:shape="rectangle">
<corners Android:radius="5dp" />
<solid Android:color="@color/colorwhite" />
und hier gehen wir auf diese Ansicht, die ich archiviere ...
Es muss mit dem transparenten Hintergrund in einem Spinner gearbeitet werden.
spinner_enable.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item>
<shape Android:shape="rectangle">
<solid Android:color="#00000000" />
<padding Android:bottom="2dp" />
</shape>
</item>
<item>
<shape Android:shape="rectangle">
<solid Android:color="#00000000" />
</shape>
</item>
<item
Android:bottom="-2dp"
Android:left="-3dp"
Android:right="-3dp"
Android:top="-3dp">
<shape>
<solid Android:color="#00000000" />
<stroke
Android:width="2dp"
Android:color="#00aedb" />
</shape>
</item>
<item>
<rotate
Android:fromDegrees="90"
Android:pivotX="100%"
Android:pivotY="60%"
Android:toDegrees="135">
<rotate
Android:fromDegrees="135"
Android:pivotX="100%"
Android:pivotY="60%"
Android:toDegrees="45">
<shape Android:shape="rectangle">
<stroke
Android:width="10dp"
Android:color="#00aedb" />
<solid Android:color="#00aedb" />
</shape>
</rotate>
</rotate>
</item>
</layer-list>
spinner_disable.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item>
<shape Android:shape="rectangle">
<solid Android:color="#00000000" />
<padding Android:bottom="2dp" />
</shape>
</item>
<item>
<shape Android:shape="rectangle">
<solid Android:color="#00000000" />
</shape>
</item>
<item
Android:bottom="-2dp"
Android:left="-3dp"
Android:right="-3dp"
Android:top="-3dp">
<shape>
<solid Android:color="#00000000" />
<stroke
Android:width="2dp"
Android:color="#d9dadc" />
</shape>
</item>
<item>
<rotate
Android:fromDegrees="90"
Android:pivotX="100%"
Android:pivotY="60%"
Android:toDegrees="135">
<rotate
Android:fromDegrees="135"
Android:pivotX="100%"
Android:pivotY="60%"
Android:toDegrees="45">
<shape Android:shape="rectangle">
<stroke
Android:width="10dp"
Android:color="#d9dadc" />
<solid Android:color="#d9dadc" />
</shape>
</rotate>
</rotate>
</item>
</layer-list>
spinner_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item Android:drawable="@drawable/spinner_enable" Android:state_enabled="true" Android:state_pressed="false" /> <!-- enable -->
<item Android:drawable="@drawable/spinner_disable" Android:state_enabled="false" /> <!-- disable -->
</selector>
Android Studio hat einen vordefinierten Code, den Sie direkt verwenden können. Android: popupBackground = "HEX FARBCODE"