For Download and install Titanium SDK ClickHere.
Create new project in Titanium Studio.
Now open app.js from Resource/app.js and do below code.
/*
* Single Window Application Template:
* A basic starting point for your application. Mostly a blank canvas.
*
* In app.js, we generally take care of a few things:
* - Bootstrap the application with any data we need
* - Check for dependencies like device type, platform version or network connection
* - Require and open our top-level UI component
*
*/
//bootstrap and check dependencies
if (Ti.version < 1.8 ) {
alert('Sorry - this application template requires Titanium Mobile SDK 1.8 or later');
}
// This is a single context application with mutliple windows in a stack
/*(function() {
//determine platform and form factor and render approproate components
var osname = Ti.Platform.osname,
version = Ti.Platform.version,
height = Ti.Platform.displayCaps.platformHeight,
width = Ti.Platform.displayCaps.platformWidth;
//considering tablet to have one dimension over 900px - this is imperfect, so you should feel free to decide
//yourself what you consider a tablet form factor for android
var isTablet = osname === 'ipad' || (osname === 'android' && (width > 899 || height > 899));
var Window;
if (isTablet) {
Window = require('ui/tablet/ApplicationWindow');
}
else {
// Android uses platform-specific properties to create windows.
// All other platforms follow a similar UI pattern.
if (osname === 'android') {
Window = require('ui/handheld/android/ApplicationWindow');
}
else {
Window = require('ui/handheld/ApplicationWindow');
}
}
new Window().open();
})();*/
Titanium.UI.setBackgroundColor('#fff');
var tabGroup = Titanium.UI.createTabGroup();
var login = Titanium.UI.createWindow({
title:'User Login',
tabBarHidden:true,
url:'main_windows/login.js'
});
var loginTab = Titanium.UI.createTab({
title:"User Login",
window:login
});
tabGroup.addTab(loginTab);
tabGroup.open();
Create new Folder in resource name "main_windows".
After that create new file in main_windows folder : resource/main_windows/login.js
put below code in login.js
var win = Titanium.UI.currentWindow;
var username = Titanium.UI.createTextField({
color:'#336699',
top:10,
width:200,
height:40,
hintText:'Enter Username',
keyboardType:Titanium.UI.KEYBOARD_DEFAULT,
returnKeyType:Titanium.UI.RETURNKEY_DEFAULT,
borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED
});
win.add(username);
var password = Titanium.UI.createTextField({
color:'#336699',
top:60,
width:200,
height:40,
hintText:'Enter Password',
center:'',
passwordMask:true,
keyboardType:Titanium.UI.KEYBOARD_DEFAULT,
returnKeyType:Titanium.UI.RETURNKEY_DEFAULT,
borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED
});
win.add(password);
var loginBtn = Titanium.UI.createButton({
title:'Login',
top:110,
width:90,
height:35,
borderRadius:1,
font:{fontFamily:'Arial',fontWeight:'bold',fontSize:14}
});
win.add(loginBtn);
var loginReq = Titanium.Network.createHTTPClient();
loginBtn.addEventListener('click',function(e)
{
if (username.value != '' && password.value != '')
{
alert("You are Login!");
}
else
{
alert("Username/Password are required");
}
});
now run this app into Android & iPhone device or Emulator, Simulator.
