CODEWITHSUNDEEP
androidandroid-layoutandroid-relativelayoutandroid-framelayout
Kishore Jethava
Kishore Jethava

Reputation: 6834

Overlapped Textview when text size increased + RelativeLayout

I have tried everything but not succeed yet.

What Happening. When title text is small it should come in center of parent which works perfectly, but when text size is big its overlapped to its left sided component

What i want : it shouldn't not overlap but comes to next of settings Textview. it should be adjust when size increased.

small size enter image description here

big size enter image description here

Code

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="56dp"
    android:background="@android:color/darker_gray" >


        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:text="Settings"
            android:gravity="center_vertical"
            android:layout_alignParentLeft="true"
            android:textColor="@android:color/holo_orange_dark"
            android:textSize="16.0sp" />


        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
            android:padding="4dp"
            android:gravity="center"
            android:layout_toLeftOf="@+id/txtBack"
            android:textColor="@android:color/white"
            android:textSize="19sp" />
</RelativeLayout>

Upvotes: 1

Views: 1324

Answers (6)

Omid Zamani
Omid Zamani

Reputation: 424

change second textview to this:

<TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
        android:padding="4dp"
        android:gravity="center"
        android:layout_toRightOf="@+id/firstTextview"
        android:textColor="@android:color/white"
        android:textSize="19sp" />

Upvotes: 0

BobGao
BobGao

Reputation: 790

Because you are using match_parent for those two TextViews, that is why they will being overlapped, based on your code, you can try to add a fix padding for the second TextView. For example, we consider the width of the first TextView's text "Settings" is 100dp, so we can change the code as below. 

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="56dp"
    android:background="@android:color/darker_gray" >


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:text="Settings"
        android:gravity="center_vertical"
        android:layout_alignParentLeft="true"
        android:textColor="@android:color/holo_orange_dark"
        android:textSize="16.0sp" />


    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
        android:paddingTop="4dp"
        android:paddingBottom="4dp"
        android:paddingLeft="100dp"
        android:paddingRight="100dp"            
        android:gravity="center"
        android:layout_toLeftOf="@+id/txtBack"
        android:textColor="@android:color/white"
        android:textSize="19sp" />
</RelativeLayout>

Upvotes: 1

Vickyexpert
Vickyexpert

Reputation: 3167

Just Replace Your Code By Below:

<RelativeLayout
     android:layout_width="match_parent"
     android:layout_height="56dp"
     android:background="@android:color/darker_gray" >


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:text="Settings"
        android:gravity="center_vertical"
        android:layout_alignParentLeft="true"
        android:textColor="@android:color/holo_orange_dark"
        android:textSize="16.0sp"
        android:id="@+id/txtSettings" />


    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
        android:padding="4dp"
        android:gravity="center"
        android:layout_toRightOf="@+id/txtSettings"
        android:layout_toLeftOf="@+id/txtBack"
        android:textColor="@android:color/white"
        android:textSize="19sp" />
 </RelativeLayout>

Upvotes: 0

Nirav Ranpara
Nirav Ranpara

Reputation: 13785

Use layout_toLeftOf ,alignParentLeft and alignParentRight 

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Settings"
        android:id="@+id/txtBack"
                  android:gravity="center_vertical"
        android:layout_alignParentLeft="true"
                android:layout_toLeftOf="@+id/selectaccount"
        android:textColor="@android:color/holo_orange_dark"
       android:textAppearance="?android:attr/textAppearanceMedium" />


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
        android:padding="4dp"
        android:gravity="center"
        android:layout_alignParentRight="true"

        android:textColor="@android:color/white"
        android:textAppearance="?android:attr/textAppearanceMedium" />

Upvotes: 0

PpL
PpL

Reputation: 21

Try this,

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:background="@android:color/darker_gray" >


    <TextView
        android:id="@+id/txtSetting"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:text="Settings"
        android:gravity="center_vertical"
        android:layout_alignParentLeft="true"
        android:textColor="@android:color/holo_orange_dark"
        android:textSize="16.0sp" />


    <TextView
        android:layout_toRightOf="@+id/txtSetting"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
        android:padding="4dp"
        android:gravity="center"
        android:layout_toLeftOf="@+id/txtBack"
        android:textColor="@android:color/white"
        android:textSize="19sp" />
</RelativeLayout>

Upvotes: 0

V-rund Puro-hit
V-rund Puro-hit

Reputation: 5534

set id to your first TextView and then make second TextView toRightOf first one.

Like This

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:background="@android:color/darker_gray" >


    <TextView

        android:id="@+id/textview1"

        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:text="Settings"
        android:gravity="center_vertical"
        android:layout_alignParentLeft="true"
        android:textColor="@android:color/holo_orange_dark"
        android:textSize="16.0sp" />


    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"

        android:layout_toRightOf="@id/textview1"

        android:text="hiiiiiiiiiiiii StackOverflower!!!!!!!!!!!"
        android:padding="4dp"
        android:gravity="center"
        android:layout_toLeftOf="@+id/txtBack"
        android:textColor="@android:color/white"
        android:textSize="19sp" />
</RelativeLayout>

I hope this will help.

Upvotes: 0

Related Questions