android 阅读器放大镜,制作安卓PDF阅读器:四、实现文本选择之放大镜、长按拖动...

本文探讨了国产PDF阅读器在界面设计和用户体验方面的特点,指出了一些工具在触屏体验和功能实用性上的不足。作者分享了如何在Android平台上实现PDF阅读器的放大镜效果,包括以触点为中心的放大、圆角处理和跟手移动,并讨论了长按和长按拖选的操作方式。此外,还提到了优化放大镜功能的细节,如路径裁切和移动机制。
摘要由CSDN通过智能技术生成

看到一篇知乎上的文章,《这可能是最好用的一款 PDF 阅读、批注工具~如果他称第二,没人敢称第一!》,看了后下载试用,还好。单就触屏体验而言,没他说的那么好听。

这类国产APP的门面都是非常好看的,不论是图标还是动画效果。

比如 ( 轻快PDF阅读器 ):

fff6f641217e

漂亮的图标,给画家点赞!

再如( PDF Viewer - com.pspdfkit.viewer ):

fff6f641217e

竟然连小图标都有渐变效果,膜拜!菜单的弹出方式也十分舒适。

但是它们都没有我想要的功能!比如“轻快PDF”,界面虽美,功能却简单了些。没记错的话,它似乎有一个吊炸天、美艳无敌的工具边栏,然而却连文本分享都没得。

PDF Viewer 的功能有很多,使用的话需要一定的适应时间。其文本选择没有中文分词功能,长按有时直接选择了一整行;加之惯性滑动、单指双击缩放这两个触屏操作处理得不是很好,手机上使用不太方便。

PDF Viewer 是商业开发套件 PSPDFKit 的具体产品。有意思的是,PSPDFKit 同样是基于 PDFium 的,只不过开发商进行了深入优化改造,甚至还回馈了一部分代码给 PDFium。

那么接着上文,继续来实现放大镜效果吧!

原生 TextView 的放大镜其实可有可无,特别是单行 EditText 的那种,放大镜反而会遮蔽视野。无奈安卓平台并未给出正式的开/关功能,只能自己 HACK 放大镜。

而移动平台的 PDF 阅读器则截然不同,因为页面缩放比是随意可变的,放大镜显得尤为重要。

一、以屏幕触点为中心,绘制放大镜。

与绘制PDF相同,且直接复用绘制高清铺块时缓存的drawingBucket数组。为实现放大效果,source 坐标转换 view 坐标的方法需要少许修改:

void sourceToMagViewRectF(@NonNull RectF sRect, @NonNull Rect vTarget) {

float scaleFactor=1.5f;

float scale = pDocView.scale;

float newScale = scale*scaleFactor;

![1] 首先,减去屏幕触点的屏幕空间坐标,结果,此后画布绘制的PDF将以原触点位置的PDF像素为左上角。

float vx = pDocView.vTranslate.x-pDocView.lastX;

float vy = pDocView.vTranslate.y-pDocView.lastY;

![2] 应用放大效果,结果,仍然以原触点位置的PDF像素为左上角,但变大了。

vx*=scaleFactor;

vy*=scaleFactor;

scale = newScale;

![3] 最后,再次移位,让原触点位置的PDF像素绘制于放大镜正中央。

vx+=magW*0.5f;

vy+=magH*0.5f;

![] 这是原本的 source 坐标(位于超级大图中)转换 view 坐标(位于屏幕空间)的方法,应用于矩形的四个顶点。

vTarget.set(

(int) (sRect.left * scale + vx),

(int) (sRect.top * scale + vy),

(int) (sRect.right * scale + vx),

(int) (sRect.bottom * scale + vy)

);

}

写这段代码时,想象先让放大镜绘制一模一样的PDF内容,然后移位[1],放大[2],最后再次移位[3]。调试时,至少要先看到放大镜中的画面,并且内容随触点移动而移动。放大镜本身绘制在哪里无关紧要,因为那是下一段文章要解决的事情。

二、放大镜圆角、跟手。

fff6f641217e

多方衡量后,决定在这方面效仿 ezpdfreader。

ezpdf reader 的放大镜除了圆角外,底部还有着对话框一样的小三角尖,其实这和圆角的原理是一样的,都可以用 canvas.clipPath 达成,不过手上暂时没有对话框路径的生成方式,所以先实现最简单的圆角吧!

首先,定义用于裁切画布的 Path

Path magClipper;

RectF magClipperR;

然后,只需初始化一次 Path 形状,之后每次在 draw 之前调用 canvas.clipPath(path) 即可。

private void initMagnifier() {

//setLayerType(LAYER_TYPE_NONE,null);

cc = new Canvas(PageCache= Bitmap.createBitmap(magW,magH,Bitmap.Config.ARGB_8888));

PageCacheDrawable = new BitmapDrawable(getResources(), PageCache);

frameDrawable = getResources().getDrawable(R.drawable.frame);

framew=getResources().getDimension(R.dimen.framew);

magClipper = new Path();

magClipperR = new RectF(PageCacheDrawable.getBounds());

magClipper.reset();

magClipperR.set(0,0,magW,magH);

magClipper.addRoundRect(magClipperR,framew+5,framew+5,Path.Direction.CW);

}

各类阅读器放大镜跟随屏幕触点移动的方案各不相同。我的选择依然与 ezpdfreader 类似:始终绘制放大镜,放大镜跟手,控点 handle 不跟手。

有了放大镜后,方能进一步细致地调整相关参数和机制。下面实现长按,之前都是单击直接触发选择的。

三、长按和长按托选。

长按后直接移动,相当于在选择文本之后,立即移动右边的控点,较为便捷。

fff6f641217e

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值