Question

我正在为Android编写一个简单的文本/电子书查看器，因此我使用TextView向用户显示HTML格式的文本，因此他们可以通过来回浏览页面中的文本。但我的问题是我不能在Android中对文本进行分页。

我不能（或者我不知道如何）从TextView用于将文本分成行和页面的换行和分页算法中获得适当的反馈。因此，我无法理解内容在实际显示中的结束位置，以便我继续从下一页的剩余部分开始。我想找到解决这个问题的方法。

如果我知道屏幕上绘制的最后一个字符是什么，我可以轻松地填充足够的字符来填充屏幕，并且知道实际绘画的完成位置，我可以继续下一页。这可能吗？怎么样？

在StackOverflow上已经多次询问过类似的问题，但没有提供令人满意的答案。这些只是其中的几个：

只有一个答案，似乎有效，但速度很慢。它会添加字符和行，直到填充页面。我不认为这是打破分页的好方法：

How to break styled text into pages in Android?

不是这个问题，而是 PageTurner eBook reader 大部分都是正确的，尽管它有点慢。

https://github.com/nightwhistler/pageturner

PS：我不局限于TextView，我知道断行和分页算法可能非常复杂（as in TeX），所以我不是在寻找最佳答案，而是一个相当快速的解决方案可供用户使用。

更新：这似乎是获得正确答案的良好开端：

Is there a way of retrieving a TextView's visible line count or range?

答案：完成文字布局后，可以找到可见文字：

ViewTreeObserver vto = txtViewEx.getViewTreeObserver();
        vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                ViewTreeObserver obs = txtViewEx.getViewTreeObserver();
                obs.removeOnGlobalLayoutListener(this);
                height = txtViewEx.getHeight();
                scrollY = txtViewEx.getScrollY();
                Layout layout = txtViewEx.getLayout();

                firstVisibleLineNumber = layout.getLineForVertical(scrollY);
                lastVisibleLineNumber = layout.getLineForVertical(height+scrollY);

            }
        });

Answer 1

背景

我们对TextView中文本处理的了解是，它根据视图的宽度正确地按行划分文本。查看TextView's sources，我们可以看到文本处理是由Layout类完成的。因此，我们可以利用Layout类为我们所做的工作，并利用其方法进行分页。

问题

TextView的问题是文本的可见部分可能会在最后一条可见线的中间某处垂直切割。关于上述问题，我们应该在满足视图高度的最后一行时打破新页面。

算法

我们遍历文本行并检查行bottom是否超出了视图的高度;
如果是这样，我们会拆分新页面并计算累积高度的新值，以便将以下行“bottom与（参见实现）进行比较。新值定义为不适合上一页+ top高度的行的TextView's值（下图中的红线）。

实施

public class Pagination {
    private final boolean mIncludePad;
    private final int mWidth;
    private final int mHeight;
    private final float mSpacingMult;
    private final float mSpacingAdd;
    private final CharSequence mText;
    private final TextPaint mPaint;
    private final List<CharSequence> mPages;

    public Pagination(CharSequence text, int pageW, int pageH, TextPaint paint, float spacingMult, float spacingAdd, boolean inclidePad) {
        this.mText = text;
        this.mWidth = pageW;
        this.mHeight = pageH;
        this.mPaint = paint;
        this.mSpacingMult = spacingMult;
        this.mSpacingAdd = spacingAdd;
        this.mIncludePad = inclidePad;
        this.mPages = new ArrayList<>();

        layout();
    }

    private void layout() {
        final StaticLayout layout = new StaticLayout(mText, mPaint, mWidth, Layout.Alignment.ALIGN_NORMAL, mSpacingMult, mSpacingAdd, mIncludePad);

        final int lines = layout.getLineCount();
        final CharSequence text = layout.getText();
        int startOffset = 0;
        int height = mHeight;

        for (int i = 0; i < lines; i++) {
            if (height < layout.getLineBottom(i)) {
                // When the layout height has been exceeded
                addPage(text.subSequence(startOffset, layout.getLineStart(i)));
                startOffset = layout.getLineStart(i);
                height = layout.getLineTop(i) + mHeight;
            }

            if (i == lines - 1) {
                // Put the rest of the text into the last page
                addPage(text.subSequence(startOffset, layout.getLineEnd(i)));
                return;
            }
        }
    }

    private void addPage(CharSequence text) {
        mPages.add(text);
    }

    public int size() {
        return mPages.size();
    }

    public CharSequence get(int index) {
        return (index >= 0 && index < mPages.size()) ? mPages.get(index) : null;
    }
}

注1

该算法不仅适用于TextView（Pagination类在上面的实现中使用TextView's参数。您可以传递StaticLayout接受的任何参数集，然后使用分页布局在Canvas / Bitmap / PdfDocument上绘制文字。

