how to align an element to right in horizontal LinearLayout?

MRefaat picture MRefaat · Dec 22, 2013 · Viewed 28k times · Source

I have a LinearLayout that contains a lot of TextViews and ImageButtons, I want to align some of these elements to right, i had a look at this and this but i can't use their tips as i can't change the orientation and can't make android.gravity:right as i don't want to align all the elements to right, also i can't use nested layouts or but the desired elements into RelativeLayout because that shifts the rest of elements to the left and i want them at the center.

this is my code:

 <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_weight="0.15"
            android:layout_marginTop="10dp"
            android:layout_gravity="center"
            android:gravity="center"
            android:background="@drawable/media_mediabar"
            android:orientation="horizontal" >

            <ImageButton
                android:id="@+id/move_backward"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:adjustViewBounds="true"
                android:background="@android:color/transparent"
                android:clickable="true"
                android:scaleType="centerInside"
                android:src="@drawable/media_button_rewind"
                android:layout_marginLeft="7dp"
                android:layout_marginRight="7dp"
                android:tag="released"/>

           <ImageButton
                android:id="@+id/rmeote_mines"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:adjustViewBounds="true"
                android:background="@android:color/transparent"
                android:clickable="true"
                android:scaleType="centerInside"
                android:src="@drawable/remote_minus" />


          <TextView 
                android:id="@+id/remote_plus_minus"
                android:text="0"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@android:color/white"
                android:layout_gravity="center"
                android:layout_marginTop="15dp"
                android:layout_marginBottom="15dp" />
            .
            .
            .<!.. some other elements ..!>
        </LinearLayout>

The desired result:

enter image description here

Answer

GareginSargsyan picture GareginSargsyan · Dec 22, 2013

The simplest solution would be using empty views with weights as separators.

<LinearLayout android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:orientation="horizontal">
    <!-- Left button -->
    <Button ...
            ... />
    <View android:layout_width="0dp"
          android:layout_height="match_parent"
          android:layout_weight="1" />
    <!-- Middle button -->
    <Button ...
            ... />
    <View android:layout_width="0dp"
          android:layout_height="match_parent"
          android:layout_weight="1" />
    <!-- Right button -->
    <Button ...
            ... />
</LinearLayout>

The separator views can be made invisible as an optimization, because they don't draw anything and are used only for layout. You can tweak the actual 'layout_weight' values to get the desired layout. Starting from API level 14 you can use instances of Space as separators which will improve performance and readability (there is also a version of Space in the support library).