Login Page Design by titanium studio

 

Source Code :

 


    var mainWindow = Ti.UI.createWindow({
        backgroundColor:'#000000',       
    });

   
    //SELF VIEW
    var self = Ti.UI.createView({
        backgroundColor:'#000000',
        top:5,
        left:5,
        right:5,
        layout: 'vertical'
    });
   
    var contentView = Ti.UI.createView({
        backgroundColor:'#000000',
        top:5,
        left:5,
        right:5,
        layout: 'vertical',
        height:350,
    });
           
    var profile_title_view = Ti.UI.createView({
        backgroundColor : '#393C39',
        width : '100%',
        height : '25',
        top : 0,
    });
   
    var profile_label = Ti.UI.createLabel({
                text : 'User Login',
                color : 'white',
                font : {
                    fontSize : 16
                },
                height : Ti.UI.SIZE,
                width : Ti.UI.SIZE,
                top : 0,
                left : 5,
                textAlign : 'left'
            });

    profile_title_view.add(profile_label);
    contentView.add(profile_title_view);
   
    var username_lbl = Ti.UI.createLabel({
        text : 'Username',
        color : 'white',
        font : {
            fontSize : 16
        },
        height : Ti.UI.SIZE,
        width : Ti.UI.SIZE,
        top : 10,
        left : 5,
        textAlign : 'left'
    });
    contentView.add(username_lbl);
       
    var username = Titanium.UI.createTextField({
        borderWidth : 2,
        borderColor : '#bbb',
        borderRadius : 5,
        color : 'white',
        font : {
            fontSize : 20,
        },
        textAlign : 'left',
        value : '',
        top : 2,
        left : 5,
        right : 5,
        width : '95%',
        height : 40,
        backgroundColor : 'black',
        borderStyle : Titanium.UI.INPUT_BORDERSTYLE_ROUNDED,
        returnKeyType : Titanium.UI.RETURNKEY_DONE,
});
contentView.add(username);
 
var password_lbl = Ti.UI.createLabel({
        text : 'Password',
        color : 'white',
        font : {
            fontSize : 16
        },
        height : Ti.UI.SIZE,
        width : Ti.UI.SIZE,
        top : 10,
        left : 5,
        textAlign : 'left'
    });
    contentView.add(password_lbl);
 
var inputPassword = Titanium.UI.createTextField({       
        passwordMask:true,       
        borderWidth : 2,
        borderColor : '#bbb',
        borderRadius : 5,
        color : 'white',
        font : {
            fontSize : 20,
        },
        textAlign : 'left',   
        top : 2,
        left : 5,
        right : 5,
        width : '95%',
        height : 40,
        backgroundColor : 'black',
        borderStyle : Titanium.UI.INPUT_BORDERSTYLE_ROUNDED,
        returnKeyType : Titanium.UI.RETURNKEY_DONE,
});
contentView.add(inputPassword);
 
var loginBtn = Titanium.UI.createButton({
    title:'Login',
    top:20,
    width:200,
    height:35,
    borderRadius:1,
    font:{fontFamily:'Arial',fontWeight:'bold',fontSize:14}
});
contentView.add(loginBtn);

var signUpBtn = Titanium.UI.createButton({
    title:'Sign Up',
    top:20,
    width:200,
    height:35,
    borderRadius:1,
    font:{fontFamily:'Arial',fontWeight:'bold',fontSize:14}
});

contentView.add(signUpBtn);
 
signUpBtn.addEventListener('click',function(e)
{
    var RegistrationPage = require('ui/common/RegistrationPage');
    var user_registration_page = new RegistrationPage();
        user_registration_page.open();               
});   


self.add(contentView);
mainWindow.add(self);
mainWindow.open();
 

 

ScreenShot :

 



Tags : php,  mysql,  sourcecode,