Align ImageView and TextView in a Linear Layout

Question

I try to align my ImageView and my TextView but the imageView is higher than my textview.

Xml :

           <RelativeLayout
            android:layout_marginTop="8dp"
            android:id="@+id/secondRelative"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/firstRelative"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/imageNote"
                android:layout_width="15dp"
                android:layout_height="15dp"
                android:src="@drawable/rank"
                android:layout_marginEnd="2dp"
                />
            <TextView
                android:id="@+id/note"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textAlignment="center"
                android:text="Test"
                android:layout_alignBaseline="@id/imageNote"
                />

        </RelativeLayout>

What I get on preview :

And what I get on my device :

I want to align ImageView and TextView but I don't know how to do.

Edit :

Thanks to @Bob Malooga and @Rethinavel Pillai.

I used setCompoundDrawables of my TextView and that work perfectly ! (And it's better for perf).

Here is my new code :

    <RelativeLayout
        android:id="@+id/relativeDetails"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_weight="1"
        android:layout_marginStart="10dp"
        android:layout_marginTop="10dp"
        android:orientation="horizontal">
            <TextView
                android:id="@+id/time"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textAlignment="center"
                />
            <TextView
                android:id="@+id/note"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textAlignment="center"
                android:layout_below="@+id/time"
                />
            <TextView
                android:id="@+id/internetNeeded"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textAlignment="center"
                android:layout_below="@+id/note"
                />
    </RelativeLayout>

To set the drawable in TextView :

            TextView duree = (TextView) convertView.findViewById(R.id.time);
            int colorG = Color.parseColor("#FFA500");
            Float taille = Utils.convertDpInPx(16, activity);
            /*Convert DP in Pixel
              public static float convertDpInPx(int dp, Activity activity) {
                  Resources r = activity.getResources();
                  float px = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, r.getDisplayMetrics());
                  return px;
              }*/
            Drawable imgChrono = getContext().getResources().getDrawable( R.drawable.chrono );

            imgChrono.setBounds( 0, 0, Math.round(taille), Math.round(taille)); //To change width and height of drawable
            imgChrono.setColorFilter(colorG, PorterDuff.Mode.SRC_ATOP); //To change color of element
            duree.setCompoundDrawables(imgChrono, null, null, null );
            duree.setText(duration);

Why don't you get rid of both the RelativeLayout and the ImageView? Just use a **compound drawable**. It's better for performances. — Phantômaxx, May 31 '16 at 08:06
use `drawableLeft` for `TextView` for better **performances** like [this](http://stackoverflow.com/questions/4502605/how-to-programatically-set-drawableleft-on-android-button) — Rethinavel, May 31 '16 at 08:12
@RethinavelPillai Yes, as I said, use **compound drawables**. In this case, `drawableLeft`. Or by code: `setCompoundDrawablesWithIntrinsicBounds()` — Phantômaxx, May 31 '16 at 08:27
I use my drawable in other activity, and with compound drawables I can't resize drawable like I want :x — Eraseth, May 31 '16 at 08:45

score 3 · Answer 1 · answered May 31 '16 at 08:08

try this way:

<LinearLayout
        android:layout_marginTop="8dp"
        android:id="@+id/secondRelative"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/imageNote"
            android:layout_width="15dp"
            android:layout_height="15dp"
            android:src="@drawable/rank"
            android:layout_marginEnd="2dp"
            android:layout_marginRight="2dp"/>
        <TextView
            android:id="@+id/note"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Test"
            android:layout_alignBaseline="@id/imageNote"
        />

    </LinearLayout>

Align ImageView and TextView in a Linear Layout

1 Answers1