web-dev-qa-db-fra.com

Android 5.0 - ProgressBar ne peut pas être affiché sur un bouton

Je pense que le titre est assez explicite sur mon problème ... Voici donc ma mise en page:

            <RelativeLayout
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content">

                <Button
                    Android:id="@+id/button_action"
                    Android:layout_width="match_parent"
                    Android:layout_height="wrap_content"
                    Android:text="Login" />

                <ProgressBar
                    Android:id="@+id/progress_bar"
                    Android:layout_width="50dp"
                    Android:layout_height="50dp"
                    Android:layout_centerInParent="true"/>

            </RelativeLayout>

Sur Android SDK <21, pas de problème, la barre de progression est correctement affichée sur le bouton et centrée sur le bouton. Mais sur Android 5.0, la barre de progression est affichée derrière le bouton.

Vous pouvez donc voir qu'il est correctement positionné lorsque vous activez l'option "Afficher les limites de la disposition" dans les paramètres des options du développeur, mais vous ne pouvez rien voir à l'écran sans cette option.

Quelqu'un sait-il comment résoudre ce problème? Je suppose que c'est une question de élévation récemment introduit, mais je ne sais vraiment pas comment m'en occuper. Pour mémoire, j'utilise le style Theme.AppCompat récemment publié dans le support.v7.

MODIFIER:

J'ai également essayé d'appliquer setElevation(0) et setTranslationY(0) au bouton par programme, mais cela n'a rien changé. Je me demande donc si cela doit traiter de l'élévation.

Merci d'avance les gars

Mathieu

androidandroid-buttonandroid-progressbarandroid-5.0-lollipop
26
MathieuMaree

Vous pouvez utiliser l'attribut Android: translationZ dans ProgressBar:

        <ProgressBar
            Android:id="@+id/progress_bar"
            Android:layout_width="50dp"
            Android:layout_height="50dp"
            Android:translationZ="2dp"
            Android:layout_centerInParent="true"/>
53
wpiwonski

Même problème ici, mon simple "hack" était trop envelopper le bouton dans un autre FrameLayout. De cette façon, je ne me soucie pas de la version api et d'autres problèmes d'élévation;)

<FrameLayout
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_gravity="center" >

        <FrameLayout
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content">
                <Button
                    Android:id="@+id/button_action"
                    Android:layout_width="match_parent"
                    Android:layout_height="wrap_content"
                    Android:text="Login" />
        </FrameLayout>

        <ProgressBar
            Android:id="@+id/progress_bar"
            Android:layout_width="50dp"
            Android:layout_height="50dp" />
</FrameLayout>
9
Tobliug

Même question posée ici, avec une meilleure explication du problème:

https://stackoverflow.com/a/27216368/23591

Pour citer @CommonsWare:

Le problème apparaît Android 5.0 propriété elevation. Apparemment, l'ordre RelativeLayout de l'axe Z est lié à elevation. Si les deux widgets ont le même elevation, le RelativeLayout déterminera l'ordre de l'axe Z - vous pouvez voir que si vous changez votre disposition pour être les deux widgets Button, par exemple. Cependant, si un widget (Button) a un elevation, et un autre widget (ImageView) n'en a pas, le elevation aura la priorité.

Vous pouvez supprimer le Buttonelevation via Android:stateListAnimator="@null" ou par définir votre propre animateur personnalisé . Ou, vous pouvez ajouter un elevation à votre ImageView pour qu'il soit plus haut sur l'axe Z que le Button.

5
LambergaR

Si vous ajoutez 'androidx.core: core' à votre build.gradle, vous pouvez utiliser ce code pour l'API <21:

ViewCompat.setTranslationZ(viewToElevate, 5);
0
sp00ky

Il est préférable de configurer Android: translationZ plus de 2dp. Votre vue/widget disparaîtra lorsque vous appuyez sur le bouton. J'ai expliqué la raison ici .

<!-- Elevation when button is pressed -->
<dimen name="button_elevation_material">1dp</dimen>
<!-- Z translation to apply when button is pressed -->
<dimen name="button_pressed_z_material">2dp</dimen>

Le bouton a ces deux valeurs et défini dans le framework .

0
zzas11