npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

cordova-plugin-ionic-keyboard

v2.2.0

Published

Ionic Keyboard Plugin

Downloads

85,973

Readme

cordova-plugin-ionic-keyboard

This plugin has been designed to work seamlessly with cordova-plugin-ionic-webview, so make sure you have it installed first:

  • https://github.com/ionic-team/cordova-plugin-ionic-webview
  • https://ionicframework.com/docs/wkwebview/

Installation

cordova plugin add cordova-plugin-ionic-keyboard --save

Preferences

KeyboardResize (for iOS only)

Boolean (true by default)

Possible values

  • true: Showing/hiding the keyboard will trigger some kind of resizing of the app (see KeyboardResizeMode)
  • false: Web will not be resized when the keyboard shows up.
<preference name="KeyboardResize" value="true" />

KeyboardResizeMode (for iOS only)

String ('native' by default)

Possible values

  • native: The whole native webview will be resized when the keyboard shows/hides, it will affect the vh relative unit.
  • body: Only the html <body> element will be resized. Relative units are not affected, because the viewport does not change.
  • ionic: Only the html ion-app element will be resized. Only for ionic apps.
<preference name="KeyboardResizeMode" value="native" />

KeyboardStyle (for iOS only)

String ('light' by default)

Possible values

  • light
  • dark
<preference name="KeyboardStyle" value="dark" />

HideKeyboardFormAccessoryBar (for iOS only)

Boolean (true by default)

Possible values

  • true: hides the keyboard accessory bar.
  • false: shows the keyboard accessory bar.
<preference name="HideKeyboardFormAccessoryBar" value="false" />

resizeOnFullScreen (for Android only)

There is an Android bug that prevents the keyboard from resizing the WebView when the app is in full screen (i.e. if StatusBar plugin is used to hide the StatusBar). This setting, if set to true, add a workaround that resizes the WebView even when the app is in full screen.

Boolean (false by default)

Possible values

  • false: doesn't resize the WebView when the app is in full screen.
  • true: resizes the WebView when the app is in full screen.
<preference name="resizeOnFullScreen" value="true" />

Methods

Keyboard.hideFormAccessoryBar (for iOS only)

Hide the keyboard toolbar.

Set to true to hide the additional toolbar that is on top of the keyboard. This toolbar features the Prev, Next, and Done buttons.

Keyboard.hideFormAccessoryBar(value, successCallback);

Quick Example

Keyboard.hideFormAccessoryBar(true);
Keyboard.hideFormAccessoryBar(false);
Keyboard.hideFormAccessoryBar(null, (currentValue) => { console.log(currentValue); });

Keyboard.hide

Hide the keyboard

Call this method to hide the keyboard

Keyboard.hide();

Keyboard.show (for Android only)

Show the keyboard

Call this method to show the keyboard.

Keyboard.show();

Keyboard.setResizeMode (for iOS only)

Programmatically set the resize mode

Call the method with parameter to set the resize mode.

// Possible values are the same as for 'KeyboardResizeMode' preference
Keyboard.setResizeMode('native');
Keyboard.setResizeMode('body');
Keyboard.setResizeMode('ionic');

Keyboard.setKeyboardStyle (for iOS only)

Programmatically set the keyboard style

// Possible values are the same as for 'KeyboardStyle' preference
Keyboard.setKeyboardStyle('light'); // <- default
Keyboard.setKeyboardStyle('dark');

Keyboard.disableScroll (for iOS only)

Programmatically enable or disable the WebView scroll

Keyboard.disableScroll(true); // <- default
Keyboard.disableScroll(false);

Properties

Keyboard.isVisible

Determine if the keyboard is visible.

Read this property to determine if the keyboard is visible.

if (Keyboard.isVisible) {
    // do something
}

Events

keyboardDidHide

This event is fired when the keyboard is fully closed.

Attach handler to this event to be able to receive notification when keyboard is closed.

window.addEventListener('keyboardDidHide', () => {
    // Describe your logic which will be run each time keyboard is closed.
});

keyboardDidShow

This event is fired when the keyboard is fully open.

Attach handler to this event to be able to receive notification when keyboard is opened.

window.addEventListener('keyboardDidShow', (event) => {
    // Describe your logic which will be run each time when keyboard is about to be shown.
    console.log(event.keyboardHeight);
});

keyboardWillShow

This event fires before keyboard will be shown.

Attach handler to this event to be able to receive notification when keyboard is about to be shown on the screen.

window.addEventListener('keyboardWillShow', (event) => {
    // Describe your logic which will be run each time when keyboard is about to be shown.
    console.log(event.keyboardHeight);
});

keyboardWillHide

This event fires before keyboard will be closed.

Attach handler to this event to be able to receive notification when keyboard is about to be closed.

window.addEventListener('keyboardWillHide', () => {
    // Describe your logic which will be run each time when keyboard is about to be closed.
});