Develop Reference

Align two textviews so that the right one resizes until max and the left one fits in

I need a table-like view in Android which I can fill with custom name-value rows. A row consists of two horizontally-placed text views which hold the name and the value. Every row should have the following properties:
The left text view is aligned to parent-left, and the right one is aligned to parent-right.
The right text never becomes longer than 7 ems, but can be smaller.
The left text should fill up the remaining space in the row.
Obviously, the two text views should never overlap.
Currently I'm trying to solve this with a LinearLayout as the container and two TextViews wrapped in a RelativeLayout, but something's clearly out of place here (the underlined bit is clearly longer than 7 ems):
My XMLs:
The row layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="4dp"
android:paddingTop="4dp">
<TextView
android:id="#+id/tb2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:ellipsize="end"
android:maxEms="7"
android:maxLines="2" />
<TextView
android:id="#+id/tb1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:ellipsize="end"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_toLeftOf="#id/tb2"
android:layout_toStartOf="#id/tb2" />
</RelativeLayout>
The container layout into which the rows are added programatically:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ll"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:padding="16dp"/>
I'm using this layout as part of a dialog. Not sure if it adds anything to the problem or not.
Any ideas/solutions?

You don't need to do anything special, just use LinearLayout instead of RelativeLayout with layout_weight:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal"
android:paddingBottom="4dp"
android:paddingTop="4dp">
<TextView
android:id="#+id/tb2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxEms="7"
android:maxLines="2" />
<TextView
android:id="#+id/tb1"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:ellipsize="end" />
</LinearLayout>
Maybe some margin on the left of the right text would be good too.

it will work as per your requirements you can adjust weights
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="4dp"
android:paddingTop="4dp"
android:orientation="horizontal">
<TextView
android:id="#+id/tb1"
android:layout_width="0dip"
android:layout_weight="2.5"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:ellipsize="end"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_toLeftOf="#id/tb2"
android:text="nameeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee"
android:layout_toStartOf="#id/tb2" />
<TextView
android:id="#+id/tb2"
android:layout_width="0dip"
android:layout_weight="0.5"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:ellipsize="end"
android:maxEms="7"
android:maxLines="2"
android:text="valuessss"/>
</LinearLayout>

All the above answer are correct but you have to understand RelativeLayout align components relative to each other e.g (left,right,top,bottom) to achieved require result you have to limit second component width, there is one issue your second component will alway have fixed width even first component is empty.
LinearLayout align component the way they are presented in xml mean linearly one next to other. the weight attribute tell the layout how much space component should occupy on the screen.A larger weight value allows it to expand to fill any remaining space in the parent view.

Android textview not fit for all the screen

i developed one of application and now am facing problem that it show perfectly in my nexus7 but when i viewing other device screens the text view not fitting
i want all the screen as same as nexus7. its anyone can know the better solution for this please. unfortunately i don't have enough reputation so i cant post any screenshot here this my xml code
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:background="#color/white">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:paddingBottom="16dp"
android:paddingLeft="64dp"
android:paddingRight="64dp"
android:paddingTop="16dp" >
<ImageView
android:id="#+id/pointer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_centerInParent="true"
android:src="#drawable/point" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
android:paddingBottom="16dp"
android:paddingLeft="64dp"
android:paddingRight="64dp"
android:paddingTop="16dp" >
<TextView
android:id="#+id/name2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="97dp"
android:text="#string/numberusers"
android:textColor="#color/no_users"
android:textSize="30sp"
android:textStyle="bold" />
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="19dp"
android:text="#string/number"
android:textColor="#color/no_users"
android:textSize="30sp"
android:textStyle="bold" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:paddingBottom="16dp"
android:paddingLeft="64dp"
android:paddingRight="64dp"
android:paddingTop="355dp" >
<ListView
android:id="#android:id/list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_gravity="center_horizontal"
android:clickable="false" >
</ListView>
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>

I m Not Sure But Remove Relative Layout And Use Linear Layout Its More Better Than Relative

The two textViews that you have in your layout use android:layout_width="wrap_content".
Use android:layout_width="match_parent" in the one you want to fill the screen.

every children relative layout in your xml has height and width as match_parent. Do you need it? Because if first layout have height as match_arent than it will not leave space for others. Try using "wrap_content" as height for inner relative layouts.

If I got your question, you have to set the width of the textview as
android:layout_width="match_parent"
But in my opinion, the hole screen is wrong. Use a LinearLayout (vertical or horizontal) and place there your first two textviews. And if you want more accuracy use the gravity feature in each text view and of course set a layout_weight for each TextView and weightSum in the LinearLayout.

How to to center TextView to be always in center of Layout?

I need to create navigation bar (which I include in many activities.xml) with background which has TextView at center with titlw and back button (sometimes Back button is visible sometimes is not). How to to center TextView to be always in center of Layout ? At the moment when Back is visible TextView is moved slightly to right.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:background="#drawable/header_background"
android:gravity="center_vertical"
android:orientation="horizontal" >
<Button
android:id="#+id/btnPrevious"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/selector_previous_arrow"
android:visibility="gone" />
<TextView
android:id="#+id/title"
style="#style/title"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical|center_horizontal"
android:gravity="center_vertical|center_horizontal"
android:text="Title" />
</LinearLayout>

