Android RippleDrawable


Exemple

L'effet tactile Ripple a été introduit avec la conception matérielle sous Android 5.0 (API niveau 21) et l'animation est implémentée par la nouvelle classe RippleDrawable .

Dessiné qui montre un effet d'entraînement en réponse aux changements d'état. La position d'ancrage de l'ondulation pour un état donné peut être spécifiée en appelant setHotspot(float x, float y) avec l'identificateur d'attribut state correspondant.

5.0

En général, l'effet d'ondulation pour les boutons standard fonctionne par défaut dans l'API 21 et au-dessus, et pour d'autres vues accessibles, il peut être obtenu en spécifiant:

android:background="?android:attr/selectableItemBackground">

pour les ondulations contenues dans la vue ou:

android:background="?android:attr/selectableItemBackgroundBorderless"

pour les ondulations qui dépassent les limites de la vue.

Par exemple, dans l'image ci-dessous,

  • B1 est un bouton sans arrière-plan,
  • B2 est configuré avec android:background="android:attr/selectableItemBackground"
  • B3 est configuré avec android:background="android:attr/selectableItemBackgroundBorderless"

(Courtoisie d'image: http://blog.csdn.net/a396901990/article/details/40187203 )

Vous pouvez obtenir la même chose en code en utilisant:

int[] attrs = new int[]{R.attr.selectableItemBackground};
TypedArray typedArray = getActivity().obtainStyledAttributes(attrs);
int backgroundResource = typedArray.getResourceId(0, 0);
myView.setBackgroundResource(backgroundResource);

Les ondulations peuvent également être ajoutées à une vue en utilisant l'attribut android:foreground la même manière que ci-dessus. Comme son nom l' indique, dans le cas où l'ondulation est ajouté au premier plan, l'ondulation apparaîtra au- dessus de toute vue , il est ajouté à (par exemple ImageView , un LinearLayout contenant des vues multiples, etc.).

Si vous souhaitez personnaliser l'effet d'ondulation dans une vue, vous devez créer un nouveau fichier XML dans le répertoire pouvant être dessiné.

Voici quelques exemples:

Exemple 1 : une ondulation sans limite

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#ffff0000" />

Exemple 2 : Ondulation avec masque et couleur d'arrière-plan

<ripple android:color="#7777777"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@android:id/mask"
        android:drawable="#ffff00" />
    <item android:drawable="@android:color/white"/>
</ripple>

S'il existe une view avec un arrière-plan déjà spécifié avec une shape , des corners et d'autres balises, pour ajouter une ondulation à cette vue, utilisez un mask layer et définissez l'ondulation comme arrière-plan de la vue.

Exemple :

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

Exemple 3 : Ondulation sur une ressource pouvant être dessinée

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#ff0000ff">
    <item android:drawable="@drawable/my_drawable" />
</ripple>

Utilisation: Pour associer votre fichier xml à une vue, définissez-le comme arrière-plan (en supposant que votre fichier d'ondulation s'appelle my_ripple.xml ):

<View 
    android:id="@+id/myViewId"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/my_ripple" />

Sélecteur:

L'ondulation pouvant être utilisée à la place des sélecteurs d'état de couleur si votre version cible est v21 ou supérieure (vous pouvez également placer le sélecteur d'ondulation dans le dossier drawable-v21 ):

<!-- /drawable/button.xml: -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@drawable/button_pressed"/>
    <item android:drawable="@drawable/button_normal"/>
</selector>

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

Dans ce cas, la couleur de l'état par défaut de votre vue serait blanche et l'état pressé indiquerait l'ondulation.

Point à noter: Using ?android:colorControlHighlight donnera à la ondulation la même couleur que les ondulations intégrées dans votre application.

Pour modifier uniquement la couleur de l'ondulation, vous pouvez personnaliser la couleur android:colorControlHighlight dans votre thème comme android:colorControlHighlight :

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

  <style name="AppTheme" parent="android:Theme.Material.Light.DarkActionBar">
    <item name="android:colorControlHighlight">@color/your_custom_color</item>
  </style>

</resources>

puis utilisez ce thème dans vos activités, etc. L'effet serait comme l'image ci-dessous:

(Courtoisie d'image: http://blog.csdn.net/a396901990/article/details/40187203 )