文本环绕android中的图像

时间:2013-06-26 07:21:14

标签: android

enter image description here

我正在使用列表视图来显示我想要像上面的图像一样显示的图像和文本,任何人都可以建议我如何用webview来包装图像周围的文本。我使用以下代码:

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

通过使用此代码,我得到下面的图像请建议如何获得第一意味着正确包装图像周围的文本没有更多的空白空间

wrap text around image

1 个答案:

答案 0 :(得分:2)

较旧的帖子,但由于没有接受的答案,我刚刚在我的应用中找到了相同问题的解决方案,我将发布一个解决方案。

我发现没有任何换行的文本效果很好。 带有换行符的文本将文本分成两部分,使得换行符之前的部分结束到图像的右侧,并且换行符之后的部分已经开始在下一行的图像旁边,这也很有效。 / p>

所以我所做的是将TextView的LayoutParams包装的左边距设置为所需的缩进,然后将文本设置为TextView。然后我添加了OnGlobalLayoutListener,并在onGlobalLayout回调中,我计算了图像右边最后一行的最后一个字符的位置

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

如果文本的行数不超过应该有左边距的行数(或者如果最后一个字符已经换行),我只需在文本的整个长度上设置LeadingMarginSpan2。

// 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。

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的左边距。