Android-селектор с фоновым изображением и градиентом

Я знаю, что есть аналогичные сообщения, но я не мог найти свой ответ ни в одном из них. Итак, у меня есть этот гибкий XML:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="true">
    <bitmap
        android:src="@drawable/bm_btn_background"
        android:tileMode="repeat"
        android:gravity="center" />
</item>
<item android:state_enabled="true">
    <shape android:shape="rectangle">
        <gradient
            android:startColor="#a0e0b071"
            android:endColor="#a0a67637"
            android:angle="270" />
        <stroke
            android:width="1dp"
            android:color="#5c3708" />
        <corners
            android:radius="5dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </shape>
</item>
<item android:state_pressed="true" >
    <shape>
        <gradient
            android:startColor="#a0a67637"
            android:endColor="#a0e0b071"
            android:angle="270" />
        <stroke
            android:width="1dp"
            android:color="#5c3708" />
        <corners
            android:radius="5dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </shape>
</item>

Я пытаюсь создать кнопку с повторным изображением в качестве фона и применить к нему градиент. С помощью этого кода я вижу только фоновое изображение, а не градиент, границу и закругленные углы. Кроме того, когда я нажимаю кнопку, она не изменяется (предполагается, что градиент изменится). Я не знаю, что не так с этим кодом? Если вместо селектора я использую список слоев, я получаю желаемый результат, но он не изменяется, когда я нажимаю кнопку. Спасибо за вашу помощь!

Ответы

Ответ 1

Ваш код для селектора неверен, потому что:

У вас есть два элемента для одного и того же состояния, и когда селектор встречает первое состояние (state_enabled) для элемента Bitmap, он остановится там, и ваш градиент никогда не появится (для этого вы должны использовать layer-list, который имеет элементы Bitmap и градиент сверху)
Селектор будет соответствовать состояниям в порядке. Когда вы нажмете Button, state_pressed никогда не будет активирован, потому что селектор будет сначала соответствовать state_enabled, который находится на первом элементе (для этого вы должны переместить код для state_pressed выше элементов state_enabled).

На самом деле вам следует просто удалить state_enabled, и пусть Bitmap + gradient будет значением по умолчанию для Button. Bellow - ваш селектор (я предположил, что вы хотите изменить градиент на изображении (но изображение должно появиться даже в нажатом состоянии, если это не требуется, оставляйте только градиент для state_pressed)):

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

    <item android:state_pressed="true">
        <layer-list>
            <item>
                <bitmap android:gravity="center" android:src="@drawable/bm_btn_background" android:tileMode="repeat" />
            </item>
            <item>
                <shape>
                     <gradient android:angle="270" android:endColor="#a0e0b071" android:startColor="#a0a67637" />
                     <stroke android:width="1dp" android:color="#5c3708" />
                     <corners android:radius="5dp" />
                     <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />
                </shape>
            </item>
        </layer-list>
    </item>

    <item android:state_enabled="true">
        <layer-list>
            <item>
                <bitmap android:gravity="center" android:src="@drawable/bm_btn_background" android:tileMode="repeat" />
            </item>
            <item>
                <shape android:shape="rectangle">
                    <gradient android:angle="270" android:endColor="#a0a67637" android:startColor="#a0e0b071" />
                    <stroke android:width="1dp" android:color="#5c3708" />
                    <corners android:radius="5dp" />
                    <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />
                </shape>
            </item>
        </layer-list>
    </item>


</selector>

Ответ 2

в моем случае я использую это. попробуйте

<item android:state_pressed="true">
    <shape>
        <solid android:color="@color/mediumGray" />

        <stroke
            android:width="1px"
            android:color="@color/darkGray" />

        <padding
            android:bottom="2dp"
            android:left="1dp"
            android:right="1dp"
            android:top="2dp" />

        <corners
            android:bottomLeftRadius="7sp"
            android:bottomRightRadius="7sp"
            android:topLeftRadius="7sp"
            android:topRightRadius="7sp" />
    </shape>
</item>
<item android:state_focused="true">
    <shape>
        <solid android:color="@color/mediumGray" />

        <stroke
            android:width="1px"
            android:color="@color/darkGray" />

        <padding
            android:bottom="2dp"
            android:left="1dp"
            android:right="1dp"
            android:top="2dp" />

        <corners
            android:bottomLeftRadius="7sp"
            android:bottomRightRadius="7sp"
            android:topLeftRadius="7sp"
            android:topRightRadius="7sp" />
    </shape>
</item>
<item>
    <shape>
        <solid android:color="@color/lightGray" />

        <stroke
            android:width="1px"
            android:color="@color/blackTransparent" />

        <padding
            android:bottom="2dp"
            android:left="1dp"
            android:right="1dp"
            android:top="2dp" />

        <corners
            android:bottomLeftRadius="7sp"
            android:bottomRightRadius="7sp"
            android:topLeftRadius="7sp"
            android:topRightRadius="7sp" />
    </shape>
</item>

Ответ 3

Взгляните на свое состояние attrubute

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

    <!-- Non focused states -->
    <item android:drawable="@drawable/nicebuttonround" android:state_focused="false" android:state_pressed="false" android:state_selected="false"/>
    <item android:drawable="@drawable/nicebuttonround" android:state_focused="false" android:state_pressed="false" android:state_selected="true"/>

    <!-- Focused states -->
    <item android:drawable="@drawable/nicebuttonroundi" android:state_focused="true" android:state_pressed="false" android:state_selected="false"/>
    <item android:drawable="@drawable/nicebuttonroundi" android:state_focused="true" android:state_pressed="false" android:state_selected="true"/>

    <!-- Pressed -->
    <item android:drawable="@drawable/nicebuttonroundi" android:state_pressed="true" android:state_selected="true"/>
    <item android:drawable="@drawable/nice22i" android:state_pressed="true"/>

</selector>

Для повторения фона как изображения вам просто нужно создать 9 изображений шага.

Ответ 4

Я добавил лишнее пространство для переноса в правую сторону изображения, используя параметр размера холста Photoshop, и он отлично подходит для меня. скачать ниже изображение, чтобы увидеть демо.