Question 181595 in Android Studio Question posted in
The official documentation can be found here.

Android Studio – How to center a textView ui element?

I want to put the textView with the text in the center horizontal.
and when I added the line:

textView.gravity = Gravity.CENTER_HORIZONTAL

I didn’t see the text "Milliseconds"

but even with this line the text and the numbers are too much to the right of the screen.

@RequiresApi(Build.VERSION_CODES.O)
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val textView = findViewById<TextView>(R.id.textView)
        val seek = findViewById<SeekBar>(R.id.seekBar)
        seek.min = 100
        seek.max = 1000
        seek.progress = 500
        counter = seek.progress.toFloat()

        seek.setOnSeekBarChangeListener(
            object : SeekBar.OnSeekBarChangeListener {
                override fun onProgressChanged(
                    seekBar: SeekBar?,
                    progress: Int,
                    fromUser: Boolean
                ) {
                    // Log.d("seekbar", "Your Progress: ${seekBar?.progress}"

                    counter = seek.progress.toFloat()
                    if(progress < 1000) {
                        textView.text = "Milliseconds: " + counter.toString()
                    }
                    else {
                        textView.text = "Milliseconds" + 1.toString()
                    }
                }

                override fun onStartTrackingTouch(seekBar: SeekBar?) = Unit
                override fun onStopTrackingTouch(seekBar: SeekBar?) = Unit
            },
        )

This is the activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="192dp"
        android:layout_marginTop="100dp"
        android:text="@string/_50"
        android:textColor="@android:color/holo_green_dark"
        android:textSize="24sp"
        android:textStyle="bold"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <SeekBar
        android:id="@+id/seekBar"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="284dp"
        android:max="1000"
        android:progress="500"
        android:progressDrawable="@drawable/custom_seekbar"
        android:thumb="@drawable/custom_thumb"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

but it’s still on the right too much to the right: here is a screenshot:

screenshot

I tried :

textView.gravity = Gravity.CENTER_HORIZONTAL

but it didn’t change anything.

Update:

I tried this. and it’s more or less in the center but is there a way to set the marginStart to be automatic in the center depending on the length of the text? because I’m adding "Milliseconds" so it looks like for example: Milliseconds: 676

<TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:layout_marginStart="80dp"
        android:layout_marginTop="100dp"
        android:text="@string/_50"
        android:textColor="@android:color/holo_green_dark"
        android:textSize="24sp"
        android:textStyle="bold"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
Tags:

2

Answers


  1. 0

    remove the margins and add an endConstraint to the textview

       app:layout_constraintEnd_toEndOf="parent"
    Login or Signup to reply.
  2. 0

    You have two options:

    • make the view match the parent’s width, and centre its contents (the text) inside that internal space
    • make the width wrap_content (so the view is exactly the same size as the text you’re displaying) and then centre the view in its parent

    For the first one, make the width MATCH_PARENT or, if you’re using ConstraintLayout, constrain the start and end to the start and end of parent, and make the width 0dp so it fills the space. Then set the gravity to CENTER_HORIZONTAL or whatever. (The reason your version isn’t working is because the width is wrap_content, so there’s no extra space to "centre" the contents in.)

    For the second approach, make your view’s width wrap_content, and then do whatever the parent layout requires to position it in the centre. For ConstraintLayout, just pin the start and end to those of the parent, like before. For something like a LinearLayout you can use layout_gravity (which is different from gravity – it tells the parent layout how to position the view itself within that layout).

    Don’t use those margins on one side – you’re trying to "push" the view into the centre and it’s only complicating things! That would depend on the size of the screen, the orientation, the length of the text, the size of the text, the user’s selected text scale in the system settings… it’s not the way to centre stuff.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search