Develop Reference

Aligning Content in an Android ListView

I apologize for this question may have been asked somewhere, but I'm not sure how to phrase it.
I have a ListView in my Android app and I want to align the content in each row so that each TextView is aligned with corresponding TextViews in rows below it (left, right, and center).
This picture is what I'm going for listview:
So, the left TextView is aligned all the way to the left and the right TextView is aligned all the way to the right. The center TextView is aligned such that it always "begins" at the same place (ie. it's position is not affected by the length of the left TextView).
How can I achieve this? Thanks a lot

use bellow like.. I have used first textview left, second center & third is right. You can change as your wish...
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="3">
<TextView
android:id="#+id/tv_textview"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="left|center_vertical|center_horizontal"
android:text="AAP 500" />
<TextView
android:id="#+id/tv_textview2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center|center_vertical|center_horizontal"
android:text="85.65" />
<TextView
android:id="#+id/tv_textview3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="right|center_vertical|center_horizontal"
android:text="-3.75(-3.34 %)" />
</LinearLayout>

You'll want to use a LinearLayout with horizontal orientation then apply a weight to each of the textviews inside of it. this will cause them to each take a certain fraction of the layout. You can start by giving them each a weight of 1 and adjusting from there. The right-most textview will also need a right justification on the text to match the picture.

You have to create custom listView in that your item_row_view.xml will look like this
<?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:orientation="vertical">
<TextView
android:id="#+id/tv_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_weight="1"
android:text="AAP 500"
android:textAlignment="center" />
<TextView
android:id="#+id/tv_textview2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="85.65"
android:textAlignment="center" />
<TextView
android:id="#+id/tv_textview3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="-3.75(-3.34 %)"
android:textAlignment="center" />
</RelativeLayout>

How to center a TextView on the parent ImageView?

I've tried several ways of doing this and failed each time.
What I want to acomplish is centering TextView (horizontally and vertically) on ImageView, but instead command android:layout_centerInParent="true" results in vertical and horizontal centering on the whole area, not on ImageView. Please help me with attaching parent to TextView or other way of solving this.
Here is my xml code:
<ImageView
android:id="#+id/imageView1"
android:layout_width="170dp"
android:layout_height="46dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:contentDescription="Your Height BG"
android:src="#drawable/textareabg" />
<TextView
android:id="#+id/textView00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Your Height"
android:textColor="#d88b6d"
android:textSize="20sp" />

It can be easily acheived using ConstraintLayout. Android recently introduced ConstraintLayout. It allows us to lay out child views using ‘constraints’ to define position based relationships between different views found in our layout. It is similar to RelativeLayout, but much more powerful than it because, ConstraintLayout reduces View Hierarchy to a greater extent. Now getting back to your question, Here is the sample xml code which does the work for you
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<ImageView
android:id="#+id/image"
android:layout_width="200dp"
android:layout_height="200dp"
android:src="#mipmap/ic_launcher"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintVertical_bias="0.1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Image"
android:textSize="20sp"
app:layout_constraintRight_toRightOf="#+id/image"
app:layout_constraintLeft_toLeftOf="#+id/image"
app:layout_constraintTop_toTopOf="#+id/image"
app:layout_constraintBottom_toBottomOf="#+id/image"/>
</android.support.constraint.ConstraintLayout>
Output View on Device
You can position the TextView anywhere on the ImageView using app:layout_constraintHorizontal_bias and app:layout_constraintVertical_bias. By default these values will be set to 0.5. So, it will be center aligned by default , if we don't specify any values.
When you add a constraint to both sides of a view (and the view size
for the same dimension is either "fixed" or "wrap content"), the view
becomes centered between the two anchor points by default.
Note: Bias attribute only works if you specify the constraints for the boundaries (e.g. top and bottom for vertical bias, left and right for horizontal bias)
More about ConstraintLayout
ConstraintLayout
Sample Project
Blog on ConstraintLayout

Try this way,hope this will help you to solve your problem.
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageView1"
android:layout_width="170dp"
android:layout_height="46dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:contentDescription="Your Height BG"
android:src="#drawable/textareabg" />
<TextView
android:id="#+id/textView00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Your Height"
android:textColor="#d88b6d"
android:textSize="20sp" />
</FrameLayout>

Perhaps this would help you with your question
Android TextView text won't center
A person here mentions using android:gravity="center".

Here's what I would do
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="170dp"
android:layout_height="46dp"
android:layout_centerHorizontal="false"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:contentDescription="Your Height BG" />
<TextView
android:id="#+id/textView00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imageView1"
android:layout_alignTop="#+id/imageView1"
android:layout_centerHorizontal="true"
android:layout_centerInParent="true"
android:layout_centerVertical="true"
android:layout_marginLeft="30dp"
android:layout_marginTop="10dp"
android:text="Your Height"
android:textColor="#d88b6d"
android:textSize="20sp" />

What you need to do is use FrameLayout.The doc says:
FrameLayout is designed to block out an area on the screen to display a single item. Generally, FrameLayout should be used to hold a single child view, because it can be difficult to organize child views in a way that's scalable to different screen sizes without the children overlapping each other. You can, however, add multiple children to a FrameLayout and control their position within the FrameLayout by assigning gravity to each child, using the android:layout_gravity attribute.
Child views are drawn in a stack, with the most recently added child on top. The size of the FrameLayout is the size of its largest child (plus padding), visible or not (if the FrameLayout's parent permits). Views that are GONE are used for sizing only if setConsiderGoneChildrenWhenMeasuring() is set to true.
So you need something like following psuedo layout code:
<FrameLayout>
<ImageView gravity="center">
<TextView gravity="center">
</FrameLayout>

Add one more relative layout under your layout like this :
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/imageView"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Large Text"
android:id="#+id/textView"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
Check for width and height you want. Eg. If you want specific height and width for image, change height and width of this relative layout.
Thats it...

Position Of Views in Android vs iOS?

I am new to Android development. I have been working in iOS since long. As in iOS when we want to put VIEW on xib on some exact position, we simply put it there, drag it up to that point.
For example say Two buttons at lower area in iOS, which look like below
As, I simply want them in middle, I will put them their. as below
Now same thing in Android environment, I go for following code,
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/db1_root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/myAwesomeTextView"
android:layout_width="wrap_content"
android:layout_height="1dip"
android:layout_centerInParent="true"
android:text="Veer Suthar" />
<TextView
android:id="#+id/myAwesomeTextView1"
android:layout_width="wrap_content"
android:layout_height="100dip"
android:layout_below="#id/myAwesomeTextView"
android:layout_centerInParent="true" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/myAwesomeTextView1"
android:gravity="center_vertical"
android:orientation="vertical" >
<Button
android:id="#+id/button1"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center"
android:onClick="buttonPressed"
android:text="Button One" />
<Button
android:id="#+id/button2"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center"
android:onClick="buttonPressed"
android:text="Button Two" />
</LinearLayout>
</RelativeLayout>
It shows Activity Screen, like below
Now If I want to drag buttons, using GRAPHICAL LAYOUT, I can't move them as I want, and for spacing to put them into lower area, I need to put extra TextView .
Is there any better way to organise Android Activity GUI properly, like iOS?

I'll give you a brief example, since Android graphical layout is not as smooth as XCode.
To accomplish what you need, centering the two buttons in the screen, you can use a XML code like this:
<?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" >
<LinearLayout
android:id="#+id/layout_center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_centerInParent="true">
<Button
android:id="#+id/button_one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button One"/>
<Button
android:id="#+id/button_two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button Two"/>
</LinearLayout>
</RelativeLayout>
The trick is to use android:layout_centerInParent="true" for the only component that you want to be centered in the screen all other components can use that one for reference to be placed in the screen.
For example
<TextView
android:id="#+id/myAwesomeTextView1"
android:layout_width="wrap_content"
android:layout_height="100dip"
android:layout_above="#+id/layout_center"
android:text="Veer Suthar"/>
This is one way for doing this, you can always find a better and more comprehensible way to do things.
Hope this helped.

Add this to your LinearLayout:
android:layout_alignParentBottom = "true"
Childs in a RelativeLayout can be "glued" to a particular position relative to the parent layout or to other elements in the same layout using the xml tags listed here: http://developer.android.com/reference/android/widget/RelativeLayout.LayoutParams.html

How to align Button to the right, without being overlapped by TextView?

I'm trying to get something like this: http://img202.imageshack.us/img202/552/layoutoy.png. I'm using this as a list item (technically as the group view of an ExpandableListView).
Here's the XML file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight">
<TextView
android:id="#+id/list_item_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end" />
<Button
android:id="#+id/list_item_button"
android:text="Click me!"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="#id/list_item_text" />
</RelativeLayout>
But this doesn't work. The Button doesn't wrap its contents, instead it uses all available horizontal space. The TextView does wrap its contents, but what I want it to do is to cut off when it overlaps the Button.
In other words, I want all the buttons to be of the same width, regardless of the amount of text in the textviews. Is this at all possible?

I think you should try it the other way round.
Make the TextView be to the left of the button. This way the Textview won't overlap the Button. If you want it to be cut of at the end of the line you have to constrain it to one line. At the moment it would just move the rest of the text to the next line.
This should do the trick:
<Button
android:id="#+id/list_item_button"
android:text="Click me!"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"/>
<TextView
android:id="#+id/list_item_text"
android:text="veryveryveryveryveryveryveryveryveryverylong"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/list_item_button"
android:ellipsize="end" />
</RelativeLayout>

Before anyone tries the method shown above (with the RelativeLayout), you should use LinearLayout for this. The weights should be set correctly: the element that needs to take up the empty space has to have a weight of 1 and a width set to fill_parent, and the element that needs to keep its minimal size has to have a weight of 0 with a width of wrap_content.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight">
<TextView
android:id="#+id/list_item_text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight=1
android:ellipsize="end" />
<Button
android:id="#+id/list_item_button"
android:text="Click me!"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=0/>
</LinearLayout>

Android layout centering in RelativeLayout for custom ListView

I'm really pulling my hair out over this one. Some background. I have a list of items that all have checkboxes next to them. When you deselect a checkbox, a button appears that allows you to delete the item from the list. This seems backwards at first but we only want "selected" items to be eligible for further processing, etc. This is my layout:
<RelativeLayout android:id="#+id/rlBlahBlah"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:minHeight="?android:attr/listPreferredItemHeight"
xmlns:android="http://schemas.android.com/apk/res/android">
<CheckBox android:text=""
android:id="#+id/cbDeleteItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:focusable="false"
/>
<TextView android:text=""
android:id="#+id/tvItemText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14dip"
android:paddingLeft="3dip"
android:paddingRight="3dip"
android:paddingTop="13dip"
android:gravity="fill_vertical"
android:layout_toRightOf="#id/cbDeleteItem"
/>
<Button android:layout_height="wrap_content"
android:id="#+id/btnDelete"
android:text="Delete"
android:layout_width="wrap_content"
android:layout_alignParentRight="true"
android:gravity="center_vertical"
android:focusable="false"
/>
</RelativeLayout>
I cannot get the 3 items to center vertically in my row to save my life. layout_gravity, gravity, layout_centerVertical, none of it works. I'm sure my issue is some tiny setting to flip somewhere, but I'm really at wits end on this.
edit: I know the textview is "fill_vertical", that's some random stuff I was trying.

This attribute worked for me centering a Button using RelativeLayout:
android:layout_centerInParent="true"
See this posting:
Can you center a Button in RelativeLayout?

Your problem is probably not due to the layout, but how you are inflating the layout. In fact, it might even be my fault, depending on where you learned your technique...
To quote the omnipresent Romain Guy:
the correct usage of inflate() in
adapters is:
inflate(layoutId, parent, false);
Passing the parent (given to you as a
parameter in getView()) allows the UI
toolkit to create the appropriate
LayoutParams object. Passing false
tells the toolkit to NOT call
parent.addView(theInflateChild), since
ListView will do its own magic later
on.
If you use inflate(layoutId, null), as I have traditionally advised, life is OK unless you try using RelativeLayout as the base layout of the rows and try to use vertical centering.
I will be updating my books and such to reflect the new advice in the coming weeks.

Using RelativeLayout, I had no luck with gravity nor layout_gravity.
But android:layout_centerVertical="true" worked for me positioned in the child of my RelativeLayout, so you can keep it if you need.

Here is a layout that ended up doing exactly what I wanted. I ditched RelativeLayout once I learned that it ignores layout_gravity attributes (of course now I can't find the post). Either way, nested LinearLayouts did the trick for me:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:minHeight="?android:attr/listPreferredItemHeight"
android:id="#+id/llBlahBlahRowMain"
android:padding="6dip">
<CheckBox android:text=""
android:id="#+id/cbDeleteItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:focusable="false"
/>
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:layout_height="wrap_content">
<TextView
android:text="blah blah dynamically replaced text"
android:id="#+id/tvItemText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="14dip"
android:paddingLeft="3dip"
android:layout_gravity="center_vertical"
/>
</LinearLayout>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/btnDelete"
android:text="Delete"
android:layout_gravity="center_vertical"
android:focusable="false"
/>
</LinearLayout>

Have you tried android:gravity="center_horizontal" as referenced here

I did an alternative solution, that worked for me. I put, on my textbox element, the property android:layout_height="fill_parent". This way, the text element filled all hieght of parent, so the contents were aligned correctly :)
<TextView android:id="#+id/principal_li_descricao"
android:layout_height="fill_parent"
android:layout_width="wrap_content"
android:layout_marginLeft="10dip"
android:textColor="#ff000000"
android:layout_centerVertical="true"
android:gravity="center_vertical"
android:layout_alignBottom="#+id/principal_li_icone"
android:layout_toRightOf="#+id/principal_li_icone"/>
Thanks