byteC0de byteC0de - 2 months ago 22
Android Question

How to align 2 images left and right inside LinearLayout in android

I want to show two images by side by side below of google map.Image showing is working. But the image showing the same side. I want to show some text middle of the 2 two images.

enter image description here

The 2nd image I want to show in right side of the view, and the text in middle.

Current code

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<fragment
android:id="@+id/map"
class="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="@color/bt_white">

<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginStart="5dp"
android:src="@drawable/ic_menu_camera"/>

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/black"
android:text="@string/action_settings"/>
</LinearLayout>

<ImageView
android:id="@+id/imageView12"
android:layout_width="80dp"
android:layout_height="80dp"
android:gravity="right"
android:src="@drawable/ic_menu_camera" />

</LinearLayout>


</LinearLayout>

Answer Source

Here is your layout

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<fragment
    android:id="@+id/map"
    class="com.google.android.gms.maps.SupportMapFragment"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1" />

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/bt_white"
    android:orientation="horizontal"
    android:weightSum="3">

    <ImageView
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_alignParentLeft="true"
        android:layout_marginStart="5dp"
        android:src="@android:drawable/ic_menu_camera" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:orientation="vertical">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="First Text View"
            android:textColor="@color/black" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="Second Text view"
            android:textColor="@color/black" />
    </LinearLayout>

    <ImageView
        android:id="@+id/imageView12"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_alignParentRight="true"
        android:src="@android:drawable/ic_menu_camera" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>

Here is how it looks

enter image description here