Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

text wrapping around image in android

Tags:

android

enter image description here

I am using list view to show image and text i want to show like above image, can anyone suggest me how to wrap text around image with out webview. I am using following code:

     Drawable dIcon = getResources().getDrawable(R.drawable.video_icon);
    int leftMargin = dIcon.getIntrinsicWidth() + 10;

    ImageView icon = (ImageView) findViewById(R.id.icon);
    icon.setBackgroundDrawable(dIcon);

    SpannableString ss = new SpannableString(text);
    ss.setSpan(new MyLeadingMarginSpan2(3, leftMargin), 0, ss.length(), 0);

    TextView messageView = (TextView) findViewById(R.id.message_view);
    messageView.setText(ss);

class

 class MyLeadingMarginSpan2 implements LeadingMarginSpan2 {
    private int margin;
    private int lines;

    MyLeadingMarginSpan2(int lines, int margin) {
        this.margin = margin;
        this.lines = lines;
    }

    @Override
    public int getLeadingMargin(boolean first) {
        if (first) {
            return margin;
        } else {
            return 0;
        }
    }

    @Override
    public void drawLeadingMargin(Canvas c, Paint p, int x, int dir, 
            int top, int baseline, int bottom, CharSequence text, 
            int start, int end, boolean first, Layout layout) {}

    @Override
    public int getLeadingMarginLineCount() {
        return lines;
    }
};

by using this code iam getting below image pls suggest to how to get first means correct wrapping text around image without more empty spaces

wrap text around image

like image 655
raju Avatar asked Jun 26 '13 07:06

raju


People also ask

How do I wrap text around multiple images?

If you want text to wrap around the images, make sure the Wrap style is set to “Tight” or “Square.”An easy method is to select the picture, right click, choose “Text wrapping” from the menu, and then “Tight.” You can then select the picture and move it to any location on the page.

What is wrapping text around graphics?

Wrapping a text means adjusting/wrapping text around an image. In HTML, we can either align the image on the right side of the text, or to the left, or to the center. 1jaiz4 and 18 more users found this answer helpful.


1 Answers

Older post, but since there is no accepted answer and I have just found solution for same problem in my app, I will post a solution.

I have discovered that text without any line break works well. Text with a line break that splits the text into 2 parts in a way that the part before line break ends to the right of the image, and the part after line break starts already on next line bellow the image, this also works well.

So what I do is I set left margin of the wrapping TextView's LayoutParams to the desired indent, and I set the text into TextView. Then I add OnGlobalLayoutListener, and inside onGlobalLayout callback, I count the position of the last character on the last line to the right of the image

//lines - number of lines to be affected by the leadingMargin    
int charCount = textView.getLayout().getLineEnd(Math.min(lines - 1, textView.getLayout().getLineCount() - 1));

If the text does not have more lines than the number of lines that should have the left margin (or if the last character is already line break), I just set the LeadingMarginSpan2 on the whole length of the text.

// s - original Spannable containing the whole text
if (charCount >= s.length() || charCount <= 0 || s.charAt(charCount - 1) == '\n') {
                    s.setSpan(new MyLeadingMarginSpan(lines, w), 0, charCount, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
                    textView.setText(s);
}

If the text is longer, I split it into 2 parts (first one ending at the charCount position), insert line break between them, merge them and set the LeadingMarginSpan2 only on the first part.

else {
    Spannable s1 = new SpannableStringBuilder(s, 0, charCount);
    s1.setSpan(new MyLeadingMarginSpan(lines, w), 0, charCount, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    Spannable s2 = new SpannableStringBuilder(System.getProperty("line.separator"));
    Spannable s3 = new SpannableStringBuilder(s, charCount, s.length());
    textView.setText(TextUtils.concat(s1, s2, s3));
}

At the end, do not forget to remove the left margin of the TextView's LayoutParams.

like image 129
david.s Avatar answered Sep 28 '22 17:09

david.s