Android文本围绕图像缺陷

Question

通过遵循这个问题，我能够在图像周围有文本。然而，我有以下问题。

​

​

如您所见，顶部图像的空间显示在右侧的每一段中。在这个问题中，有人遇到了这个问题，并建议将'ss.length()‘改为’line‘。这似乎是可行的，除非第一段太短，下一段将重叠图像。

我稍微修改了FlowTextHelper类，以使用来自Html的文本。这是我使用的代码：

public class FlowTextHelper {
    private static boolean mNewClassAvailable;

    /* class initialization fails when this throws an exception */
    static {
        try {
            Class.forName("android.text.style.LeadingMarginSpan$LeadingMarginSpan2");
            mNewClassAvailable = true;
        } catch (Exception ex) {
            mNewClassAvailable = false;
        }
    }

    public static void tryFlowText(String text, View thumbnailView, TextView messageView, Display display, int addPadding){
        // There is nothing I can do for older versions, so just return
        if(!mNewClassAvailable) return;

        // Get height and width of the image and height of the text line
        thumbnailView.measure(display.getWidth(), display.getHeight());
        int height = thumbnailView.getMeasuredHeight();
        int width = thumbnailView.getMeasuredWidth() + addPadding;
        messageView.measure(width, height); //to allow getTotalPaddingTop
        int padding = messageView.getTotalPaddingTop();
        float textLineHeight = messageView.getPaint().getTextSize();

        // Set the span according to the number of lines and width of the image
        int lines =  (int)Math.round((height - padding) / textLineHeight);
        //SpannableString ss = new SpannableString(text);
        //For an html text you can use this line:
        if(!text.equals("")) {
            SpannableStringBuilder ss = (SpannableStringBuilder) Html.fromHtml(text);
            ss.setSpan(new MyLeadingMarginSpan2(lines, width), 0, ss.length(), 0);
            messageView.setText(ss);
            messageView.setMovementMethod(LinkMovementMethod.getInstance()); // links

            // Align the text with the image by removing the rule that the text is to the right of the image
            RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) messageView.getLayoutParams();
            int[] rules = params.getRules();
            rules[RelativeLayout.RIGHT_OF] = 0;
        }
    }
}

public class MyLeadingMarginSpan2 implements LeadingMarginSpan.LeadingMarginSpan2 {
    private int margin;
    private int lines;

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

    @Override
    public int getLeadingMargin(boolean first) {
        return first ? margin : 0;
    }

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

    @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) {}
}

是什么导致每一段的空间被重复，我如何摆脱它？任何帮助都是非常感谢的。

Answer 1

我花了几个小时来解决这个问题，但多亏了这里找到的答案：android环境下图像的文本包装

基本情况如下：

首先在文本视图中添加页边距并设置文本。

final RelativeLayout.LayoutParams params = RelativeLayout.LayoutParams)messageView.getLayoutParams();
params.setMargins(marginWidth, 0, 0, 0);
messageView.setText(Html.fromHtml(text));

然后添加一个OnGlobalLayoutListener，并在onGlobalLayout()调用中计算实际需要多少行的边距。将行拆分为两个单独的可扩展项，并仅将页边距添加到第一个：

        messageView.getViewTreeObserver().addOnGlobalLayoutListener( new OnGlobalLayoutListener() {

            @SuppressLint("NewApi")
            @SuppressWarnings("deprecation")
            @Override
            public void onGlobalLayout() {

                int linesCount = messageView.getLayout().getLineCount();
                // restore the margin
                params.setMargins(0, 0, 0, 0);
                SpannableString spanS =  new  SpannableString ( Html.fromHtml(text) );

                if (linesCount <= lines) {
                    spanS.setSpan(new MyLeadingMarginSpan2(lines, width), 0, spanS.length(), 0);
                    messageView.setText(spanS);
                } else {
                    // find the breakpoint where to break the String.
                    int breakpoint = messageView.getLayout().getLineEnd(lines-1);

                    Spannable s1 = new SpannableStringBuilder(spanS, 0, breakpoint);
                    s1.setSpan(new MyLeadingMarginSpan2(lines, width), 0, s1.length(), 0);
                    Spannable s2 = new SpannableStringBuilder(System.getProperty("line.separator"));
                    Spannable s3 = new SpannableStringBuilder(spanS, breakpoint, spanS.length());
                    // It is needed to set a zero-margin span on for the text under the image to prevent the space on the right!
                    s3.setSpan(new MyLeadingMarginSpan2(0, 0), 0, s3.length(), 0);
                    messageView.setText(TextUtils.concat(s1, s2, s3));
                }

                // remove the GlobalLayoutListener
                if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.JELLY_BEAN) {
                     messageView.getViewTreeObserver().removeOnGlobalLayoutListener(this);                           
                 } else {
                     messageView.getViewTreeObserver().removeGlobalOnLayoutListener(this);
                 }
            }
        });

Answer 2

如果需要将文本包装在图像周围，请使用此库FlowTextView。

该库运行良好，可以与几行代码一起使用。但是，它不支持字体的屏幕像素大小。我找到了这个回答的解决方案，这样您就可以将像素大小转换为sp。

我希望这对任何人都有帮助，你不要像我用我原来的帖子那样浪费时间。