Jak zmienić projekt i kolor tła pokrętła dla Androida?

Question

Pracuję nad aplikacją, w której muszę zmienić układ tła pokrętła, aby dopasować kolor tła. Zbadałem i odkryłem, że potrzebuję stworzyć obraz 9 łatek. Utworzyłem obrazek z 9 łatami i użyłem go w aplikacji, ale wygląda na większy niż zwykły spinner, a także nie mogłem zobaczyć przycisku rozwijania w spinneru.

Jestem bardzo szczęśliwy, jeśli zapewniliście mi czytelny samouczek od rozpoczęcia tworzenia obrazu dziewięciu łatek dla Spinnera i używania go w aplikacji.

Kod dla 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" /> 

Answer 1

Można ustawić kolor błystki tła w XML tak:

android:background="YOUR_HEX_COLOR_CODE" 

a jeśli używasz menu rozwijanego z możesz ustawić kolor tła w ten sposób:

android:popupBackground="YOUR_HEX_COLOR_CODE" 

Answer 2

Trzeba utworzyć nowy spersonalizowany układ dla przedmiotów spinner, tak, będę nazwać go:

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" /> 

Następnie na swojej deklaracji wirowania, trzeba dokonać spinner korzystać z nowego układu w adapterze:

ArrayAdapter adapter = ArrayAdapter.createFromResource(this, 
R.layout.spinner_item, YOUR_SPINNER_CONTENT); 
spinner.setAdapter(adapter); 

personalizować elementy z listy rozwijanej, trzeba utworzyć inny układ, będę go wymienić spi nner_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"/> 

a następnie na adapterze:

ArrayAdapter adapter = ArrayAdapter.createFromResource(this, 
R.layout.spinner_item, YOUR_SPINNER_CONTENT); 
adapter.setDropDownViewResource(R.layout.spinner_dropdown_item); 
spinner.setAdapter(adapter); 

Answer 3

Jak Jakob pointed out, android:popupBackground jest kluczowym atrybutem rozwijanym (otwarty stan turbinki), ale zamiast używać tylko kolor , mam najlepsze wyniki z rozciągliwej 9-łaty tak:

menu_dropdown_panel.9.png

Zauważ, że bardzo łatwo jest wygenerować ten 9-plasterkowy obraz dla wybranego koloru tła, na przykład używając this online tool jako I explained in this answer!

Więc moje Spinner definicja XML wygląda następująco:

<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" 
    /> 

a wynik:

(. Dla czcionek niestandardowych, jak na zrzucie ekranu powyżej, custom SpinnerAdapter is needed zbyt)

Działa co najmniej na Androida 4.0+ (poziom API 14+).

Answer 4

Można zmienić kolor tła i rozwijanej ikony jak robi ten sposób

Krok 1: W rozciągliwej folderze zrobić background.xml na granicy turbinki.

<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 

Krok 2: do projektowania układu użytkowania spinner to rozwijanej ikony lub dowolny obraz 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> 

końcu wygląda jak poniżej obrazu i jest wszędzie klikać w okrągłej powierzchni i bez konieczności do pisania kliknij Lister dla imageView.

Więcej szczegółów można zobaczyć Here

Answer 5

mimo że jest starszy post ale jak natknąłem nim, patrząc na ten sam problem więc pomyślałem dodam moje dwa centy, a także . Oto moja wersja tła Spinner ze strzałką DropDown. Tylko całe tło, nie tylko strzałka.

Jak to wygląda ..

Nałożyć na obrotówki jak ...

<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 powinien zostać zastąpiony przez kolor, który chcesz jako twoje tło.

Najpierw wypełnia tło żądanym kolorem. Następnie lista warstw potomnych tworzy kwadrat i obraca go o 45 stopni, a następnie drugi prostokąt z kolorem tła pokrywa górną część obróconego kwadratu, dzięki czemu wygląda jak strzałka w dół. (Jest to dodatkowy skok w obróconym prostokąta z naprawdę nie jest wymagane)

Answer 6

kod

spinner:

<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_pressed" 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_default" 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_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="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> 

działa dobrze bez obrazów dziewięć-Patch. api 21+

Answer 7

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> 

działa dobrze bez obrazów dziewięć-Patch. API 10+

Answer 8

kod pokrętła

<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> 

Answer 9

Musi pracować z przezroczystym tłem w pokrętle.

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> 

Answer 10

Próbowałem powyżej próbek, ale nie działa dla mnie. Najprostszym rozwiązaniem jest praca dla mnie niesamowite:

<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> 

Answer 11

<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>