您还可以将Spannable用作 yourText 参数用于不同的字体以及Html - 格式化的字符串（，如下面的示例< / em>的）。

注2

当所有文本具有相同的字体大小时，所有行都具有相同的高度。在这种情况下，您可能希望通过计算适合单个页面的行数并在每次循环迭代时跳转到正确的行来考虑进一步优化算法。

样品

以下示例对包含html和Spanned文字的字符串进行分页。

public class PaginationActivity extends Activity { private TextView mTextView; private Pagination mPagination; private CharSequence mText; private int mCurrentIndex = 0; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_pagination); mTextView = (TextView) findViewById(R.id.tv); Spanned htmlString = Html.fromHtml(getString(R.string.html_string)); Spannable spanString = new SpannableString(getString(R.string.long_string)); spanString.setSpan(new ForegroundColorSpan(Color.BLUE), 0, 24, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); spanString.setSpan(new RelativeSizeSpan(2f), 0, 24, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); spanString.setSpan(new StyleSpan(Typeface.MONOSPACE.getStyle()), 0, 24, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); spanString.setSpan(new ForegroundColorSpan(Color.BLUE), 700, spanString.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); spanString.setSpan(new RelativeSizeSpan(2f), 700, spanString.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); spanString.setSpan(new StyleSpan(Typeface.MONOSPACE.getStyle()), 700, spanString.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); mText = TextUtils.concat(htmlString, spanString); mTextView.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { @Override public void onGlobalLayout() { // Removing layout listener to avoid multiple calls mTextView.getViewTreeObserver().removeOnGlobalLayoutListener(this); mPagination = new Pagination(mText, mTextView.getWidth(), mTextView.getHeight(), mTextView.getPaint(), mTextView.getLineSpacingMultiplier(), mTextView.getLineSpacingExtra(), mTextView.getIncludeFontPadding()); update(); } }); findViewById(R.id.btn_back).setOnClickListener(v -> { mCurrentIndex = (mCurrentIndex > 0) ? mCurrentIndex - 1 : 0; update(); }); findViewById(R.id.btn_forward).setOnClickListener(v -> { mCurrentIndex = (mCurrentIndex < mPagination.size() - 1) ? mCurrentIndex + 1 : mPagination.size() - 1; update(); }); } private void update() { final CharSequence text = mPagination.get(mCurrentIndex); if(text != null) mTextView.setText(text); } }

Activity的布局：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" > <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent"> <Button android:id="@+id/btn_back" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:background="@android:color/transparent"/> <Button android:id="@+id/btn_forward" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:background="@android:color/transparent"/> </LinearLayout> <TextView android:id="@+id/tv" android:layout_width="match_parent" android:layout_height="match_parent"/> </RelativeLayout>

<强>截图：

Answer 2

查看我的demo project。

“魔法”在此代码中：

    mTextView.setText(mText);

    int height = mTextView.getHeight();
    int scrollY = mTextView.getScrollY();
    Layout layout = mTextView.getLayout();
    int firstVisibleLineNumber = layout.getLineForVertical(scrollY);
    int lastVisibleLineNumber = layout.getLineForVertical(height + scrollY);

    //check is latest line fully visible
    if (mTextView.getHeight() < layout.getLineBottom(lastVisibleLineNumber)) {
        lastVisibleLineNumber--;
    }

    int start = pageStartSymbol + mTextView.getLayout().getLineStart(firstVisibleLineNumber);
    int end = pageStartSymbol + mTextView.getLayout().getLineEnd(lastVisibleLineNumber);

    String displayedText = mText.substring(start, end);
    //correct visible text
    mTextView.setText(displayedText);

Answer 3

难以找到分页的库。我认为除TextView之外使用另一个Android UI元素会更好。 WebView 怎么样？一个例子@ android-webview-example。代码段：

webView = (WebView) findViewById(R.id.webView1);

String customHtml = "<html><body><h1>Hello, WebView</h1></body></html>";
webView.loadData(customHtml, "text/html", "UTF-8");

注意：这只是将数据加载到WebView上，类似于Web浏览器。但是，让我们不要仅仅停留在这个想法上。将此UI添加到WebViewClient onPageFinished 使用分页。请阅读SO链接@ html-book-like-pagination。 Dan的最佳答案之一的代码片段：

mWebView.setWebViewClient(new WebViewClient() {
   public void onPageFinished(WebView view, String url) {
   ...
      mWebView.loadUrl("...");
   }
});

注意：

代码在页面滚动时加载更多数据。
在同一网页上，Engin Kurutepe发布了一个回答，用于设置WebView的测量值。这对于在分页中指定页面是必要的。

我没有实施分页，但我认为这是一个良好的开端并且显示出承诺，应该很快。如您所见，有些开发人员已实现此功能。

Android中的分页文本

3 个答案:

背景

问题

算法

实施

注1

注2

样品