Appcelerator Titanium Mobile App Screens? - mobile

Question

I am trying to figure out how to make a multi-screen app using Appcelerator Titanium. I am familiar with Android development, so using the Android SDK I would create a few different activities, each doing their different work (login screen, screen displaying list of items, etc.) What is the equivalent in Titanium? I know that app.js is the main part of the app, but I assume it is not recommended to just put all code in that single file. The kitchen sink app has a lot of files and functionality, but I am not sure how they all fit together. So, what is the recommended way to create a project in Titanium for a basic app with a few screens doing different things? I am missing the Titanium concept of a screen.

Answer 1

no..
you can do it like
var button = Ti.UI.createButton({..});
button.addEventListener('click',function(e){
var window = Ti.UI.createWindow({
url:"../newWindow.js",
title:"newWindow"
});
Titanium.UI.currentTab.open(window,{animated:true});
});
i recommend to use the MVC-pattern like i already posted here.

Answer 2

App.js file is basically the file to initialize different window screens, and use Tabs to load those windows screens.Here is a link to create simple screens Create Window & Tabs
For further properties related to TitaniumUI

Answer 3

Try doing this:
app.js
Tintanium.include('window1.js', 'window2.js');
...
var button1 = Titanium.UI.createButton({...});
button1.addEventListener('click',function(){
window1.open();
});
window1.js
var window1=Titanium.UI.createWindow({...});
...etc...
Hope this will help ;)

Answer 4

try using my code below:
// functions
function openHomescreen(e)
{
settings.close();
getlucky.close();
survey.close();
homescreen.url = 'homescreen.js';
homescreen.open();
}
function openGetlucky(e)
{
settings.close();
homescreen.close();
getlucky.url = 'getlucky.js';
getlucky.open();
}
// events
Ti.App.addEventListener('homescreen',openHomescreen);
Ti.App.addEventListener('getlucky',openGetlucky);
openHomescreen({});
To open homescreen in other JS file, use this.
Ti.App.fireEvent('homescreen');

Answer 5

After a lot of time research i i found the solution for opening different windows with a click event attached to a button.
employee.js
//Current window (employee window)
var employeeWin = Ti.UI.currentWindow;
//define button
var moveToDetailBtn = Ti.UI.createButton({
width : 200, //define the width of button
height : 50, //define height of the button
title : 'Show Detail' //Define the text on button
});
//Click event to open the Employee Details window
moveToDetailBtn.addEventListener('click', function(){
//Call a export function
var win = require('employeeDetails').getEmployeeDetailSWin;
//Create new instance
var employeeDetailsWin = new win();
//Open the Employee Details window
employeeDetailsWin.open();
});
//Add the button to the window
employeeWin.add(moveToDetailBtn);
In employeeDetails.js
exports.getEmployeeDetailSWin = function(){
//Creates a new window
var empDetailsWin = Ti.UI.createWindow({
backgroundColor : '#ffffff' //Define the backgroundcolor of the window
});
//Addin a label to the window
empDetailsWin.add(Ti.UI.createLabel({
width : 100, //Define width of the label
height : 50, //Define height of the label
title : 'Employee Details'
}));
return empDetailsWin;
};
I found the solution in this page: http://www.mindfiresolutions.com/Open-New-Window-Without-URL-Property-In-Titanium-2214.php