Эффект пульсации на фигуре

Попытка сделать что-то действительно простое здесь и посмотрела кучу SO-ресурса, но безрезультатно. Я пытаюсь получить эффект пульсации на кнопке, которая использует фон drawable типа shape drawable. Соответствующие файлы:

background_button:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <stroke
        android:width="1px"
        android:color="#80ffffff" />
    <solid android:color="@android:color/transparent" />
</shape>

ripple.xml в папке drawable-v21:

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="?attr/colorControlHighlight">
    <item android:drawable="@drawable/background_button"/>
</ripple>

Button.xml:

   <Button
                    android:id="@+id/login_button"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="20dp"
                    android:layout_weight="1"
                    android:paddingTop="10dp"
                    android:paddingBottom="10dp"
                    android:background="@drawable/ripple"


 />

Что здесь не так. Спасибо!

ОТВЕТЫ

Ответ 1

Мой совет - не использовать тег <ripple. У меня есть две причины: сделать то, что вы хотите, не так просто, и у вас есть 2 разных файла .xml для каждого фона. Мне не нравится иметь папку drawable-v21.

Мое решение состоит в том, чтобы обернуть ваш Button с помощью FrameLayout и использовать атрибут android:foreground. Таким образом, вы можете иметь любой фон, который вы хотите, и вы можете сохранить эффект пульсации.

<FrameLayout
    android:id="@+id/login_button"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="20dp"
    android:layout_weight="1"
    android:paddingTop="10dp"
    android:paddingBottom="10dp"
    android:foreground="?attr/selectableItemBackground">

    <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/background_button"/>
</FrameLayout>

Обратите внимание, что я переместил все атрибуты и id в FrameLayout. Вы должны установить onClickListener в FrameLayout вместо Button.

Btw, ?attr/selectableItemBackground отлично. Используйте его как можно больше. Он заменяет синий цвет Holo серым для старых устройств с Android 4.0 до 4.3.

Ответ 2

Попробуйте это.

ripple_effect.xml

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="#2797e0"
tools:targetApi="lollipop">
<item android:id="@android:id/mask">
    <shape android:shape="rectangle">
        <solid android:color="#2797e0" />
    </shape>
</item>

button.xml

 <Button
                android:id="@+id/login_button"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="20dp"
                android:layout_weight="1"
                android:paddingTop="10dp"
                android:paddingBottom="10dp"
                android:background="@drawable/ripple_effect"/>

build.gradle

   compile 'com.android.support:appcompat-v7:23.1.1'

Ответ 3

который работает для меня drawable/rect.xml

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/listview_background_shape">
    <stroke android:width="1dp" android:color="#FF4C71F5" />
    <padding android:left="0dp"
        android:top="0dp"
        android:right="0dp"
        android:bottom="0dp" />
    <corners android:radius="5dp" />
    <solid android:color="#00000000" />

</shape>

и для рябь drawable/rip.xml

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:color="#f816a463"
    tools:targetApi="lollipop">
    <item android:id="@android:id/mask">
        <shape android:shape="rectangle">
            <solid android:color="#f816a463" />
        </shape>
    </item>
</ripple>

и для вашей кнопки

 <Button
                android:id="@+id/nm"
                android:layout_width="80dp"
                android:layout_height="40dp"
                android:layout_weight="1"
                android:background="@drawable/rect"
                android:enabled="true"
                android:text="@string/vnm"
                android:textColor="@color/colorpr"
                android:textStyle="bold"
                android:foreground="@drawable/rip"/>

надеюсь эта помощь!!!

Ответ 4

У меня была похожая задача. Позвольте мне объяснить, как я это решаю. Он выводит круговые изображения с эффектами тени и пульсации, не выходящими за границы круга.

<ImageView
    android:id="@+id/iv_undo"
    android:layout_width="@dimen/iv_width_altmenu"
    android:layout_height="@dimen/iv_height_altmenu"
    android:src="@drawable/undo"
    android:elevation="@dimen/elevation_buttons"
    android:foreground="@drawable/ripple_effect"
    android:background="@drawable/buttons_inactive_coloring"
   />

Следующее обеспечивает волновой эффект:

android:foreground="@drawable/ripple_effect"

Ниже представлен круг imageView.

android:background="@drawable/buttons_inactive_coloring"

Следующее обеспечивает тень:

android:foreground="@drawable/ripple_effect"

Другая проблема, с которой вы можете столкнуться, это волновой эффект, выходящий за границы круга. Чтобы решить, используйте следующий файл (ripple_effect.xml)

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:color="@color/button_active"
    tools:targetApi="lollipop">
    <item android:id="@android:id/mask">
        <shape android:shape="oval">
            <solid android:color="@color/button_active" />
        </shape>
    </item>
</ripple>

Если вы не используете следующее:

<item android:id="@android:id/mask">
        <shape android:shape="oval">
            <solid android:color="@color/button_active" />
        </shape>
    </item>

волновой эффект выходит за границы круга, и это не выглядит красиво. Будьте осторожны и успокойтесь.

Ответ 5

Эта работа для меня..

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:color="@color/smooth_white"
    tools:targetApi="lollipop">
    <item android:drawable="@drawable/button_green_background" />
    <item android:id="@android:id/mask">
        <shape android:shape="rectangle">
            <solid android:color="@color/smooth_white" />
        </shape>
    </item>
</ripple>

Точка - это раздел

<item android:drawable="@drawable/button_green_background" />

Ответ 6

Более простое решение - использовать этот drawable-xml в качестве значения свойства "android: background" кнопки:

рисуем /bkg_ripple.xml:

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?attr/colorControlHighlight">
    <item android:drawable="?attr/colorPrimary"/>
    <item android:id="@android:id/mask">
        <shape android:shape="rectangle">
            <solid android:color="#000000" />
        </shape>
    </item>
</ripple>

button.xml:

<Button
    android:id="@+id/mybutton"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    ...
    android:background="@drawable/bkg_ripple"
/>

Ответ 7

Это поможет

<com.abcd.ripplebutton.widget.RippleButton
        android:id="@+id/Summit"
        android:layout_width="260dp"
        android:layout_height="50dp"
        android:text="Login"
        android:textColor="@color/white"
        android:textStyle="bold"
        app:buttonColor="@color/Button"
        app:rippleColor="@color/white" />

Подробнее... this

Ответ 8

Быстрое решение

    <?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:color="@color/blue"
    tools:targetApi="lollipop">
    <item
        android:id="@android:id/mask"
        tools:targetApi="lollipop">
        <shape android:shape="rectangle">
            <solid android:color="@color/blue" />
            <corners android:radius="5dp" />
        </shape>
    </item>

    <item android:id="@android:id/background">
        <shape android:shape="rectangle">
            <stroke
                android:width="0.1dp"
                android:color="#312D2D" />
            <solid android:color="#FFF" />
            <corners android:radius="50dp" />
            <padding
                android:bottom="5dp"
                android:left="5dp"
                android:right="5dp"
                android:top="5dp" />
        </shape>
    </item>
</ripple>