CODEWITHSUNDEEP
androidandroid-layoutandroid-linearlayout
Joshy Francis
Joshy Francis

Reputation: 349

Creating two columns in a linearlayout with a gap in the middle

How can I create a layout with two columns, with one textview on the left side and the other on the right side and gap in the middle?. I have already seen the answer here Android: creating two columns in a linearlayout. But I need a certain space between the two columns. Please somebody help.

Upvotes: 0

Views: 348

Answers (5)

mrvinent
mrvinent

Reputation: 125

I would put some margin on each column so you can control the space in between. For me is the easiest way to do it.

<LinearLayout android:id="@+id/linearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    xmlns:android="http://schemas.android.com/apk/res/android">

<LinearLayout android:id="@+id/linearLayout2"
    android:layout_width="0dp"
    android:layout_weight="1"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:layout_gravity="left"
        xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_marginEnd="25dp">
    <TextView
        android:id="@+id/textView1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Street"
        android:background="#88FF0000"/>
</LinearLayout>

<LinearLayout android:id="@+id/linearLayout3"
    android:layout_width="0dp"
    android:layout_weight="1"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_marginStart="25dp">
    <TextView
        android:id="@+id/textView2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="456546546"
        android:layout_gravity="right"
        android:background="#8800FF00"/>
</LinearLayout>
</LinearLayout>

Upvotes: 0

Tung Tran
Tung Tran

Reputation: 2955

You can add a View at the center:

<LinearLayout
    android:layout_margin="30dp"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <EditText
        android:layout_weight="1"
        android:background="@color/colorPrimary"
        android:layout_width="0dp"
        android:layout_height="wrap_content" />
    <View
        android:layout_width="8dp"
        android:background="@android:color/white"
        android:layout_height="match_parent" >
    </View>
    <EditText
        android:layout_weight="1"
        android:background="@color/colorPrimary"
        android:layout_width="0dp"
        android:layout_height="wrap_content" />
</LinearLayout>

Upvotes: 1

AskNilesh
AskNilesh

Reputation: 69754

Creating two columns in a linearlayout with a gap in the middle

You can use View for gap between two LinearLayout

Try this

<LinearLayout
    android:id="@+id/linearLayout2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <LinearLayout
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:background="#88FF0000">
        <TextView
            android:layout_width="match_parent"
            android:text="Nilesh"
            android:layout_height="wrap_content" />

    </LinearLayout>

    <View
        android:layout_width="10dp"
        android:background="@color/colorPrimary"
        android:layout_height="match_parent"/>
    <LinearLayout
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:background="#88FF0000">

        <TextView
            android:layout_width="match_parent"
            android:text="Nilesh"
            android:layout_height="wrap_content" />

    </LinearLayout>

</LinearLayout>

OUTPUT

enter image description here

Upvotes: 1

Bruno
Bruno

Reputation: 4007

Using the answer you're pointing, you have to add a view in the middle, with 0dp in width but with a weight of 0.1, 0.2, whatever, depending on your gap.

Upvotes: 2

jujka
jujka

Reputation: 1217

If I understood correctly, you want to have two columns of identical width with a space in-between them. Is so:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <!-- First column -->

    <LinearLayout
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="1">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="My Column 1 Text"/>

    </LinearLayout>

    <!-- Space in-between -->

    <Space
        android:layout_width="25dp"
        android:layout_height="match_parent" />

    <!-- Second column-->

    <LinearLayout
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="1">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            android:text="My Column 2 Text"/>

    </LinearLayout>

</LinearLayout>

Upvotes: 1

Related Questions