CODEWITHSUNDEEP
cordovapluginsprinting
MattF
MattF

Reputation: 65

Phonegap Print Plugin

Im trying to use the print plugin by katzer https://github.com/katzer/cordova-plugin-printer

I did all it said but i dont know how to call the function on the index.html file to see if the plugin is working.

this is the 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>

}

this is the 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="[email protected]" 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" />

Upvotes: 0

Views: 7669

Answers (2)

Roy
Roy

Reputation: 1

Like the other answer said, just call "cordova.plugins.printer.print()" function to print. HOWEVER, a big stopper here would be the platform...

The default cordorva printer plugin does NOT support "windows" platform yet. So if you are working on windows, no luck. You have to build it as an App/Apk and installed to your phone to test this function.

How to build it against each mobile platform is out of this topic so, yes, please refer to full documentations...

One quick way is to build the project via Adobe PhoneGap build, and download the apk to see how it works on your phone. Hope this helps.

Upvotes: 0

locknies
locknies

Reputation: 1355

Put a cordova onDeviceReady event.

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. Print the whole HTML page

    // URI for the index.html var page = location.href; cordova.plugins.printer.print(page, 'Document.html', function () { alert('printing finished or canceled') });

  2. Print the content from a part of the page

    // Either a DOM node or a string var page = document.getElementById('legal-notice'); cordova.plugins.printer.print(page, 'Document.html', function () { alert('printing finished or canceled') });

  3. Print custom specific content

// Either a DOM node or a string

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

  1. Print remote web page

    cordova.plugins.printer.print('http://blackberry.de', 'BB!!!', function () { alert('printing finished or canceled') });

  2. Adjust the page

    cordova.plugins.printer.print('123', { name:'Document.html', landscape:true }, function () { alert('printing finished or canceled') });

  3. Custom size and position on iPad

    // Option one cordova.plugins.printer.print('123', { bounds:[40, 30, 0, 0] }); // Option two cordova.plugins.printer.print('123', { bounds:{ left:40, top:30, width:0 height:0 } });

Refer to the Readme at the end of the link you provided.

Upvotes: 1

Related Questions