MobileBrowsers

(Difference between revisions)
m (moved PhoneGapSetup to MobileBrowsers: Page is not specific only to PhoneGap but also for HTML5 development on Android and iOS.)
Line 1: Line 1:
-
* Android Device
+
__TOC__
 +
 
 +
=Introduction=
 +
NetBeans 7.4 supports HTML5 and JavaScript development for mobile devices (Android and iOS).
 +
 
 +
=Requirements=
 +
==Android==
 +
NetBeans 7.4 supports development, deploying, debugging and live CSS styling on Android devices. Debugging features are available only in Android 4.0+ with Mobile Chrome Web Browser. (Chrome is not available in Android Emulator)
 +
Setup Instructions:
# Install Android SDK from http://developer.android.com/sdk
# Install Android SDK from http://developer.android.com/sdk
# Enable USB debugging on Android Device
# Enable USB debugging on Android Device
-
# Webkit debugging works only with Mobile Chrome
+
# Enable USB Web Debugging in Mobile Chrome
 +
 
 +
==iOS==
 +
NetBeans 7.4 supports development, deploying, debugging and live CSS styling also on iOS Devices. Support for iOS is available only on Mac. Debugging is available for iOS 6.0+.
 +
Setup Instructions:
 +
# Install XCode from Mac App Store
 +
# Install command line tools and iOS Simulator SDK
 +
# Enable WebKit Debugging on your iOS Device in mobile Safari Preferences.
 +
 
 +
==PhoneGap==
 +
NetBeans 7.4 is able to build HTML5 project as PhoneGap application and deploy it to Android or iOS Device or Simulator. The IDE also supports live styling and debugging on iOS Device or Simulator.
 +
Setup Instructions:
 +
#Download and install PhoneGap from http://www.phonegap.com
 +
 
 +
=Mobile Browsers=
 +
NetBeans 7.4 can open any html page in mobile web browser.
 +
==Android==
 +
Starting web project on Android Device:
 +
# Invoke Tools | Options | and specify android location
 +
# Make sure, that your Android 4.0+ device is connected via USB cabel and USB debugging is enabled.
 +
# Having web project selected, open browser drop down menu and select Android Device (Chrome)
 +
# Invoke Run Project (F6)
 +
# Your web page is loaded in Mobile Chrome and you see live DOM in the NetBeans IDE
 +
 
 +
==iOS==
 +
Starting web project in iOS Simulator:
 +
# Having web project selected, open browser drop down menu and select iOS Simulator
 +
# Invoke Run Project (F6)
 +
# iOS Simulator is started and your web page is loaded in Mobile Safari and you can see live DOM in the NetBeans IDE.
 +
 
 +
Starting web project on iOS Device:
 +
# Make sure, that your iOS Device is connected to your Mac and Webkit Debugging is enabled in Mobile Safari Preferences.
 +
# Open Mobile Safari on your iOS Device
 +
# Having web project selected, open browser drop down menu and select iOS Device
 +
# Your web page is loaded in Mobile Safari on connected iOS Device. You see live DOM in the NetBeans IDE
 +
 
 +
 
 +
=PhoneGap=
 +
NetBeans 7.4 can build HTML5 project as native Android or iOS application.
 +
 
 +
 
 +
 
-
* iOS
 
-
# Available only on Mac
 
-
# install latest xcode from app store
 
-
# install command line tools and iOS Simulator SDK
 
-
* NetBeans
 
-
# Go to NetBeans Preferences | Misc Tab and setup PhoneGap and Android locations.
 
-
# Create a new HTML5 project
 
-
# There are new Mobile Configurations available in browser dropdown. you can open web app in mobile browser
 
-
# To run webkit debugging session on Android go to Project Properties. Select Run category and select Browser "Android Device" and bellow choose "Chrome" as Browser.
 
-
# You can go to Project Properties | PhoneGap and check [x] PhoneGap application. Now you can build and run native apps and deploy them to device
 
-
* Troubleshooting.
+
=Troubleshooting=
  Device is not recognised by NetBeans
  Device is not recognised by NetBeans
-
  ''>Run "adb devices" and check if the device is visible for android sdk
+
  ''>use command line and run "adb devices" and check if the device is visible for android sdk
-
  Web app is not opened in chrome, web address not available
+
  Web app is not opened in chrome or safari, web address not available
  ''>Your laptop and device must be on the same network. Check firewalls etc…''
  ''>Your laptop and device must be on the same network. Check firewalls etc…''

Revision as of 08:27, 12 June 2013

Contents


Introduction

NetBeans 7.4 supports HTML5 and JavaScript development for mobile devices (Android and iOS).

Requirements

Android

NetBeans 7.4 supports development, deploying, debugging and live CSS styling on Android devices. Debugging features are available only in Android 4.0+ with Mobile Chrome Web Browser. (Chrome is not available in Android Emulator) Setup Instructions:

  1. Install Android SDK from http://developer.android.com/sdk
  2. Enable USB debugging on Android Device
  3. Enable USB Web Debugging in Mobile Chrome

iOS

NetBeans 7.4 supports development, deploying, debugging and live CSS styling also on iOS Devices. Support for iOS is available only on Mac. Debugging is available for iOS 6.0+. Setup Instructions:

  1. Install XCode from Mac App Store
  2. Install command line tools and iOS Simulator SDK
  3. Enable WebKit Debugging on your iOS Device in mobile Safari Preferences.

PhoneGap

NetBeans 7.4 is able to build HTML5 project as PhoneGap application and deploy it to Android or iOS Device or Simulator. The IDE also supports live styling and debugging on iOS Device or Simulator. Setup Instructions:

  1. Download and install PhoneGap from http://www.phonegap.com

Mobile Browsers

NetBeans 7.4 can open any html page in mobile web browser.

Android

Starting web project on Android Device:

  1. Invoke Tools | Options | and specify android location
  2. Make sure, that your Android 4.0+ device is connected via USB cabel and USB debugging is enabled.
  3. Having web project selected, open browser drop down menu and select Android Device (Chrome)
  4. Invoke Run Project (F6)
  5. Your web page is loaded in Mobile Chrome and you see live DOM in the NetBeans IDE

iOS

Starting web project in iOS Simulator:

  1. Having web project selected, open browser drop down menu and select iOS Simulator
  2. Invoke Run Project (F6)
  3. iOS Simulator is started and your web page is loaded in Mobile Safari and you can see live DOM in the NetBeans IDE.

Starting web project on iOS Device:

  1. Make sure, that your iOS Device is connected to your Mac and Webkit Debugging is enabled in Mobile Safari Preferences.
  2. Open Mobile Safari on your iOS Device
  3. Having web project selected, open browser drop down menu and select iOS Device
  4. Your web page is loaded in Mobile Safari on connected iOS Device. You see live DOM in the NetBeans IDE


PhoneGap

NetBeans 7.4 can build HTML5 project as native Android or iOS application.




Troubleshooting

Device is not recognised by NetBeans
>use command line and run "adb devices" and check if the device is visible for android sdk
Web app is not opened in chrome or safari, web address not available
>Your laptop and device must be on the same network. Check firewalls etc…
Not logged in. Log in, Register

By use of this website, you agree to the NetBeans Policies and Terms of Use. © 2012, Oracle Corporation and/or its affiliates. Sponsored by Oracle logo