Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Save more on your purchases! discount-offer-chevron-icon
Savings automatically calculated. No voucher code required.
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Newsletter Hub
Free Learning
Arrow right icon
Arrow up icon
GO TO TOP
PhoneGap 4 Mobile Application Development Cookbook

You're reading from   PhoneGap 4 Mobile Application Development Cookbook Build real-world hybrid mobile applications using the robust PhoneGap development platform

Arrow left icon
Product type Paperback
Published in Oct 2015
Publisher
ISBN-13 9781783287949
Length 356 pages
Edition 1st Edition
Arrow right icon
Toc

Table of Contents (14) Chapters Close

Preface 1. Welcome to PhoneGap 3 FREE CHAPTER 2. Movement and Location – Using the Accelerometer and Geolocation Sensors 3. Filesystems, Storage, and Local Databases 4. Working with Audio, Images, and Video 5. Working with Your Contacts List 6. Hooking into Native Events 7. Working with XUI 8. Working with the Ionic Framework 9. Ionic Framework Development 10. User Interface Development 11. Extending PhoneGap with Plugins 12. Development Tools and Testing Index

Learning the basics of the library


When creating applications that focus as heavily on user interactions as mobile apps do, we want to be able to easily update and manage the underlying HTML and data collections.

How to do it...

We'll make use of XUI's simple but powerful DOM traversal methods and the ability to extend the library functionality to custom code:

  1. Create the basic layout for the HTML page.

  2. Create a div element within the page with some text. In this case, we're going to create a Hello World sample text. Set the id attribute for this element to content.

  3. Include a new script tag in the head tag of your document, and reference the XUI library within your project directory:

    <!DOCTYPE HTML>
    <html>
    
    <head>
      <meta name="viewport" content="user-scalable=no,
         initial-scale=1, maximum-scale=1,
         minimum-scale=1, width=device-width;" />
      <meta http-equiv="Content-type" content="text/html; charset=utf-8">
      <title>XUI</title>
      <script type...
lock icon The rest of the chapter is locked
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at $19.99/month. Cancel anytime
Banner background image