How to set ImageView and the textView in a single line inside a LinearLayout

Question

I'm struggling to set an imageView and a textView in a single line inside LinearLayout. I tried with different ways but still I couldn't find a proper solution. Here is the code I used:

<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="40dp"
    android:clickable="true"
    android:orientation="vertical"
    android:paddingLeft="40dp"
    tools:context=".MainActivity" >

    <ImageView 
        android:id="@+id/icon_image"
        android:layout_width="30sp"
        android:layout_height="30sp"
        android:layout_weight="1"
        android:adjustViewBounds="true"
        android:layout_gravity="bottom"
        android:scaleType="fitXY"
        android:src="@drawable/ic_launcher"/>

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawablePadding="5dp"
        android:layout_weight="1"
        android:gravity="center_vertical"
        android:textSize="14sp"
        android:textStyle="bold" >
    </TextView>

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="@android:color/black" />

</LinearLayout>

This is how it is appear : enter image description here

What should I have to do to make correct this?

score 1 · Accepted Answer · answered Jan 23 '14 at 02:23

1

Its inside of a LinearLayout with a vertical orientation so naturally everything is stacked "vertically". Wrap them in a LinearLayout with a horizontal orientation

<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="40dp"
android:clickable="true"
android:orientation="vertical"
android:paddingLeft="40dp"
tools:context=".MainActivity" >
<LinearLayout
    .../>
<ImageView 
    android:id="@+id/icon_image"
    android:layout_width="30sp"
    android:layout_height="30sp"
    android:layout_weight="1"
    android:adjustViewBounds="true"
    android:layout_gravity="bottom"
    android:scaleType="fitXY"
    android:src="@drawable/ic_launcher"/>

<TextView
    android:id="@+id/textView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:drawablePadding="5dp"
    android:layout_weight="1"
    android:gravity="center_vertical"
    android:textSize="14sp"
    android:textStyle="bold" >
</TextView>
</LinearLayout>
<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="@android:color/black" />

</LinearLayout>

By default, LinearLayout has a horizontal orientation so no need to supply that property in the child LinearLayout which wraps the two Views.

answered Jan 23 '14 at 02:23

codeMagic

44,549
13
77
93

Thank you for the answer. I did as you said. But still have a small problem. The text is display not in the line. It goes bit up. What should I do to correct it? – IBunny Jan 23 '14 at 02:43
Not sure because I don't know what "It goes bit up" is exactly. Maybe you want to use `android:layout_gravity="bottom"` since that is what you have for your `ImageView`. – codeMagic Jan 23 '14 at 02:48
Ah Yes I tried with android:gravity="bottom" for both. Though the image sits on the line the text is displaying up to the line. – IBunny Jan 23 '14 at 02:51
Then set `android:gravity="bottom"` in your `TextView` – codeMagic Jan 23 '14 at 02:58
I already did that as my previous comment :). still same problem is remaining. :( – IBunny Jan 23 '14 at 03:01
Yes, sorry, the first time you were suppose to have `android:layout_gravity="bottom"`. There's a difference between `layout_gravity` and `gravity` ;) – codeMagic Jan 23 '14 at 03:02
let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/45850/discussion-between-ibunny-and-codemagic) – IBunny Jan 23 '14 at 03:03
Ah! I see, Yeh after add android:layout_gravity="bottom" to TextView instead android:gravity="bottom" it works well :) Thanks again for the suppor !! – IBunny Jan 23 '14 at 03:14

score 1 · Answer 2 · answered Jan 24 '14 at 10:02

1

Use android:layout_gravity="center_vertical" for your textview

answered Jan 24 '14 at 10:02

anjaneya

708
9
11

score 0 · Answer 3 · answered Jan 23 '14 at 02:24

0

I suggest to use a RelativeLayout. That way you can add more items vertically as well.

answered Jan 23 '14 at 02:24

android_dev_

412
2
6

Thanks for the suggestion but it is not possible to change the layout. I need to use LinearLayout for the rest of my code. – IBunny Jan 23 '14 at 02:41

score 0 · Answer 4 · answered Jan 23 '14 at 02:24

0

You need to change the linearylayout's orientation. Just change android:orientation="vertical"

to

android:orientation="horizontal"

answered Jan 23 '14 at 02:24

ytll21

850
6
12

Thanks for the answer. But just changing the current orientation to horizontal does not work. – IBunny Jan 23 '14 at 02:40

score 0 · Answer 5 · answered Jan 23 '14 at 02:52

You can try enclosing your ImageViews and TextViews inside a TableLayout

<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="40dp"
android:clickable="true"
android:orientation="vertical"
android:paddingLeft="40dp"
tools:context=".MainActivity" >

<TableLayout 
android:layout_width="fill_parent"
android:layout_height="wrap_content">

<TableRow>

<ImageView 
    android:id="@+id/icon_image"
    android:layout_width="30sp"
    android:layout_height="30sp"
    android:layout_weight="1"
    android:adjustViewBounds="true"
    android:layout_gravity="bottom"
    android:scaleType="fitXY"
    android:src="@drawable/ic_launcher"/>

<TextView
    android:id="@+id/textView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:drawablePadding="5dp"
    android:layout_weight="1"
    android:gravity="center_vertical"
    android:textSize="14sp"
    android:textStyle="bold" />
</TableRow>
</TableLayout>
<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="@android:color/black" />

Thank you for the support. But I need to use for the rest of the code. :) — IBunny, Jan 23 '14 at 02:59
The TableLayout would be considered a layout within a layout. If it helps, you could add android:layout_gravity="center_vertical" into the TextView to get it to center — Alex, Jan 23 '14 at 03:04

How to set ImageView and the textView in a single line inside a LinearLayout

5 Answers5

Linked