CODEWITHSUNDEEP
androidandroid-studioandroid-layoutandroid-relativelayout
Quessts
Quessts

Reputation: 440

How can I have 2 textviews on the same line and at opposite ends of the screen at the same time

I'm currently working on an app to display two text views at opposite ends of the screen.

This is the expected output: expected output

This does work on some devices but on others it creates a new line and messes things up entirely or just removes the 22 entirely like this: unexpected output

This is the xml code:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="start">

    <TextView
        android:textSize="13sp"
        android:textColor="@color/black"
        android:gravity="start"
        android:layout_marginStart="10dp"
        android:layout_marginTop="10dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="James Lingard" />

    <TextView
        android:textSize="13sp"
        android:textColor="@color/black"
        android:gravity="start"
        android:layout_marginStart="410dp"
        android:layout_marginTop="10dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="22" />
</RelativeLayout>

The name on the left is great but the number on the right keeps getting messed up. I assume it has something to with android:layout_marginStart="410dp" but I'm not sure how else I can get the 22 to be on the right and on the same line as the name.

Upvotes: 0

Views: 625

Answers (3)

Kakyire
Kakyire

Reputation: 122

You can do it using ConstraintLayout

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="10dp"
        android:layout_marginTop="10dp"
        android:text="James Lingard"
        android:textColor="@color/black"
        android:textSize="13sp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="10dp"
        android:text="22"
        android:textColor="@color/black"
        android:textSize="13sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Results

Display two text

Upvotes: 0

Tudor Deviza
Tudor Deviza

Reputation: 39

Try this, with RelativeLayout

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<TextView
    android:textSize="13sp"
    android:textColor="@color/black"
    android:layout_marginStart="10dp"
    android:layout_marginTop="10dp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="James Lingard" />

<TextView
    android:textSize="13sp"
    android:textColor="@color/black"
    android:gravity="start"
    android:layout_alignParentEnd="true" 
    android:layout_marginTop="10dp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="22" />

or I recomanded(is most adaptable) (P.S. Sorry for my english)

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<TextView
    android:textSize="13sp"
    android:textColor="@color/black"
    android:layout_marginStart="10dp"
    android:layout_marginTop="10dp"
    android:layout_weight="4"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="James Lingard" />

<TextView
    android:textSize="13sp"
    android:textColor="@color/black"
    android:layout_alignParentEnd="true" 
    android:layout_marginTop="10dp"
    android:layout_weight="1"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="22" />

Upvotes: 1

Anatolii Chub
Anatolii Chub

Reputation: 1300

Yes, you're right the problem is : android:layout_marginStart="410dp".
I can suppose that on some devices the device screen width less than 410dp. As I can see you're using RelativeLayout, just add the attribute: android:layout_alignParentEnd="true" inside your 2nd TextView.

And, of course, remove this line: android:layout_marginStart="410dp"

Upvotes: 1

Related Questions