周围的图像中的android文字环绕图像、文字、android

2023-09-04 07:10:30 作者:风穿襟袖 长叹裁红颜

我使用列表视图来显示我要显示像上面的图片和文字,任何人都可以建议我如何环绕图片文字与出的WebView。我使用下面的code:

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 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;
    }
};

使用此code IAM让下面的图片请建议如​​何先拿到意味着各地的图像正确的文字换行没有更多的空格

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

推荐答案

较早的帖子,但因为没有公认的答案,我刚刚发现了同样的问题的解决方案在我的应用程序,我会发布的解决方案。

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.

所以,我做的是我设置了包装的TextView的的LayoutParams左旁到所需的缩进,我设置文本​​的TextView。然后,添加OnGlobalLayoutListener和onGlobalLayout回调里面,我算的最后一个字符的最后一行的位置,以图像的右侧

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));

如果文本没有比行数更多的行应该有左边距(或者最后一个字符已经换行),我刚才设置的LeadingMarginSpan2对文本的整体长度。

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);
}

如果文本的长度,我将其分成两部分(第一个在charCount位置结束),它们之间插入断行,把它们合并,并设置LeadingMarginSpan2仅在第一部分。

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));
}

最后,不要忘了取出的TextView的的LayoutParams的左边缘。

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