【问题标题】:Phonegap Print PluginPhonegap 打印插件
【发布时间】:2018-01-01 05:13:58
【问题描述】:

我正在尝试使用 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 plugins printing


    【解决方案1】:

    放置一个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')
    });
        }
    );
    
    }
    
    1. 打印整个 HTML 页面

      // index.html 的 URI var page = location.href; cordova.plugins.printer.print(page, 'Document.html', function () { alert('打印完成或取消') });

    2. 从页面的一部分打印内容

      // DOM 节点或字符串 var page = document.getElementById('legal-notice'); cordova.plugins.printer.print(page, 'Document.html', function () { alert('打印完成或取消') });

    3. 打印自定义特定内容

    // DOM 节点或字符串

    var page = '<h1>Hello Document</h1>';    
    cordova.plugins.printer.print(page, 'Document.html', function () {
        alert('printing finished or canceled')
    });
    
    1. 打印远程网页

      cordova.plugins.printer.print('http://blackberry.de', 'BB!!!', function () { alert('打印完成或取消') });

    2. 调整页面

      cordova.plugins.printer.print('123', { name:'Document.html', Landscape:true }, function () { alert('打印完成或取消') });

    3. 在 iPad 上自定义大小和位置

      // 选项一 cordova.plugins.printer.print('123', { bounds:[40, 30, 0, 0] }); // 选项二 cordova.plugins.printer.print('123', { bounds:{ left:40, top:30, width:0 height:0 } });

    请参阅您提供的链接末尾的自述文件。

    【讨论】:

    • 我收到错误“TypeError: cordova.plugins is undefined”
    【解决方案2】:

    就像其他答案所说,只需调用“cordova.plugins.printer.print()”函数进行打印。但是,这里的一大障碍是平台......

    默认的cordorva 打印机插件还不支持“windows”平台。因此,如果您在 Windows 上工作,那就没有运气了。您必须将其构建为 App/Apk 并安装到您的手机上才能测试此功能。

    如何针对每个移动平台构建它不在本主题范围内,是的,请参阅完整文档...

    一种快速的方法是通过 Adob​​e PhoneGap build 构建项目,然后下载 apk 以查看它在您的手机上的工作方式。希望这会有所帮助。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-05-06
      • 1970-01-01
      • 1970-01-01
      • 2019-06-22
      • 1970-01-01
      相关资源
      最近更新 更多