web-dev-qa-db-fra.com

Comment supprimer la bordure/l'ombre des boutons Lollipop

Les boutons ont l'air bien pour api <21. Cependant, les versions +21 créent cette bordure ou cette ombre qui apparaît sur l'image ci-dessous. Comment puis-je m'en débarrasser sans changer le thème du trou, mais en définissant une variable de style?

enter image description here

C'est peut-être plus clair sur cette image colorée. Il y a une sorte de bordure autour des boutons .enter image description here

Mon style de boutons est défini comme ceci:

<style name="buttonTransparent" parent="Base.TextAppearance.AppCompat.Button">
        <item name="Android:background">#00000000</item>
        <item name="Android:textColor">@drawable/button_text_blue</item>
        <item name="Android:textSize">18dp</item>
        <item name="Android:textAllCaps">false</item>
        <item name="Android:minHeight">45dp</item>
    </style>

<style name="buttonLargeWhite" parent="buttonTransparent">
        <item name="Android:background">#FFF</item>
        <item name="Android:layout_marginTop">10dp</item>
    </style>
37
7heViking

Lollipop a une petite fonctionnalité méchante appelée stateListAnimator qui gère les élévations sur les boutons, ce qui conduit aux ombres.

Supprimez la stateListAnimator pour vous débarrasser des ombres.

Vous avez plusieurs options pour le faire:

Java:

button.setStateListAnimator(null);

Kotlin:

button.stateListAnimator = null

ou dans votre mise en page XML:

<Button
...
Android:stateListAnimator="@null" 
....
/> 
157
daemmie

La meilleure et la plus simple que j'utilise est de définir l'attribut de style sur Button 

<Button
...
style="?android:attr/borderlessButtonStyle"
....
/> 

peut-être que quelqu'un a besoin à l'avenir.

32
WonderSoftwares

Il existe déjà un style que vous pouvez utiliser pour ne pas avoir de frontières.

appliquer 

style="@style/Base.Widget.AppCompat.Button.Borderless" 

à votre article pour supprimer les frontières

6
Olivier Mercier

J'ai corrigé ceci globalement en mettant Android:stateListAnimator="@null" dans Resources\values\styles.xml:

<?xml version="1.0" encoding="UTF-8"?>
<resources>
    <style name="AppTheme" parent="AppTheme.Base">
    </style>
    <style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="Android:buttonStyle">@style/NoShadowButton</item>
    </style>
    <style name="NoShadowButton" parent="Android:style/Widget.Button">
        <item name="Android:stateListAnimator">@null</item>
    </style>
</resources>

Et voila l'ombre est partie pour de bon :)

6
Korayem

L'effet "shadow" est ajouté sur Thème Lollipop Appcompat

ajoutez la ligne suivante dans res/values-v21/styles.xml pour supprimer l'ombre par défaut

Niveau du thème:

<item name="Android:buttonStyle">@style/Widget.AppCompat.Button.Borderless</item>

mise en page xml:

Android:stateListAnimator="@null"

Java:

setStateListAnimator(null);

Kotlin:

stateListAnimator = null
3
John Ruban Singh

Problème

  1. Depuis Android v21, Border a été ajouté par défaut pour tous les boutons.

    <!-- Bordered ink button -->
    <style name="Widget.Material.Button">
         <item name="background">@drawable/btn_default_material</item>
         <item name="textAppearance">?attr/textAppearanceButton</item>
         <item name="minHeight">48dip</item>
         <item name="minWidth">88dip</item>
         <item name="stateListAnimator">@anim/button_state_list_anim_material</item>
         <item name="focusable">true</item>
         <item name="clickable">true</item>
         <item name="gravity">center_vertical|center_horizontal</item>
    </style>
    
    • La propriété " stateListAnimator " est la cause du problème.

Solution

  1. Dans notre thème d'application, définissez le style du bouton pour supprimer la bordure par défaut (la bibliothèque de support Android lui-même en fournit le style).

    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
         <!-- From Android-v21 - Border has been added by default, hence we are removing it. -->
         <item name="Android:buttonStyle">@style/Widget.AppCompat.Button.Borderless</item>
    </style>
    
1
Vasanth

Je suggère que vous supprimiez complètement l'ombre, en réglant l'altitude à néant. Puisque vous avez déjà un style XML (ajoutez-le pour l'utiliser universellement), ou vous pouvez ajouter cet attribut à la définition de votre vue XML.

Android:elevation="0dp"
1
Booger

Les boutons dans Android ont la propriété statelistAnimator, donc en le déclarant null, nous pouvons supprimer la bordure du bouton

Android:stateListAnimator="@null"
0

Si vous voulez faire cela par programme dans Kotlin, vous pouvez faire

button.stateListAnimator = null
0
Nari Kim Shin

en XML, nous pouvons utiliser

Android:stateListAnimator="@null"
0
Ankit Tomer