Quick Start Guide
This guide describes how to create a Crosswalk web application, and how to create a hybrid application with Crosswalk XWalkView support.
Create Crosswalk Web Application
Prerequisites
Creation
Create a demo application
org.example.foo> crosswalk-app create org.example.fooDevelop the application
In the directory
org.example.foo/appthe template filesicon.png,index.htmlandmanifest.jsonhave already been created.The
manifest.jsonfile is the main configuration interface for your web application. It is cross platform. Refer to the iOS Manifest page for more details on the iOS platform.Build the application
> cd org.example.foo > crosswalk-app buildIf the build succeeds the file
foo.ipawill be in the directory.Install the application
Open iTunes. Connect an iOS device (iPhone/iPad) which is already registered in your development group. Select the
Applicationpage, dragfoo.ipainto theApplicationslist, and sync.'foo.ipawill be installed on the iOS device.
Create Crosswalk Hybrid Application
Create the application project
Open Xcode. Create an iOS application project with the "Single View Application" template in the working directory. For this example, we use "Echo". Use Swift for convenience.
Use CocoaPods to integrate the
crosswalk-ioslibrary and Crosswalk extensions (if needed) into the demo application. For the CocoaPods installation and usage, please refer to: CocoaPods.In the
Echodirectory, create a file calledPodfile:> cd Echo; > touch Podfile;With the contents as below:
platform :ios, '8.1' use_frameworks! pod 'crosswalk-ios', '~> 1.2'This tells CocoaPods that the deploy target is iOS 8.1+ and to integrate library
crosswalk-ioswith the latest version of1.2.x. Remember to adduse_frameworks!becausecrosswalk-iosis partly written in Swift and it has to be built as a framework instead of a static library.Install
Podstarget into the project. Quit the Xcode first, then in theEchodirectory, use command:> pod installAfter the installation, you will find an
Echo.xcworkspaceis generated, and CocoaPods output will notify you to use this workspace instead of theEcho.xcodeprojfrom now on.Open the
Echo.xcworkspace. There will be two projects:EchoandPods.- For quick test, replace the contents of the auto-generated
ViewController.swiftwith the corresponding file in crosswalk-ios/AppShell/AppShell/ViewController.swift, which has set up aXWalkViewinstance for you already.
- For quick test, replace the contents of the auto-generated
Create a directory called
wwwinEchofor the HTML5 files and resources.Create the
index.htmlfile as your entry page with the contents as follows:<html> <head> <meta name='viewport' content='width=device-width' /> <title>Echo demo of Crosswalk</title> </head> <body> <h2>Echo Demo of Crosswalk</h2> </body> </html>Add the
wwwdirectory into the project.In
File->Add Files to "Echo"..., choose thewwwdirectory and selectCreate folder reference.Create
manifest.plistto describe the application's configuration.In
File->New...->File..., chooseiOS->Resource->Property List. Create a plist file with namemanifest.plistinEchodirectory. This manifest file will be loaded at application startup;Add an entry with the key:
start_urland the string value:index.html. This is the entry page.XWalkViewwill locate it in thewwwdirectory.
The Echo demo is ready to run now. Press 'Run' button and it will be deployed and run on your iOS simulator.
This is the first step in building the Echo demo. If you need to know how to setup a hybrid project with your own Crosswalk extension, please go to: Extension for more details.
English
