Как изменить дизайн фона плеера и цвет для андроида?

Я разрабатываю приложение, в котором мне нужно изменить макет фонара счетчика, чтобы он соответствовал цвету фона. Я исследовал и обнаружил, что мне нужно создать 9 патч-изображений. Я сделал создание 9 патч-изображения и использовал его в приложении, но он выглядит больше, чем обычный счетчик, а также я не мог видеть кнопку выпадающего списка в spinner.

Я так счастлив, если вы, ребята, предоставили мне ясный учебник, чтобы начать создавать 9 патч-изображений для Spinner и использовать его в приложении.

The spinner looks like

Код для 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" />

Ответ 1

Вы можете установить цвет фона прядильщиков в xml следующим образом:

android:background="YOUR_HEX_COLOR_CODE"

и если вы используете раскрывающееся меню с вашим счетчиком, вы можете установить его цвет фона следующим образом:

android:popupBackground="YOUR_HEX_COLOR_CODE"

Ответ 2

Вы можете изменить цвет фона и выпадающий значок, как это делается

Шаг1: В папке с возможностью рисования сделайте background.xml для рамки счетчика.

<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

Шаг 2: для дизайна макета счетчика используйте этот значок выпадающего списка или любое изображение 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>

Наконец, выглядит как изображение ниже, и каждый из них можно щелкнуть в круглой области и не нужно писать Lister для ImageView.

Для получения дополнительной информации вы можете увидеть здесь

введите описание изображения здесь

Ответ 3

Несмотря на то, что это более старая запись, но когда я сталкивался с ней, ища ту же проблему, я подумал, что добавлю свои два цента. Вот моя версия фона Spinner с стрелкой DropDown. Просто полный фон, а не только стрелка.

Вот как это выглядит. Снимок экрана Spinner using spinner_bg.xml

Нанесите на spinner, как...

<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 следует заменить цветом, который вы хотите в качестве фона.

Сначала он заполняет фон желаемым цветом. Затем дочерний слой-лист создает квадрат и поворачивает его на 45 градусов, а затем второй прямоугольник с фоновым цветом покрывает верхнюю часть повернутого квадрата, делая его похожим на стрелку вниз. (Есть дополнительный ход в повернутом прямоугольнике, который не требуется)

Ответ 4

Вам нужно создать новый персонализированный макет для ваших элементов-счетчиков, например, я назову его:

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

Затем в объявлении spinner вам нужно сделать свой счетчик, используя новый макет в адаптере:

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

Чтобы персонализировать элементы из раскрывающегося списка, вам нужно создать другой макет, я назову его 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"/>

а затем на адаптере:

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

Ответ 5

Как Якоб указал, android:popupBackground является ключевым атрибутом раскрывающегося списка (открытое состояние Spinner), но вместо того, чтобы использовать только цвет, я получил лучшие результаты с 9-патчем можно сделать так:

enter image description here
menu_dropdown_panel.9.png

Обратите внимание, что очень легко создать это 9-патч-изображение для цвета фона по вашему выбору, например, используя этот онлайн-инструмент как я объясняется в этом ответе!

Итак, мое определение XML Spinner выглядит так:

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

И результат:

JvxN7.png

(Для пользовательских шрифтов, как на скриншоте выше, требуется собственный SpinnerAdapter.)

Работает как минимум на Android 4.0+ (уровень API 14 +).

Ответ 6

код 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>

он отлично работает без фотографий с девятью патчами. api 21+ введите описание изображения здесь

Ответ 7

введите описание изображения здесь

Код Spinner

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

Ответ 8

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>

он отлично работает без фотографий с девятью патчами. api 10+ введите описание изображения здесь

Ответ 9

Он должен работать с прозрачным фоном в счетчике.

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>

Ответ 10

Я пробовал образцы, но не работал у меня. Самое простое решение для меня работает потрясающе:

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