A RelativeLayout will suit your needs better:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/header_background" >
<Button
android:id="#+id/btnPrevious"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:paddingLeft="5dp"
android:background="#drawable/selector_previous_arrow"
android:visibility="gone" />
<TextView
android:id="#+id/title"
style="#style/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Title" />
</RelativeLayout>
Attribute layout_centerInParent will only work if the width and height are set to wrap_content. Alternatively, you can set the height and width to fill_parent and set the TextView's android:gravity="center".
Why your original layout was not working:
A LinearLayout does not allow overlapping of views. So, even though you set the TextView's height and width to fill_parent, it actually only fills up the space leftover after placing the back button. So, when the button is not visible, TextView is centered. When the button is visible, TextView is centered in the remainder of space: thus shifted a bit to the right.
Edit: Correction made (replaced android:layout_alignLeft="true" with android:layout_alignParentLeft="true")

<TextView
android:id="#+id/title"
style="#style/title"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:text="Title" />

Difficulty with ScrollView and LinearLayout

I'm trying to make an Android layout: 3 components inside a vertical LinearLayout. The center component is a ScrollView that contains a TextView. When the TextView contains a significant amount of text (more than can fit on the screen), the ScrollView grows all the way to the bottom of the screen, shows scrollbars, and pushes the last component, a LinearLayout with a Button inside, off the screen.
If the text inside the TextView inside the ScrollView is short enough, the button at the bottom of the screen is positioned perfectly.
The layout I'm trying to achieve is:
The XML for the layout I've written is:
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:layout_marginLeft="10dip"
android:layout_marginRight="10dip"
android:layout_marginTop="10dip"
android:layout_marginBottom="10dip"
android:text="Title />
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autoLink="web"
android:textColor="#FFFFFF"
android:background="#444444"
android:padding="10dip" />
</ScrollView>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<Button android:id="#+id/login_button"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_weight="1"
android:text="#string/next_button"/>
</LinearLayout>
</LinearLayout>

The scrollview is the second view object and is set to wrap_content, which is more than the screen.
I recommend a RelativeLayout. Top textview first with android:alignParentTop="true", the bottom LinearLayout next with android:alignParentBottom="true" and the scrollview listed last in the xml with the value android:alignBelow="#id/whatYouCallTheHeader.
This will align the bottom bar at the bottom of the screen, and the header at the top, no matter the size. Then the scrollview will have its own place, after the header and footer have been placed.

you should go for relativeLayout rather than LinearLayout. And you can use some properties like alignBelow and all.

Try adding a layout weight into the ScrollView ie.
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
This worked for me in a situation almost identical to the one you're presenting but left me wondering why, because it is counter-intuitive that increasing the layout weight of a control from 0 (the default if you don't specify a layout_weight) to 1 should make a control which is already using too much space smaller.
I suspect the reason it works is that by not specifying a layout_weight you actually allow the layout to ignore the size of the scroll view relative to other controls and conversely if do specify one you give it permission to shrink it in proportion to the weights you assign.

![Fixed Header-Footer and scrollable Body layout ][1]
This is what you are looking for . Most of the app in android had this type of layout ,
a fixed header and footer and a scrollable body . The xml for this layout is
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:background="#5599DD"
android:layout_height="fill_parent">
<!-- Header goes here -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:layout_marginLeft="10dip"
android:layout_marginRight="10dip"
android:layout_marginTop="10dip"
android:layout_marginBottom="10dip"
android:textSize="20sp"
android:layout_gravity="center"
android:text="Title" />
<!-- Body goes here -->
<ScrollView
android:layout_weight="1"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autoLink="web"
android:text="#string/lorem_ipsum"
android:textColor="#FFFFFF"
android:padding="10dip" />
</ScrollView>
<!-- footer goes here -->
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Button
android:id="#+id/login_button"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="bottom"
android:layout_alignParentRight="true"
android:text="Button"/>
</RelativeLayout>
</LinearLayout>
</LinearLayout>

How to resize the pictures right?

Hy!
I have two pictures on the view and a button at the buttom.
XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" android:layout_width="fill_parent" android:orientation="vertical">
<TextView android:layout_height="wrap_content" android:id="#+id/mainscreen" android:layout_width="fill_parent" android:text="Selected Channel" android:gravity="center" android:layout_alignParentTop="true"></TextView>
<ImageView android:id="#+id/ImageView01" android:layout_width="wrap_content" android:layout_height="wrap_content"></ImageView>
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="#+id/mainscreen_state" android:layout_above="#+id/mainscreen_btchange"></TextView>
<ImageView android:layout_width="wrap_content" android:layout_centerHorizontal="true" android:layout_height="wrap_content" android:id="#+id/ImageAd" android:layout_gravity="center" android:layout_below="#+id/mainscreen"></ImageView> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent">
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:id="#+id/mainscreen_btchange"
android:text="Change State"></Button>
</RelativeLayout>
</LinearLayout>
My Question: How to shrink the pictures that all elements of the layout are shown?

For more complicated layouts where I need to ensure a bunch of items can all be displayed, I usually start with a RelativeLayout as my outermost container. I dock whatever needs to be at the extremities with layout_alignParentTop and layout_alignParentBottom (in the case of vertical layouts, which yours seems to be), and then I work my in making the next set of elements relative to them. Basically, start at the edges and work your way in.
So, in your case, the Button should have the attribute android:layout_alignParentBottom="true", and the TV should have android:layout_above="#+id/mainscreen_btchange". The TextView at the top should have android:layout_alignParentTop="true" and the ImageView underneath it should have android:layout_below="#+id/mainscreen"