studio - progressbar android circle

Android 5.0-ProgressBar no se puede mostrar sobre un botón

Question

Creo que el título es bastante explícito sobre mi problema ... Así que aquí está mi diseño:

            <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>

En los SDK de Android <21, no hay problema, la barra de progreso se muestra correctamente sobre el botón y se centra en el botón. Pero en Android 5.0, la barra de progreso se muestra detrás del botón.

Así que puede ver que está correctamente posicionado cuando activa la opción "Mostrar límites de diseño" en la configuración de Opciones de desarrollador, pero no puede ver nada en la pantalla sin esa opción.

¿Alguien sabría cómo arreglar esto? Supongo que es una cuestión de elevación recientemente introducida, pero realmente no sé cómo cuidarla. Para el registro, estoy usando el estilo Theme.AppCompat recientemente lanzado de support.v7.

EDITAR:

También intenté aplicar setElevation(0) y setTranslationY(0) al botón mediante programación pero no cambió nada. Así que me pregunto si tiene que lidiar con la elevación.

Gracias de antemano chicos

Mathieu

Answer 1

El mismo problema aquí, mi simple "pirateo" era también envolver el Botón en otro FrameLayout. De esta manera no me importa la versión api y otros problemas de elevación;)

<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>

Answer 2

Es mejor configurar android: translationZ más de 2dp. Su vista / widget desaparecerá cuando presione el botón. Le expliqué la razón here .

<!-- 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>

Los botones tienen estos dos valores y se definen en el framework .

Answer 3

La misma pregunta que se hace aquí, con una mejor explicación del problema:

https://.com/a/27216368/235910

Para citar @CommonsWare:

El problema aparece en la propiedad de elevation Android 5.0. Aparentemente, el ordenamiento del eje Z de RelativeLayout está vinculado a la elevation . Si ambos widgets tienen la misma elevation , el RelativeLayout determinará el orden del eje Z: puede ver que si cambia el diseño para que sea ambos widgets de Button , por ejemplo. Sin embargo, si un widget ( Button ) tiene una elevation , y otro widget ( ImageView ) no, la elevation tendrá prioridad.

Puede eliminar la elevation del Button través de android:stateListAnimator="@null" o definiendo su propio animador personalizado . O bien, puede agregar un poco de elevation a su ImageView para que esté más alto en el eje Z que el Button .

Answer 4

Probablemente, la forma más sencilla es usar FrameLayout ya que se creó para hacer diseños cuyas vistas secundarias están ordenadas por el índice z:

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

            <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" />
    </FrameLayout>

No estoy seguro de cómo se ve tu diseño, así que quizás android:layout_gravity jugar con android:layout_gravity .

Answer 5

Puedes usar el atributo android: translationZ en ProgressBar:

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