Comment fournir l'ombre Button

Question

Comme vous pouvez le voir dans l'image, je veux l'ombre derrière un Button. J'ai créé Button avec des coins arrondis. Mais le problème est que je ne peux pas générer une ombre derrière cela Button. Comment puis-je atteindre cet objectif?

Answer 1

Utilisez cette méthode pour obtenir votre look désiré.
button_selector.xml:

<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
<item> 
    <layer-list> 
     <item android:right="5dp" android:top="5dp"> 
      <shape> 
       <corners android:radius="3dp" /> 
       <solid android:color="#D6D6D6" /> 
      </shape> 
     </item> 
     <item android:bottom="2dp" android:left="2dp"> 
      <shape> 
       <gradient android:angle="270" 
        android:endColor="#E2E2E2" android:startColor="#BABABA" /> 
       <stroke android:width="1dp" android:color="#BABABA" /> 
       <corners android:radius="4dp" /> 
       <padding android:bottom="10dp" android:left="10dp" 
        android:right="10dp" android:top="10dp" /> 
      </shape> 
     </item> 
    </layer-list> 
</item> 

</selector> 

Et dans votre mise en page xml:

<Button 
    android:background="@drawable/button_selector" 
    ... 
    .. 
/> 

Answer 2

Essayez ceci si cela fonctionne pour vous

android:background="@drawable/drop_shadow" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:paddingLeft="3dp" 
     android:paddingTop="3dp" 
     android:paddingRight="4dp" 
     android:paddingBottom="5dp" 

Answer 3

Pour la version Android 5.0 ci-dessus &

essayer le Elevation pour d'autres vues ..

android:elevation="10dp" 

pour les boutons,

android:stateListAnimator="@anim/button_state_list_animator" 

button_state_list_animator.xml - https://android.googlesource.com/platform/frameworks/base/+/master/core/res/res/anim/button_state_list_anim_material.xml

ci-dessous la version 5.0,

Pour toutes les vues,

android:background="@android:drawable/dialog_holo_light_frame" 

Ma sortie:

Answer 4

Si vous ciblez des appareils pré-Lollipop, vous pouvez utiliser Shadow-Layout, car il est facile et vous pouvez l'utiliser dans différents types de mises en page.

Ajouter une ombre de mise en page à votre fichier Gradle:

dependencies { 
    compile 'com.github.dmytrodanylyk.shadow-layout:library:1.0.1' 
} 

En haut, la mise en page de xml où vous avez votre bouton, ajouter à haut:

xmlns:app="http://schemas.android.com/apk/res-auto" 

il mettra à disposition les attributs personnalisés.

Ensuite, vous mettez une mise en page d'ombre autour de vous Bouton:

<com.dd.ShadowLayout 
     android:layout_marginTop="16dp" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     app:sl_shadowRadius="4dp" 
     app:sl_shadowColor="#AA000000" 
     app:sl_dx="0dp" 
     app:sl_dy="0dp" 
     app:sl_cornerRadius="56dp"> 

     <YourButton 
      .... /> 

</com.dd.ShadowLayout> 

Vous pouvez ensuite modifier les paramètres app: pour correspondre à votre ombre nécessaire.

Espérons que ça aide.

Answer 5

J'ai essayé le code ci-dessus et j'ai créé ma propre ombre qui est un peu plus proche de ce que j'essaie d'obtenir. Peut-être que cela aidera aussi les autres.

<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item> 
     <layer-list> 
      <item android:left="5dp" android:top="5dp"> 
       <shape> 
        <corners android:radius="3dp" /> 
        <gradient 
         android:angle="315" 
         android:endColor="@android:color/transparent" 
         android:startColor="@android:color/black" 
         android:type="radial" 
         android:centerX="0.55" 
         android:centerY="0" 
         android:gradientRadius="300"/> 
        <padding android:bottom="1dp" android:left="0dp" android:right="3dp" android:top="0dp" /> 
       </shape> 
      </item> 
      <item android:bottom="2dp" android:left="3dp"> 
       <shape> 
        <corners android:radius="1dp" /> 
        <solid android:color="@color/colorPrimary" /> 


       </shape> 
      </item> 
     </layer-list> 
    </item> 

</selector> 

Answer 6

Voici mon bouton avec l'ombrecw_button_shadow.xmlsousdrawabledossier

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:state_pressed="false"> 
     <layer-list> 
      <!-- SHADOW --> 
      <item> 
       <shape> 
        <solid android:color="@color/red_400"/> 
        <!-- alttan gölge --> 
        <corners android:radius="19dp"/> 
       </shape> 
      </item> 
      <!-- BUTTON alttan gölge 
       android:right="5px" to make it round--> 
      <item 
       android:bottom="5px" 
       > 
       <shape> 
        <padding android:bottom="5dp"/> 
        <gradient 
         android:startColor="#1c4985" 
         android:endColor="#163969" 
         android:angle="270" /> 
        <corners 
         android:radius="19dp"/> 
        <padding 
         android:left="10dp" 
         android:top="10dp" 
         android:right="5dp" 
         android:bottom="10dp"/> 
       </shape> 
      </item> 
     </layer-list> 
    </item> 

    <item android:state_pressed="true"> 
     <layer-list> 
      <!-- SHADOW --> 
      <item> 
       <shape> 
        <solid android:color="#102746"/> 
        <corners android:radius="19dp"/> 

       </shape> 
      </item> 
      <!-- BUTTON --> 
      <item android:bottom="5px"> 
       <shape> 
        <padding android:bottom="5dp"/> 
        <gradient 
         android:startColor="#1c4985" 
         android:endColor="#163969" 
         android:angle="270" /> 
        <corners 
         android:radius="19dp"/> 
        <padding 
         android:left="10dp" 
         android:top="10dp" 
         android:right="5dp" 
         android:bottom="10dp"/> 
       </shape> 
      </item> 
     </layer-list> 
    </item> 
</selector> 

Comment utiliser. xml bouton, vous pouvez redimensionner votre taille et votre poids

<Button 
       android:text="+ add friends" 
       android:layout_width="120dp" 
       android:layout_height="40dp" 
       android:background="@drawable/cw_button_shadow" /> 

Answer 7

Vous pouvez essayer ceci:

<?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 android:left="1dp" android:top="3dp"> 
      <shape> 
       <solid android:color="#a5040d" /> 
       <corners android:radius="3dip"/> 
      </shape> 
     </item> 
    </layer-list> 
    </item> 
<item> 
    <layer-list> 
     <item android:left="0dp" android:top="0dp"> 
      <shape> 
        <solid android:color="#99080d" /> 
       <corners android:radius="3dip"/> 
      </shape> 
     </item> 
     <item android:bottom="3dp" android:right="2dp"> 
      <shape> 
       <solid android:color="#a5040d" /> 
       <corners android:radius="3dip"/> 
      </shape> 
     </item> 
    </layer-list> 
</item> 

Answer 8

Sample 9 patch image with shadow

Après beaucoup de recherche J'ai trouvé une méthode facile.

Créez une image de 9 patchs et appliquez-la comme bouton ou n'importe quel arrière-plan de vue.

Vous pouvez créer une image de 9 patch avec ombre à l'aide de website.

Placez l'image du patch 9 dans votre répertoire pouvant être tracé et appliquez-la comme arrière-plan du bouton.

mButton.setBackground(ContextCompat.getDrawable(mContext, R.drawable.your_9_patch_image);