ImageSpan.ALIGN_BASELINE when TextView has lineSpacing

Question

I want to align my ImageSpan to the baseline of the text, but I also need to add some spacing between the lines.
The problem is that when I add line spacing, the ImageSpan doesn't align to the baseline of the text, but to the baseline+lineSpacing, so it's appearing lower than it should.

Is there a workaround to this ?

Edit: Further explanation :

How it looks like without lineSpacing ( the arrow is the ImageSpan). It's correctly aligned to the baseline.
How it looks like if I add android:lineSpacingMulitiplier="1.2"

Edit 2 The code:
XML:

<com.kushtrim.example.views.CustomTypefaceTextView
    android:id="@+id/descId"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:lines="3"
    android:gravity="center_vertical"
    android:layout_marginLeft="@dimen/_45"
    android:layout_marginTop="@dimen/_6"
    android:layout_marginBottom="@dimen/_20"
    app:font_type="merriweather_regular"
    android:textSize="@dimen/f40"
    android:lineSpacingMultiplier="1.2"
    android:textColor="@color/black"
    android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
    android:ellipsize="end" />

Other relevant methods:

    private Spannable getContentText(ContactRaport contactRaport) {
    DateTime dateTime = new DateTime(contactRaport.contactDate);

    String datePart = dateTime.getDayOfMonth() + " " + dateTime.monthOfYear().getAsShortText(new Locale("nl")) + "; ";
    String completeText = datePart + contactRaport.note;

    Typeface font1 = Typeface.createFromAsset(context.getAssets(), "MyFont1.ttf");
    Typeface font2 = Typeface.createFromAsset(context.getAssets(), "MyFont2.ttf");
    SpannableStringBuilder  spannable = new SpannableStringBuilder("XX");
    ImageSpan arrow = getArrowImageSpan(contactRaport);
    spannable.setSpan(arrow, 0, 2, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
    spannable.append(completeText);

    spannable.setSpan(new CustomTypefaceSpan("", font1 ), 2, datePart.length()+1, Spanned.SPAN_EXCLUSIVE_INCLUSIVE);
    spannable.setSpan(new CustomTypefaceSpan("", font2), datePart.length(), completeText.length(), Spanned.SPAN_EXCLUSIVE_INCLUSIVE);
    spannable.setSpan(new ForegroundColorSpan(getContentDateColor(contactRaport)),2, datePart.length()+1, 0);

    return spannable;
}

.

private ImageSpan getArrowImageSpan(ContactRaport contactRaport) {

    Drawable d = null;
    switch (contactRaport.type) {
        ... logic to load the correct drawable
    }


   d.setBounds(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight());

    return new ImageSpan(d, ImageSpan.ALIGN_BASELINE);
}

@Destro Further explanied what I mean. I didn't post the code since I'm not doing anything special, just adding android:lineSpacingMulitiplier — Rick Sanchez, Jul 21 '15 at 13:37
how to add image , means under the linear layout ya relative layout.. Image is add in center in vertical of layout. — Abhinav singh, Jul 21 '15 at 13:45
@Destro You aren't understanding the question. I'm not using linear or relative layouts, but ImageSpan in a TextView — Rick Sanchez, Jul 21 '15 at 13:48
check this example.. http://stackoverflow.com/questions/3176033/spannablestring-with-image-example — Abhinav singh, Jul 21 '15 at 14:02

score 0 · Answer 1 · edited May 23 '17 at 12:25

I had the same problem lately, managed to solve it with altering this answer. I couldn't find out how to get the line height from font metrics so I set it as a constant float (you can also get it from the TextView.

private static class CenterImageSpan extends ImageSpan {

    public CenterImageSpan(Drawable d) {
        super(d, ALIGN_BOTTOM);
    }

    public void draw(@NonNull Canvas canvas, CharSequence text, int start,
                     int end, float x, int top, int y, int bottom,
                     @NonNull Paint paint) {
        Drawable b = getDrawable();
        canvas.save();

        int transY = bottom - b.getBounds().bottom;
        // this is the key
        transY -= paint.getFontMetricsInt().descent / 2;

        // adjust it for the current line height
        transY *= 1 - (LINE_HEIGHT - 1) * 2;

        canvas.translate(x, transY);
        b.draw(canvas);
        canvas.restore();
    }
}

ImageSpan.ALIGN_BASELINE when TextView has lineSpacing

1 Answers1