歡迎來到Linux教程網
Linux教程網
Linux教程網
Linux教程網
Linux教程網 >> Linux編程 >> Linux編程 >> 在 PhoneGap 應用內部生成 PDF 文檔

在 PhoneGap 應用內部生成 PDF 文檔

日期:2017/3/1 9:49:16   编辑:Linux編程

前段時間,有人問我能否在PhoneGap應用中生成pdf文件,答案是肯定的而且實現起來也很簡單。我使用JSPDF這個標准的JavaScript類庫來實現這個功能:

下面是示例:首先在命令行創建一個PhoneGap工程create a new PhoneGap project

加入控制台輸出和寫文件插件:

phonegap create . "jspdf.sample" "JSPDF App"
phonegap local plugin add org.apache.cordova.file
phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-console.git

然後,下載JSPDF代碼download the JSPDF project code, 將目標碼拷貝到PhoneGap工程目錄下。我放在 www/js下。然後,在main HTML文件中引入該文件。

<script type="text/javascript" src="js/jspdf.source.js"></script>

我用的是'dist'目錄下未經壓縮/最小化的源文件。

接下來我們開始生成PDF文件。下面的代碼片段利用PhoneGap的文件處理 API PhoneGap's File API. 來生成一個簡單的PDF文件並保存至設備的本地。這個應該算是*AFTER* the deviceready事件。

其中console.log只是為了調試使用:

//FIRST GENERATE THE PDF DOCUMENT
console.log("generating pdf...");
var doc = new jsPDF();

doc.text(20, 20, 'HELLO!');

doc.setFont("courier");
doc.setFontType("normal");
doc.text(20, 30, 'This is a PDF document generated using JSPDF.');
doc.text(20, 50, 'YES, Inside of PhoneGap!');

var pdfOutput = doc.output();
console.log( pdfOutput );

//NEXT SAVE IT TO THE DEVICE'S LOCAL FILE SYSTEM
console.log("file system...");
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSystem) {

console.log(fileSystem.name);
console.log(fileSystem.root.name);
console.log(fileSystem.root.fullPath);

fileSystem.root.getFile("test.pdf", {create: true}, function(entry) {
var fileEntry = entry;
console.log(entry);

entry.createWriter(function(writer) {
writer.onwrite = function(evt) {
console.log("write success");
};

console.log("writing to file");
writer.write( pdfOutput );
}, function(error) {
console.log(error);
});

}, function(error){
console.log(error);
});
},
function(event){
console.log( evt.target.error.code );
});

PDF創建過程其實很簡單。只要使用doc.output()獲取到已創建文件的字符串標識就能做相應的操作。不論是保存到本地,發送到服務器甚至是直接發送到本地設備上的PDF閱讀器中.

更新更詳細的資料可以從JSPDF open source project on GitHub 和online examples 上獲取到。

上面代碼生成的PDF文件可以從這裡獲取You can download the sample PDF here

PhoneGap 的詳細介紹:請點這裡
PhoneGap 的下載地址:請點這裡

Copyright © Linux教程網 All Rights Reserved