Develop Reference

Android: Right-Aligning ImageView in LinearLayout

The imageView is not getting right-aligned in this linearlayout (If it matters this LinearLayout is actually a row in a list).
But if i use a TextView (its commented in code below) instead of ImageView, it successfully gets right-aligned.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:background="#FFFFAA"
android:orientation="horizontal" >
<TextView
android:id="#+id/txtTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title"
android:textAppearance="?android:attr/textAppearanceMedium" />
<!--
<TextView
android:id="#+id/labelNext"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="right"
android:text="> "
android:textSize="20sp"
android:textStyle="bold">
</TextView>
-->
<ImageView
android:id="#+id/iconNext"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_gravity="right"
android:layout_weight="1"
android:gravity="right"
android:src="#drawable/right_arrow" >
</ImageView>
</LinearLayout>
How do i get the imageView to the right-most edge of the LinearLayout row?

Use a RelativeLayout instead of LinearLayout because LinearLayout does not support it.
Use like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:background="#FFFFAA" >
<TextView
android:id="#+id/txtTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title"
android:textAppearance="?android:attr/textAppearanceMedium" />
<ImageView
android:id="#+id/iconNext"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_gravity="right"
android:layout_weight="1"
android:layout_alignParentRight="true"
android:src="#drawable/right_arrow" >
</ImageView>
</RelativeLayout>

Or you can add empty view between your imageView and textView that fill empty space between them and your second textview will be "pushed" to right side:
<View
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_weight="1"/>
Setting width to 0 and weight to 1 causes this view to fill whole available space, that is not used by other views. So it's size will be
width = (screenWidth-(imageView width+textView width))

If you only need a TextView with image on the right consider using a android:drawableRight parameter. Both LinearLayout with weights and RelativeLayout run measurement twice so leaving just TextView will be computationally faster.
<TextView
android:id="#+id/txtTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:drawableRight="#drawable/right_arrow" />
(Also please note that the arrow in ListView is against Android design guidelines)

Aligning buttons+images+text in a row (android)

I'm trying to align 3 buttons in a row in the center of the screen. Each button will have a background color, an image, and some text under the image. I've tried using LinearLayout but I can't put the image over the button. I've tried RelativeLayout, and I managed to get them in a row, but they are not in the center of the screen. Any advices?
<Button
android:id="#+id/start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="85dp"
android:paddingBottom="10dp"
android:paddingLeft="25dp"
android:paddingRight="25dp"
android:background="#drawable/light"
android:text="#string/start"
android:textColor="#color/text"
android:textSize="8pt"
android:textStyle="bold"
android:layout_marginTop="0dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_alignParentTop="true" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/image"
android:src="#drawable/hstart"
android:layout_alignLeft="#+id/start"
android:layout_alignStart="#+id/start"
android:layout_alignRight="#+id/start"
android:layout_alignEnd="#+id/start"
android:layout_marginRight="20dp"
android:layout_marginLeft="20dp"
android:layout_marginTop="0dp" />

