Align shape to center of textview on Relative layout

Javier Toscano

I need to center a circle shape to the center of a Textview in a RelativeLayout, i already tried with android:gravity but is not working this this.

This is the actual layout I'm using:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:id="@+id/swipeLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="8dp">

            <ImageView
                android:id="@+id/rvSincronizado"
                android:layout_width="10dp"
                android:layout_height="10dp"
                android:gravity="center_vertical"
                android:layout_marginLeft="5dp"
                android:background="@drawable/circle" />

            <TextView
                android:id="@+id/rvDescripcion"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:layout_toRightOf="@id/rvSincronizado"
                android:text=""
                android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
                android:textColor="#000000" />

            <TextView
                android:id="@+id/rvetMarca"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/rvDescripcion"
                android:layout_marginLeft="5dp"
                android:layout_marginTop="5dp"
                android:text="@string/rvetMarca"
                android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
                />

            <TextView
                android:id="@+id/rvMarca"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/rvDescripcion"
                android:layout_toRightOf="@+id/rvetMarca"
                android:layout_marginLeft="5dp"
                android:layout_marginTop="5dp"
                android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
                />

            <TextView
                android:id="@+id/rvetModelo"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/rvDescripcion"
                android:layout_marginLeft="5dp"
                android:layout_marginTop="5dp"
                android:text="@string/rvetModelo"
                android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
                android:layout_toRightOf="@id/rvMarca"/>

            <TextView
                android:id="@+id/rvModelo"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/rvDescripcion"
                android:layout_toRightOf="@+id/rvetModelo"
                android:layout_marginLeft="5dp"
                android:layout_marginTop="5dp"
                android:textAppearance="@style/Base.TextAppearance.AppCompat.Small" />

            <TextView
                android:id="@+id/rvetSerie"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/rvetMarca"
                android:layout_marginLeft="5dp"
                android:layout_marginTop="5dp"
                android:text="@string/rvetSerie"
                android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
                />

            <TextView
                android:id="@+id/rvSerie"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/rvetModelo"
                android:layout_toRightOf="@+id/rvetSerie"
                android:layout_marginLeft="5dp"
                android:layout_marginTop="5dp"
                android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
                />
        </RelativeLayout>
</LinearLayout>

This is how currently looks

Thanks for the help!!

Ben P.

You cannot accomplish what you're trying to do using RelativeLayout. It only allows you to specify one rule for vertical alignment (e.g. layout_alignTop or layout_alignBottom) and there's no "alignCenterVertically" or similar.

You could instead try using ConstraintLayout, which does allow you to specify multiple constraints for vertical alignment. You have to convert all of your android:layout_below attributes to app:layout_constraintTop_toBottomOf, and you have to convert all of your android:layout_toRightOf attrs to app:layout_constraintLeft_toRightOf, but the conversion is overall pretty simple. Once you've done that, you can add these two constraints to your circle ImageView:

app:layout_constraintTop_toTopOf="@+id/rvDescripcion"
app:layout_constraintBottom_toBottomOf="@+id/rvDescripcion"

Here's the whole thing:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/swipeLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <android.support.constraint.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="8dp">

        <ImageView
            android:id="@+id/rvSincronizado"
            android:layout_width="10dp"
            android:layout_height="10dp"
            android:layout_marginLeft="5dp"
            android:gravity="center_vertical"
            android:background="@drawable/circle"
            app:layout_constraintTop_toTopOf="@+id/rvDescripcion"
            app:layout_constraintBottom_toBottomOf="@+id/rvDescripcion"/>

        <TextView
            android:id="@+id/rvDescripcion"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:textColor="#000000"
            android:text="PRENSA"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
            app:layout_constraintLeft_toRightOf="@id/rvSincronizado"/>

        <TextView
            android:id="@+id/rvetMarca"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:layout_marginLeft="5dp"
            android:text="@string/rvetMarca"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
            app:layout_constraintTop_toBottomOf="@id/rvDescripcion"/>

        <TextView
            android:id="@+id/rvMarca"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:layout_marginLeft="5dp"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
            app:layout_constraintTop_toBottomOf="@id/rvDescripcion"
            app:layout_constraintLeft_toRightOf="@+id/rvetMarca"/>

        <TextView
            android:id="@+id/rvetModelo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:layout_marginLeft="5dp"
            android:text="@string/rvetModelo"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
            app:layout_constraintTop_toBottomOf="@id/rvDescripcion"
            app:layout_constraintLeft_toRightOf="@id/rvMarca"/>

        <TextView
            android:id="@+id/rvModelo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:layout_marginLeft="5dp"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
            app:layout_constraintTop_toBottomOf="@id/rvDescripcion"
            app:layout_constraintLeft_toRightOf="@+id/rvetModelo"/>

        <TextView
            android:id="@+id/rvetSerie"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:layout_marginLeft="5dp"
            android:text="@string/rvetSerie"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
            app:layout_constraintTop_toBottomOf="@id/rvetMarca"/>

        <TextView
            android:id="@+id/rvSerie"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:layout_marginLeft="5dp"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
            app:layout_constraintTop_toBottomOf="@id/rvetModelo"
            app:layout_constraintLeft_toRightOf="@+id/rvetSerie"/>

    </android.support.constraint.ConstraintLayout>

</LinearLayout>

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

To align all buttons equally in relative layout

分類Dev

gravity bottom not working with textview inside relative layout

分類Dev

Button in relative layout pushed off screen by TextView

分類Dev

Need help on creating 4 relative layouts inside a grid layout (2x2) and put one button in the center of each relative layout

分類Dev

layout-align = "center"が機能しないAngular

分類Dev

Angular MaterialとIE: Internet Explorerでlayout-align="center center"ができない

分類Dev

how to align this items at center?

分類Dev

FastReport barcode align to center

分類Dev

text align center not working

分類Dev

How to align <div> to center?

分類Dev

Relative layout and navigation drawer?

分類Dev

Dynamically create textview in center

分類Dev

Aligning center relative to others views

分類Dev

Center align container and left align child elements

分類Dev

Flexbox - align : center / justify : center with unknown height

分類Dev

Why is not center this layout?

分類Dev

Align View to the top of a rotated TextView

分類Dev

How to align 3 boxes in the center

分類Dev

How to center align table - PDFMAKE

分類Dev

align two SVGs at the center of their container

分類Dev

CSS background image align to center

分類Dev

How to align content to the center of the page?

分類Dev

Alignment of views in relative layout android

分類Dev

Relative Layout squishing child views

分類Dev

Move toolbar to top of relative layout

分類Dev

retrieve dynamic layout textview value?

分類Dev

when selected add border shape for textView and editText ,

分類Dev

Center a widget in a layout with Qt Designer

分類Dev

Set Item Alpha relative to center on Horizontal RecyclerView

Related 関連記事

ホットタグ

アーカイブ