Phonegap 打印插件
Phonegap Print Plugin
我正在尝试使用 katzer 的打印插件 https://github.com/katzer/cordova-plugin-printer
我说的都做了,但我不知道如何调用 index.html 文件上的函数来查看插件是否正常工作。
这是index.html
<!DOCTYPE html>
<!--
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
distributed with this work for additional information
regarding copyright ownership. The ASF licenses this file
to you under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance
with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing,
software distributed under the License is distributed on an
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, either express or implied. See the License for the
specific language governing permissions and limitations
under the License.
-->
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<meta name="msapplication-tap-highlight" content="no" />
</head>
<body>
<div class="app">
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
<script src="plugins/com.phonegap.plugins.barcodescanner/www/barcodescanner.js"></script>
</div>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="cordova_plugins.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="plugins/de.appplant.cordova.plugin.printer/www/printer.js"></script>
<script>
app.initialize();
alert(isAvailable ? 'Service is available' : 'Service NOT available');
</script>
</body>
}
这是config.xml
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.example.HS" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<preference name="AllowInlineMediaPlayback" value="false" />
<preference name="AutoHideSplashScreen" value="true" />
<preference name="BackupWebStorage" value="cloud" />
<preference name="DisallowOverscroll" value="false" />
<preference name="EnableViewportScale" value="false" />
<preference name="FadeSplashScreen" value="true" />
<preference name="FadeSplashScreenDuration" value=".25" />
<preference name="KeyboardDisplayRequiresUserAction" value="true" />
<preference name="MediaPlaybackRequiresUserAction" value="false" />
<preference name="ShowSplashScreenSpinner" value="true" />
<preference name="SuppressesIncrementalRendering" value="false" />
<preference name="TopActivityIndicator" value="gray" />
<preference name="GapBetweenPages" value="0" />
<preference name="PageLength" value="0" />
<preference name="PaginationBreakingMode" value="page" />
<preference name="PaginationMode" value="unpaginated" />
<feature name="LocalStorage">
<param name="ios-package" value="CDVLocalStorage" />
</feature>
<name>HelloCordova</name>
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author email="dev@cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<content src="index.html" />
<access origin="*" />
<feature name="BarcodeScanner">
<param name="ios-package" value="CDVBarcodeScanner" />
</feature>
<feature name="Printer">
<param name="ios-package" value="APPPrinter" />
</feature>
<gap:plugin name="de.appplant.cordova.plugin.printer" />
<gap:plugin name="com.phonegap.plugins.barcodescanner" />
放置一个 cordova onDeviceReady 事件。
document.addEventListener("deviceready", onDeviceReady, false);
// Cordova Device Ready.
function onDeviceReady() {
cordova.plugins.printer.isAvailable(
//Check whether the printer is available or not.
function (isAvailable) {
//Enter the page location.
var page = location.href;
cordova.plugins.printer.print(page, 'Document.html', function () {
alert('printing finished or canceled')
});
}
);
}
打印整个 HTML 页
// index.html 的 URI
var page = location.href;
cordova.plugins.printer.print(页面,'Document.html',函数(){
警报('printing finished or canceled')
});
打印部分页面的内容
// DOM 节点或字符串
var page = document.getElementById('legal-notice');
cordova.plugins.printer.print(页面,'Document.html',函数(){
警报('printing finished or canceled')
});
打印自定义特定内容
// DOM 节点或字符串
var page = '<h1>Hello Document</h1>';
cordova.plugins.printer.print(page, 'Document.html', function () {
alert('printing finished or canceled')
});
打印远程网页
cordova.plugins.printer.print('http://blackberry.de', 'BB!!!', function () {
警报('printing finished or canceled')
});
调整页面
cordova.plugins.printer.print('123', { 名称:'Document.html', landscape:true }, 函数 () {
警报('printing finished or canceled')
});
iPad
上的自定义尺寸和位置
// 选项一
cordova.plugins.printer.print('123', { 边界:[40, 30, 0, 0] });
// 选项二
cordova.plugins.printer.print('123', { bounds:{ left:40, top:30, width:0 height:0 } });
参考您提供的link末尾的Readme。
就像另一个答案说的,调用"cordova.plugins.printer.print()"函数打印即可。然而,这里的一个大障碍是平台......
默认的 cordorva 打印机插件尚不支持 "windows" 平台。因此,如果您正在处理 windows,那么运气不好。您必须将其构建为 App/Apk 并安装到您的 phone 以测试此功能。
如何针对每个移动平台构建它不属于本主题,所以,是的,请参阅完整文档...
一种快速的方法是通过 Adobe PhoneGap build 构建项目,然后下载 apk 以查看它在您的 phone 上的运行情况。希望这有帮助。
我正在尝试使用 katzer 的打印插件 https://github.com/katzer/cordova-plugin-printer
我说的都做了,但我不知道如何调用 index.html 文件上的函数来查看插件是否正常工作。
这是index.html
<!DOCTYPE html>
<!--
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
distributed with this work for additional information
regarding copyright ownership. The ASF licenses this file
to you under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance
with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing,
software distributed under the License is distributed on an
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, either express or implied. See the License for the
specific language governing permissions and limitations
under the License.
-->
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<meta name="msapplication-tap-highlight" content="no" />
</head>
<body>
<div class="app">
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
<script src="plugins/com.phonegap.plugins.barcodescanner/www/barcodescanner.js"></script>
</div>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="cordova_plugins.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="plugins/de.appplant.cordova.plugin.printer/www/printer.js"></script>
<script>
app.initialize();
alert(isAvailable ? 'Service is available' : 'Service NOT available');
</script>
</body>
}
这是config.xml
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.example.HS" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<preference name="AllowInlineMediaPlayback" value="false" />
<preference name="AutoHideSplashScreen" value="true" />
<preference name="BackupWebStorage" value="cloud" />
<preference name="DisallowOverscroll" value="false" />
<preference name="EnableViewportScale" value="false" />
<preference name="FadeSplashScreen" value="true" />
<preference name="FadeSplashScreenDuration" value=".25" />
<preference name="KeyboardDisplayRequiresUserAction" value="true" />
<preference name="MediaPlaybackRequiresUserAction" value="false" />
<preference name="ShowSplashScreenSpinner" value="true" />
<preference name="SuppressesIncrementalRendering" value="false" />
<preference name="TopActivityIndicator" value="gray" />
<preference name="GapBetweenPages" value="0" />
<preference name="PageLength" value="0" />
<preference name="PaginationBreakingMode" value="page" />
<preference name="PaginationMode" value="unpaginated" />
<feature name="LocalStorage">
<param name="ios-package" value="CDVLocalStorage" />
</feature>
<name>HelloCordova</name>
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author email="dev@cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<content src="index.html" />
<access origin="*" />
<feature name="BarcodeScanner">
<param name="ios-package" value="CDVBarcodeScanner" />
</feature>
<feature name="Printer">
<param name="ios-package" value="APPPrinter" />
</feature>
<gap:plugin name="de.appplant.cordova.plugin.printer" />
<gap:plugin name="com.phonegap.plugins.barcodescanner" />
放置一个 cordova onDeviceReady 事件。
document.addEventListener("deviceready", onDeviceReady, false);
// Cordova Device Ready.
function onDeviceReady() {
cordova.plugins.printer.isAvailable(
//Check whether the printer is available or not.
function (isAvailable) {
//Enter the page location.
var page = location.href;
cordova.plugins.printer.print(page, 'Document.html', function () {
alert('printing finished or canceled')
});
}
);
}
打印整个 HTML 页
// index.html 的 URI var page = location.href; cordova.plugins.printer.print(页面,'Document.html',函数(){ 警报('printing finished or canceled') });
打印部分页面的内容
// DOM 节点或字符串 var page = document.getElementById('legal-notice'); cordova.plugins.printer.print(页面,'Document.html',函数(){ 警报('printing finished or canceled') });
打印自定义特定内容
// DOM 节点或字符串
var page = '<h1>Hello Document</h1>';
cordova.plugins.printer.print(page, 'Document.html', function () {
alert('printing finished or canceled')
});
打印远程网页
cordova.plugins.printer.print('http://blackberry.de', 'BB!!!', function () { 警报('printing finished or canceled') });
调整页面
cordova.plugins.printer.print('123', { 名称:'Document.html', landscape:true }, 函数 () { 警报('printing finished or canceled') });
iPad
上的自定义尺寸和位置// 选项一 cordova.plugins.printer.print('123', { 边界:[40, 30, 0, 0] }); // 选项二 cordova.plugins.printer.print('123', { bounds:{ left:40, top:30, width:0 height:0 } });
参考您提供的link末尾的Readme。
就像另一个答案说的,调用"cordova.plugins.printer.print()"函数打印即可。然而,这里的一个大障碍是平台......
默认的 cordorva 打印机插件尚不支持 "windows" 平台。因此,如果您正在处理 windows,那么运气不好。您必须将其构建为 App/Apk 并安装到您的 phone 以测试此功能。
如何针对每个移动平台构建它不属于本主题,所以,是的,请参阅完整文档...
一种快速的方法是通过 Adobe PhoneGap build 构建项目,然后下载 apk 以查看它在您的 phone 上的运行情况。希望这有帮助。