The Appcelerator Studio LiveView tool displays updates of your application as you actively add, modify or replace the files in the project, such as changing your code in the Editor. LiveView LiveView should be used to quickly preview changes in your application's UI, not for code intensive modifications.
- In the Project Explorer view, select your project and verify that the LiveView icon is toggled on. If not, click the icon to toggle it on.
- In the global tool bartoolbar, select Run from the Launch Mode drop-down list and select an Android or iOS target (emulator, simulator or device) from the Target drop-down list.
- If the Launch Automatically option is enabled under the Target drop-down list, the application will be automatically launched after the device is selected. If If not, you need to click the Launch button to start the build process.
Studio starts the LiveView tool, which monitors changes to your project to update the application in the simulator or on device. In In the example below, the default mobile project is launched with LiveView enabled.
Once the application launches, you can make modifications to your project. LiveView LiveView waits for you to commit changes to your project before triggering an update.
- Modifying a file in the
Resourcesdirectory of the project. Graphic Graphic assets may not update automatically; you may need to rebuild your application.
- Adding a file to the
Resourcesdirectory of the project. TThe application may not be able to resolve the path to the new asset while its running; you may need to rebuild your application if you are adding files.
For example, in the default mobile application, the tab group starts with Tab 1. If If you were on Tab 2 when you committed commit your changes, the application restarts (but not relaunches) and displays Tab 1.
In the example below, the win1, tab1 and label1 objects have been modified. The The changes are committed when saving
app.js and displayed to the iOS simulator.
If there is a coding error in the changes, LiveView displays an error message in the simulator, device and in the Console view. In In the example below, the code contains a typo related to the name of a Label object and reports an error stating that it cannot find a reference to the variable. In In the code, a
myLabel object is created but is trying to add the
yourLabel object, which is not defined, to the window.
After adding a file and rebuilding, project fails to run
To resolve this issue, clean the project and terminate all node instances :
File Server unavailable
If you receive the following error message while running LiveView: "File Server unavailable. Host Unreachable @ <IP_ADDRESS>:<PORT_NUMBER>. Please ensure your device and computer are on the same network and the port is not blocked:"
Prevent Android devices from sleeping
If your Android device keeps turning off (entering into sleep mode), you can toggle the "Stay Awake" feature in the developer options.