0

Necesito colocar el ImageView (tiene un ProgressBar encima) al final del RelativeLayout (encima del borde). He logrado hacerlo con un FloatingActionButton pero, al parecer el ImageView se comporta diferente.

XML:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFFFFF"
    tools:context=".MainActivity">

    <RelativeLayout
        android:id="@+id/relativeLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:elevation="4dp">

        <ImageView
            android:id="@+id/photoImageView"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:alpha="1.0"
            android:scaleType="centerCrop"
            tools:src="@drawable/default_post_photo" />

        <RelativeLayout
            android:id="@+id/playRelativeLayout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@id/photoImageView"
            android:layout_alignRight="@id/photoImageView"
            android:layout_marginBottom="16dp"
            android:layout_marginRight="16dp">

            <ImageView
                android:id="@+id/icon_play"
                android:layout_width="56dp"
                android:layout_height="56dp"
                app:srcCompat="@drawable/ic_play2_white_24dp" />

            <ProgressBar
                android:id="@+id/playProgressBar"
                android:layout_width="56dp"
                android:layout_height="56dp"
                android:layout_alignLeft="@+id/icon_play"
                android:layout_alignTop="@+id/icon_play"
                android:theme="@style/CircularProgress"
                android:visibility="visible" />
        </RelativeLayout>

    </RelativeLayout>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/shareFloatingActionButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/relativeLayout"
        android:layout_alignParentRight="true"
        android:layout_marginBottom="-28dp"
        android:layout_marginRight="16dp"
        app:backgroundTint="@color/colorPrimary"
        app:srcCompat="@drawable/ic_share_white_24dp" />

</RelativeLayout>

introducir la descripción de la imagen aquí

Si al ImageView le agrego android:layout_marginBottom="-16dp" se esconde la mitad, es decir, solo se visualiza la mitad del ImageView en pantalla.

introducir la descripción de la imagen aquí

Había pensado colocar otro FloatingActionButton en lugar de un ImageView pero, no encontraba la forma de agregarle un ProgressBar encima.

Espero puedan ayudarme y gracias de antemano.

2
  • ¿Y si lo colocas fuera de ese relative layout? es decir, que lo pongas a la altura del botón de share.
    – x4mp73r
    Commented el 10 sept. 2018 a las 19:32
  • @x4mp73r He probado de todo y no logro hacerlo.
    – RRGT19
    Commented el 10 sept. 2018 a las 19:44

1 respuesta 1

0

Prueba colocando esto:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFFFFF"
    tools:context=".MainActivity">

    <RelativeLayout
        android:id="@+id/relativeLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:elevation="4dp">

        <ImageView
            android:id="@+id/photoImageView"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:alpha="1.0"
            android:scaleType="centerCrop"
            tools:src="@drawable/default_post_photo" />

        <View
            android:layout_width="match_parent"
            android:layout_height="28dp"
            android:layout_below="@+id/photoImageView"
            android:background="@android:color/transparent"/>

        <RelativeLayout
            android:id="@+id/playRelativeLayout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/photoImageView"
            android:layout_toLeftOf="@+id/shareFloatingActionButton"
            android:layout_marginTop="-28dp"
            android:layout_marginRight="16dp">

            <ImageView
                android:id="@+id/icon_play"
                android:layout_width="56dp"
                android:layout_height="56dp"
                app:srcCompat="@drawable/ic_play2_white_24dp" />

            <ProgressBar
                android:id="@+id/playProgressBar"
                android:layout_width="56dp"
                android:layout_height="56dp"
                android:layout_alignLeft="@+id/icon_play"
                android:layout_alignTop="@+id/icon_play"
                android:theme="@style/CircularProgress"
                android:visibility="visible" />
        </RelativeLayout>

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/shareFloatingActionButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_below="@+id/photoImageView"
            android:layout_marginRight="16dp"
            android:layout_marginTop="-28dp"
            app:backgroundTint="@color/colorPrimary"
            app:srcCompat="@drawable/ic_share_white_24dp" />
    </RelativeLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/relativeLayout"
        android:layout_marginTop="-28dp"
        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Texto para rellenar"
            android:layout_marginLeft="16dp"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Texto para rellenar"
            android:layout_marginLeft="16dp"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Texto para rellenar"
            android:layout_marginLeft="16dp"/>

    </LinearLayout>

</RelativeLayout>

Lo que hice fue colocar un view transparente y colocar debajo de imageview el boton y colocar la mitad del tamaño del objeto en marginTop = -28dp.

2
  • Hola compañero, gracias por tratar de ayudarme. He probado tu código y el ImageView se visualiza correctamente encima del borde pero, el FloatingActionButton no, este está debajo de la foto (prueba: oi68.tinypic.com/2e67nr5.jpg). Además de esto, el espacio transparente que has puesto debajo se vuelve inutilizable y requiero ese espacio ya que tengo unos cuantos TextView ahí. Debido a ese espacio transparente, todos mis TextView se han desplazado más hacia abajo.
    – RRGT19
    Commented el 10 sept. 2018 a las 22:25
  • Revisa el nuevo codigo q agregue deberia funcionar asi, ademas que agregue los texto que mencionas Commented el 10 sept. 2018 a las 23:04

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.