Leem
Leem

Reputation: 18308

center my text not only horizontally but also vertically in constraint layout edit pane

In ConstraintLayout, I have a TextView, I have set the alignment to align center in layout editor pane:

enter image description here

I clicked the middle one in above screenshot.

Then, my text looks like this:

enter image description here

It is centered horizontally but not vertically, and in ConstraintLayout editor pane, I just can't find a button for vertical center my text.

How to vertically & horizontally center my text in ConstraintLayout editor pane?

Upvotes: 1

Views: 721

Answers (3)

InsaneCat
InsaneCat

Reputation: 2161

Put code like this:

<TextView
    android:id="@+id/stat_1"
    android:layout_width="80dp"
    android:layout_height="wrap_content"
    android:layout_marginEnd="8dp"
    android:gravity="center"
    android:maxLines="1"
    android:text="10"
    android:textColor="#777"
    android:textSize="22sp"
    app:layout_constraintTop_toTopOf="@+id/stat_2"
    app:layout_constraintEnd_toStartOf="@+id/divider_1" />

Upvotes: 0

capt.swag
capt.swag

Reputation: 10651

What you did right there is align the text inside the TextView both horizontally and vertically.

You can check this by setting the background of TextView to some color.

Now if you want to vertically center the TextView with the parent ViewGroup which in this case is ConstraintLayout you can do

app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"

What this does is, all the sides are attached to all four sides of the parent.

Upvotes: 0

Denysole
Denysole

Reputation: 4051

Instead of textAlignment you can use gravity attribute:

android:gravity="center"

XML sources of your TextView will be like that:

<TextView
    android:id="@+id/textView"
    android:layout_width="174dp"
    android:layout_height="64dp"
    android:gravity="center"
    android:text="TextView"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

Also, you can find this attribute in Design view:

enter image description here

It will solve your problem.

Upvotes: 2

Related Questions