Here is your Button view (your_btn_view.xml in the layout folder):
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:clickable="true"
android:background="#android:drawable/btn_default"
android:gravity="center" >
<ImageView
android:id="#+id/btn_iv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_add" />
<TextView
android:id="#+id/btn_tv"
android:text="text"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
Here is your layout view containing three buttons:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal" >
<include
android:id="#+id/btn1"
layout="#layout/your_btn_view" />
<include
android:id="#+id/btn2"
layout="#layout/your_btn_view" />
<include
android:id="#+id/btn3"
layout="#layout/your_btn_view" />
</LinearLayout>
Then, access and fill in the appropriate TextView and ImageView in your onCreate() like so:
#Override
public void onCreate(Bundle sIS){
super.onCreate(sIS);
setContentView(R.layout.that_layout_above, this, false);
LinearLayout btn1 = (LinearLayout)findViewById(R.id.btn1);
((TextView)btn1.findViewById(R.id.btn_tv)).setText("my text");
...

Use a LinearLayout to hold a RelativeLayout for each button/image combination. "Nested" layouts is pretty common to get this type of visual effect.

Android. Layout item move to right side

I have android layout with three parts (imageview, textview, imageview) and I want the last part move to right side, now its near the second element.
My code:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/menu_button_bg"
android:orientation="horizontal"
android:paddingLeft="13dp" >
<ImageView
android:id="#+id/menuItemIcon"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginBottom="13dp"
android:layout_marginRight="13dp"
android:layout_marginTop="13dp"
android:contentDescription="#string/menuItemDesc"
android:gravity="center_vertical" />
<TextView
android:id="#+id/menuItemTitle"
android:layout_width="wrap_content"
android:layout_height="70dp"
android:gravity="center_vertical"
android:textSize="16sp" >
</TextView>
<ImageView
android:id="#+id/menuItemIconRight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="13dp"
android:layout_marginRight="13dp"
android:layout_marginTop="13dp"
android:layout_weight="0.1"
android:contentDescription="#string/menuItemDesc"
android:gravity="right" />
</LinearLayout>

You can give the TextView the following attributes:
android:layout_width="0dp"
android:layout_weight="1"
This will make the TextView stretch to use up the space between the two ImageViews. The other alternative is to use a RelativeLayout instead of a LinearLayout, but this should work for your needs.

Aligning in Relatively Layouts

I have this layout inside of a RelativeLayout:
<LinearLayout
android:id="#+id/llWatchItemCommentButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/myMasterCat_Item"
style="#style/DropShadowEffect"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="99"
android:shadowColor="#ffffff"
android:text="Item"
android:textColor="#515b61"
android:textSize="22sp" />
<ImageView
android:id="#+id/bFollowComment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/featured_button_selector"
android:padding="5dp"
android:src="#drawable/comment" />
</LinearLayout>
<TextView
android:id="#+id/myMastCat_Cat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/llWatchItemCommentButton"
android:layout_alignLeft="#+id/llWatchItemCommentButton"
android:layout_marginLeft="10dp"
android:text="MasterCat"
android:textColor="#666"
android:textSize="16sp" />
Essentially, if that TextView in the Layout becomes two lines, it will overlap with the TextView positioned below theLinearLayout`.
Is there an attribute perhaps that could correct this? As in, I want the bottom TextView to be below the entire LinearLayout at all times, even if it begins to grow. Right now, the position appears fixed.

Have you tried the following:
<TextView
android:id="#+id/myMastCat_Cat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/llWatchItemCommentButton" //add this line in
android:layout_alignBottom="#+id/llWatchItemCommentButton"
android:layout_alignLeft="#+id/llWatchItemCommentButton"
android:layout_marginLeft="10dp"
android:text="MasterCat"
android:textColor="#666"
android:textSize="16sp" />

android - align a textview to the center of another view

i have some imagebuttons and each one has a corresponding textview, i'd like to align those textview's to the center of their corresponding imageview, i mean, like is seen on the app drawer...
!-----!
!icon !
!_____!
app name
this is my code, i'm using a RelativeLayout
<ImageButton
android:id="#+id/blog_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/logo_img"
android:layout_marginLeft="50dp"
android:layout_marginTop="51dp"
android:background="#null"
android:contentDescription="#string/blog_desc"
android:src="#drawable/blog" />
<TextView
android:id="#+id/blog_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/blog_button"
android:layout_below="#+id/blog_button"
android:layout_marginTop="8dp"
android:text="#string/blog_desc" />

Wrap that in a LinearLayout and center the children, like so:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/logo_img"
android:gravity="center_horizontal"
android:orientation="vertical">
<ImageButton
android:id="#+id/blog_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:contentDescription="#string/blog_desc"
android:src="#drawable/blog" />
<TextView
android:id="#+id/blog_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="#string/blog_desc" />
</LinearLayout>

Old post but if this can help I think it's not necessary to add an additional container.
<ImageButton
android:id="#+id/blog_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/logo_img"
android:layout_marginLeft="50dp"
android:layout_marginTop="51dp"
android:background="#null"
android:contentDescription="#string/blog_desc"
android:src="#drawable/blog" />
<TextView
android:id="#+id/blog_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/blog_button"
android:layout_alignRight="#+id/blog_button"
android:layout_below="#+id/blog_button"
android:gravity="center_horizontal"
android:layout_marginTop="8dp"
android:layout_marginLeft="-20dp"
android:layout_marginRight="-20dp"
android:text="#string/blog_desc" />
It's work for me.

If a the TextView can be transparent then this can be achieved with a single View
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Test string"
android:drawableTop="#android:drawable/btn_star"
android:background="#android:color/transparent"
android:textSize="10sp"
/>

If your views in RelativeLayout follow these steps:
1- wrap your view that wants to be aligned in the center of target view in Framelayout.
2- move all layout attributes to FrameLayout.
3- set layout_align_top and layout_align_bottom (or start and end if horizontal) to target view.
4- set layout_gravity to center_vertical (or horizontal) to child of Frame layout
Result:
<RelativeLayout
android:id="#+id/yourView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0">
<RatingBar
android:id="#+id/masseur_rating_bar"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:isIndicator="true"
android:progressDrawable="#drawable/ic_selector_rating_bar"
android:rating="#{masseurItem.rate}"
android:scaleX="0.8"
android:scaleY="0.8"
tools:rating="4.5" />
<TextView
android:id="#+id/rate_text_view"
style="#style/BodyTextViewStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toEndOf="#id/masseur_rating_bar"
android:text="#{String.valueOf(masseurItem.rate)}"
android:textSize="12sp"
tools:text="4.5" />
</RelativeLayout>