Skip to content

📡 Support the WKWebView with Appcelerator's Titanium Mobile

License

Notifications You must be signed in to change notification settings

hbugdoll/Ti.WKWebView

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

46 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Ti.WKWebView

Build Status License Support

Summary

Ti.WKWebView is an open source project to support the WKWebView API with Titanium.

Requirements

  • Titanium Mobile SDK 5.0.0.GA or later
  • iOS 9 or later
  • Xcode 7.0 or later

Download + Setup

Download

Setup

Unpack the module and place it inside the modules/iphone folder of your project. Edit the modules section of your tiapp.xml file to include this module:

<modules>
    <module>ti.wkwebview</module>
</modules>

Features

API's

Name Example
WebView WK.createWebView(args)
ProcessPool WK.createProcessPool()

WebView

Properties

Name Type
disableBounce Boolean
suppressesIncrementalRendering Boolean
scalePageToFit Boolean
allowsInlineMediaPlayback Boolean
allowsAirPlayMediaPayback Boolean
allowsPictureInPictureMediaPlaback Boolean
allowsBackForwardNavigationGestures Boolean
allowsLinkPreview Boolean
scrollsToTop Boolean
disableContextMenu Boolean
userAgent String
url String
data Ti.Blob, Ti.File
html Boolean
title Boolean
progress Double
backForwardList Object
ignoreSslError Boolean
mediaTypesRequiringUserActionForPlayback AUDIOVISUAL_MEDIA_TYPE_*
preferences Object
- minimumFontSize (Double)
- javaScriptEnabled (Boolean)
- javaScriptCanOpenWindowsAutomatically (Boolean)
basicAuhentication Object
- username (String)
- password (String)
- persistence (CREDENTIAL_PERSISTENCE_*)
cachePolicy CACHE_POLICY_*
timeout Double
SelectionGranularity SELECTION_GRANULARITY_*
processPool ProcessPool

Methods

Name Parameter Return
stopLoading - Void
reload - Void
goBack - Void
goForward - Void
canGoBack - Boolean
canGoForward - Boolean
isLoading - Boolean
evalJS Code (String), Callback (Function) Void
startListeningToProperties Properties (Array) Void
stopListeningToProperties Properties (Array) Void

Events

Name Properties
message name, body, url, isMainFrame
progress value, url
beforeload url, title
load url, title
redirect url, title
error url, title, error

Constants

Name Property
CREDENTIAL_PERSISTENCE_NONE basicAuthentication.persistence
CREDENTIAL_PERSISTENCE_FOR_SESSION basicAuthentication.persistence
CREDENTIAL_PERSISTENCE_PERMANENT basicAuthentication.persistence
CREDENTIAL_PERSISTENCE_SYNCHRONIZABLE basicAuthentication.persistence
AUDIOVISUAL_MEDIA_TYPE_NONE mediaTypesRequiringUserActionForPlayback
AUDIOVISUAL_MEDIA_TYPE_AUDIO mediaTypesRequiringUserActionForPlayback
AUDIOVISUAL_MEDIA_TYPE_VIDEO mediaTypesRequiringUserActionForPlayback
AUDIOVISUAL_MEDIA_TYPE_ALL mediaTypesRequiringUserActionForPlayback
CACHE_POLICY_USE_PROTOCOL_CACHE_POLICY cachePolicy
CACHE_POLICY_RELOAD_IGNORING_LOCAL_CACHE_DATA cachePolicy
CACHE_POLICY_RETURN_CACHE_DATA_ELSE_LOAD cachePolicy
CACHE_POLICY_RETURN_CACHE_DATA_DONT_LOAD cachePolicy
SELECTION_GRANULARITY_AUTOMATIC selectionGranularity
SELECTION_GRANULARITY_CHARACTER selectionGranularity

WebView <-> App Communication

You can send data from the Web View to your native app by posting messages like this:

window.webkit.messageHandlers.Ti.postMessage({message: 'Titanium rocks!'},'*');

Please note that you should use the Ti message handler to ensure the message event is triggered. This also ensures that your app does not receive unwanted messages by remote pages.

After sending the message from your HTML file, it will trigger the message event with the following event keys:

  • url (The url of the triggered message)
  • body (The message body. In this case: {message: 'Titanium rocks'}
  • name (The name of the message. In this case: 'Ti')
  • isMainFrame (A boolean determing if the messsage was sent from the main-frame)

For sending messages from the app to the Web View, use evalJS to call your JS methods like this:

webView.evalJS('myJSMethod();');

Check out the example file for sending and receiving message back and forth.

Generic Property Observing

You can listen to changes in some of the native properties (see the native KVO-capability). Example:

// Start listening for changes
webView.startListeningToProperties(['title']);

// Add an event listener for the change
webView.addEventListener('title', function(e) {
    // Check for e.value
});

// Remove listening to changes (remove the event listener as well to keep it more clean)
webView.stopListeningToProperties(['title']);

Process Pool

Use process pools to share cookies between web views. Process pools do not take arguments, just pass the same reference to multiple web views. Example:

var WK = require('ti.wkwebview');

var pool = WK.createProcessPool();

var firstWebView = WK.createWebView({
    processPool: pool
});

var secondWebView = WK.createWebView({
    processPool: pool
});

Author

Hans Knoechel (@hansemannnn / Web) for Appcelerator

License

Apache 2.0

Contributing

Code contributions are greatly appreciated, please submit a new pull request!

About

📡 Support the WKWebView with Appcelerator's Titanium Mobile

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • Objective-C 94.6%
  • JavaScript 5.4%