Android中的分页文本
Ho1*_*Ho1 38 java pagination android textview android-layout
我正在为Android编写一个简单的文本/电子书查看器,因此我使用了TextView向用户显示HTML格式的文本,因此他们可以通过来回浏览页面中的文本.但我的问题是我不能在Android中对文本进行分页.
我不能(或者我不知道如何)从断行和分页算法中获得适当的反馈,其中TextView用于将文本分成行和页面.因此,我无法理解内容在实际显示中的结束位置,以便我继续从下一页的剩余部分开始.我想找到克服这个问题的方法.
如果我知道屏幕上绘制的最后一个字符是什么,我可以轻松地填充足够的字符来填充屏幕,并且知道实际绘画的完成位置,我可以继续下一页.这可能吗？怎么样？
在StackOverflow上已经多次询问过类似的问题,但没有提供令人满意的答案.这些只是其中的一小部分:
有一个答案,似乎有效,但它很慢.它会添加字符和行,直到填充页面.我不认为这是打破分页的好方法:
它不是这个问题,而是PageTurner电子书阅读器大部分都是正确的,尽管它有点慢.
PS:我不局限于TextView,我知道断行和分页算法可能非常复杂(如在TeX中),所以我不是在寻找一个最佳答案,而是一个相当快速的解决方案,可以被用户.
更新:这似乎是获得正确答案的良好开端:
答:完成文本布局后,可以找到可见文本:
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);
}
});
Oni*_*nik 36
背景
我们对文本处理的了解TextView是,它根据视图的宽度按行正确地分解文本.查看Layout源代码,我们可以看到文本处理是由TextView类完成的.因此,我们可以利用bottom班级为我们所做的工作,并利用其方法进行分页.
问题
问题bottom在于文本的可见部分可能会在最后一条可见线的中间某处垂直切割.关于上述,我们应该在满足视图高度的最后一行时打破一个新页面.
算法
- 我们遍历文本行并检查线条是否
top超出视图的高度; - 如果是这样,我们打破一个新页面并计算累积高度的新值,以比较以下几行
TextView's(参见实现).新值定义为不适合上一页+ 高度的行的TextView值(下图中的红线)Pagination.
履行
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's(StaticLayout类使用Canvas上面实现中的参数).您可以通过任何一组参数Bitmap接受,后来使用分页布局上绘制文本PdfDocument/ Spannable/ yourText.
您还可以将不同字体和格式化字符串Html用作html参数Spanned(如下面的示例所示).
笔记2
当所有文本具有相同的字体大小时,所有行都具有相同的高度.在这种情况下,您可能需要考虑通过计算适合单个页面的行数并在每次循环迭代时跳转到正确的行来进一步优化算法.
样品
下面的示例分页包含两者Activity和TextView文本的字符串.
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);
}
}
Layout的布局:
<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>
截图:
看看我的演示项目.
"魔术"在这段代码中:
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);
令人惊讶的是，很难找到用于分页的库。我认为最好使用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的度量。这是指定分页页面所必需的。
我尚未实现分页，但是我认为这是一个好的开始，并且显示出希望，应该很快。如您所见，有些开发人员已经实现了此功能。