How do I use a compound drawable instead of a LinearLayout that contains an ImageView and a TextView

117,016

Solution 1

TextView comes with 4 compound drawables, one for each of left, top, right and bottom.

In your case, you do not need the LinearLayout and ImageView at all. Just add android:drawableLeft="@drawable/up_count_big" to your TextView.

See TextView#setCompoundDrawablesWithIntrinsicBounds for more info.

Solution 2

if for some reason you need to add via code, you can use this:

mTextView.setCompoundDrawablesWithIntrinsicBounds(left, top, right, bottom);

where left, top, right bottom are Drawables

Solution 3

To add to this - it seems important to define the width & height of the drawable as per this post:

(his code works)

Solution 4

You can use general compound drawable implementation, but if you need to define a size of drawable use this library:

https://github.com/a-tolstykh/textview-rich-drawable

Here is a small example of usage:

<com.tolstykh.textviewrichdrawable.TextViewRichDrawable
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Some text"
        app:compoundDrawableHeight="24dp"
        app:compoundDrawableWidth="24dp" />
Share:
117,016

Related videos on Youtube

Leo
Author by

Leo

I am currently the Engineering Manager - Mobile at Dialpad, currently working on the Dialpad app. Also wrote and am helping supporting the UberConference.com app.

Updated on July 08, 2022

Comments

  • Leo
    Leo almost 2 years

    Ran the new Lint tool against my code. It came up with a lot of good suggestions, but this one I cannot understand.

    This tag and its children can be replaced by one and a compound drawable

    Issue: Checks whether the current node can be replaced by a TextView using compound drawables.

    A LinearLayout which contains an ImageView and a TextView can be more efficiently handled as a compound drawable

    And here is my layout

    <LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:layout_centerInParent="true">
    
    <ImageView 
        android:id="@+id/upImage"
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:layout_gravity="center_vertical"
        android:scaleType="centerInside"
        android:src="@drawable/up_count_big">
    </ImageView>
    
    <TextView
        android:id="@+id/LikeCount"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="2dp"
        android:layout_marginBottom="1dp"
        android:textColor="@color/gray"
        android:textSize="16sp"
        android:layout_gravity="center_vertical">
    </TextView>
    </LinearLayout>
    

    Can someone provide a concrete example of how to make a compound drawable in this case?

    • Richard Le Mesurier
      Richard Le Mesurier about 10 years
      fwiw that's one of the checks I normally disable, because of the false positives. Not all TextView / ImageView combos can be replaced in this way.
    • Oleksandr
      Oleksandr over 8 years
      @RichardLeMesurier You can use custom view if you want to define a size of image. This will make your view lighter. See my answer: stackoverflow.com/a/31916731/2308720
    • Richard Le Mesurier
      Richard Le Mesurier over 8 years
      @Alex I agree in many cases, however in my experience I have often it not worth the trouble of creating a custom view to get around what I consider to be a buggy Lint check.
  • David O'Meara
    David O'Meara almost 12 years
    not necessarily, as your link shows an example with a dynamic image. In that case it may still be easier or preferable to use an ImageView. The warning says 'can be replaced by', not 'should be replaced by'
  • Hitesh Dhamshaniya
    Hitesh Dhamshaniya over 11 years
    but how can I make some space between Image and Text
  • Snicolas
    Snicolas over 11 years
    @Hitesh Dhamshaniya, using DrawablePadding property in XML or code.
  • 2cupsOfTech
    2cupsOfTech over 11 years
    and you can also link TextView drawables to xml states, explained here: 2cupsoftech.wordpress.com/2012/09/18/…
  • BrainSlugs83
    BrainSlugs83 almost 11 years
    In my case, I moved to a LinearLayout with an inner ImageView/TextView because the android:drawableLeft didn't offer enough control -- so, what you're basically telling me is that this warning/suggestion is a lie.
  • ılǝ
    ılǝ almost 10 years
    It's not a lie, for some cases a single TextView could indeed be efficient. But in general - yes, ImageView with TextView provides much richer control.
  • Zordid
    Zordid almost 9 years
    And how do you apply tinting to the compound drawables? I need that option?
  • Puni
    Puni over 6 years
    Require API 17 above
  • Javier P
    Javier P over 6 years
    I don't think so, documentation states since API 1
  • Puni
    Puni over 6 years
    See this link [documentation](developer.android.com/reference/android/widg‌​et/…, android.graphics.drawable.Drawable, android.graphics.drawable.Drawable, android.graphics.drawable.Drawable))
  • Javier P
    Javier P over 6 years
    yeah note the Relative in the method name ;) I'm not referring to this one in the answer
  • CoolMind
    CoolMind over 5 years
    @Puni, do you use SVG images? If yes, you should add a support.