PDF.js如何创建页面渲染事件？

Question

我正在使用默认的PDF.js查看器，需要检测每次页面呈现的时间。

这应该在打开、滚动或缩放文档时发生。

据我所知，只有在自己显式地呈现页面时才能使用promise，但是否有回调或其他内容可以监听每当页面呈现时？实际上获取页面（作为int）也非常重要。

- sollniss

Answer 1

显式渲染：

好的，我查看了源代码，如果你显式地渲染页面，那么可以使用以下方法：

page.render(content).promise.then(function(){
  alert("done");
});

文档中写道：

用于渲染任务完成的 Promise。

隐式渲染

好吧，你总是可以覆盖页面以提供自己的事件，但是渲染不在任何原型上，所以这变得非常丑陋。 render 调用返回一个具有回调的 RenderTask，该回调在一个 InternalRenderTask 中。因此，您可以通过以下方式来欺骗它：

var renderTask = page.render(...); // make any page render anything anywhere
var internal = renderTask.__proto__;
var oldNext = internal._next;

internal._next = function(){
     if((this.operatorListIdx === this.operatorList.argsArray.length) &&
         this.operatorList.lastChunk){
         anyPageRendered(this.pageNumber);             
     }
     // decorate
     return oldNext.apply(this, arguments);
};

function anyPageRendered(pageNumber){
    // your code here
    alert("Rendered " + pageNumber); 
}

这是未经记录的，可能会出现故障。没有记录的方法可以做到这一点。

- Benjamin Gruenbaum

---

小的跟进一下：在观察器内部，难道也不应该有一种调用我的代码的方法吗？观察器里有一个pageViewDrawCallback，我已经尝试在callback()之前调用我的代码，但没有成功。到目前为止，在pageviewDraw的末尾调用它可以工作，但那时我还无法访问textLayer div。这意味着渲染尚未完全完成。有什么想法吗？ - sollniss

在最新的查看器（非 API）中，还有“pagerendered”事件。 - async5

@sollniss 像async5所说的那样 - 在查看器中，这要简单得多 - 您可以使用 pagerendered 事件。 - Benjamin Gruenbaum

将代码放入TextLayerBuilder_renderLayer中似乎到目前为止都可以正常工作。 - sollniss