Skip to content

Instantly share code, notes, and snippets.

@alanleard
Created March 7, 2013 23:00
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save alanleard/5112651 to your computer and use it in GitHub Desktop.
Save alanleard/5112651 to your computer and use it in GitHub Desktop.
Sizing sample
var container = Ti.UI.createView({
height : Ti.UI.SIZE
});
var dashboardTileHolder = Ti.UI.createView({
top : 0,
layout : "vertical",
height : Ti.UI.SIZE
});
var tileHolder = Ti.UI.createView({
layout : "horizontal",
height : Ti.UI.SIZE,
left : 5
});
var leftTileView = Ti.UI.createView({
layout : "vertical",
backgroundColor : "#fff",
height : Ti.UI.SIZE,
width : '59%'
});
var userName = Ti.UI.createLabel({
top : '7dp',
//top:'5%',
left : 10,
textAlign : Titanium.UI.TEXT_ALIGNMENT_CENTER,
text : "This is my extra long username that should wrap",
color : "#444444",
height : Ti.UI.SIZE,
width : Ti.UI.FILL,
font : {
fontSize : 24,
fontFamily : "Arial"
}
});
var separator1 = Ti.UI.createView({
backgroundColor : "#ccc",
height : 1,
top : '3dp',
//top:'1%',
left : 10,
right : 13,
width : Ti.UI.FILL
});
var profileStatus = Ti.UI.createLabel({
top : '7dp',
//top:'4%',
text : "YOUR PROFILE IS % COMPLETE",
color : "#1DAFEC",
height : Ti.UI.SIZE,
width : Ti.UI.SIZE,
font : {
fontSize : 12,
fontFamily : "Arial"
}
});
var updateProfileLink = Ti.UI.createLabel({
top : 0,
text : "FILL OUT THE REST NOW",
color : "#1DAFEC",
height : Ti.UI.SIZE,
width : Ti.UI.SIZE,
font : {
fontSize : 12,
fontFamily : "Arial"
}
});
var pointValue = Ti.UI.createLabel({
top : '31dp',
//top: statusValue == 100 ? '11%' :'5%',
textAlign : Titanium.UI.TEXT_ALIGNMENT_CENTER,
text : "1000",
color : "#000",
height : Ti.UI.SIZE,
width : Ti.UI.FILL,
font : {
fontSize : 34,
fontFamily : "Arial"
}
});
var pointLabel = Ti.UI.createLabel({
top : 0,
textAlign : Titanium.UI.TEXT_ALIGNMENT_CENTER,
text : "AVAILABLE POINTS",
color : "#444444",
height : Ti.UI.SIZE,
width : Ti.UI.FILL,
font : {
fontSize : 15,
fontFamily : "Arial"
}
});
var pointUpdatedAt = Ti.UI.createLabel({
top : 0,
textAlign : Titanium.UI.TEXT_ALIGNMENT_CENTER,
text : "",
color : "#444444",
height : Ti.UI.SIZE,
width : Ti.UI.FILL,
font : {
fontSize : 11,
fontFamily : 'Helvetica Neue'
}
});
var earnPointLabel = Ti.UI.createLabel({
top : '27dp',
//top:statusValue == 100 ? '11%' :'5%',
text : "LEARN HOW TO EARN SHUKRAN POINTS",
color : "#1DAFEC",
height : Ti.UI.SIZE,
width : Ti.UI.SIZE,
font : {
fontSize : 12,
fontFamily : "Arial"
}
});
var rightTileView = Ti.UI.createView({
layout : "vertical",
height : '100%',
width : '41%',
top : 0
});
var offerTileLoading = Ti.UI.createView({
height : '49%'
});
var offerTile = Ti.UI.createView({
backgroundColor : "#1DAFEB",
top : 0,
left : 5,
right : 5,
width : Ti.UI.FILL,
layout : "vertical"
});
var offerBatchHolder = Ti.UI.createView({
top : '10%',
left : 10,
layout : "horizontal",
height : Ti.UI.SIZE,
width : Ti.UI.SIZE
});
var offerBatchValue = Ti.UI.createLabel({
text : "20",
top : -12,
color : "#fff",
height : Ti.UI.SIZE,
font : {
fontSize : 65,
fontFamily : "Arial"
}
});
var offerTileLabel = Ti.UI.createLabel({
//top:'4%',
top : -8,
left : 10,
text : 'offers',
color : "#fff",
height : Ti.UI.SIZE,
font : {
fontSize : 18,
fontFamily : "Arial"
}
});
var storeBatchHolder = Ti.UI.createView({
top : '10%',
left : 10,
layout : "horizontal",
height : Ti.UI.SIZE,
width : Ti.UI.SIZE
});
var storeBatchValue = Ti.UI.createLabel({
top : -12,
text : "20",
color : "#fff",
height : Ti.UI.SIZE,
font : {
fontSize : 65,
fontFamily : "Arial"
}
});
var storeBatchIcon = Ti.UI.createImageView({
left : 5,
top : 5,
height : 31,
width : 21,
backgroundColor:"pink"
});
var storeTile = Ti.UI.createView({
backgroundColor : "#0E79C9",
top : '2%',
bottom : 3,
height : '49%',
left : 5,
right : 5,
width : Ti.UI.FILL,
layout : "vertical",
});
var storeTileLabel = Ti.UI.createLabel({
//top:'4%',
top : -8,
left : 10,
text :'storesnearby',
color : "#fff",
height : Ti.UI.SIZE,
font : {
fontSize : 18,
fontFamily : "Arial"
}
});
var brandListView = Ti.UI.createView({
bottom : 50,
backgroundColor:"red",
//backgroundColor:'#red',
layout : "vertical",
height : 140,
top : 5,
left : 5,
right : 4
});
var brandListLabel = Ti.UI.createLabel({
top : 11,
text : 'SHUKRAN BRANDS',
color : "#444444",
height : Ti.UI.SIZE,
font : {
fontSize : 15,
fontFamily : "Arial"
}
});
var brandHeader = Ti.UI.createView({
top : 10,
height : 35,
width : 280,
backgroundColor:"blue"
});
var brandHeaderLabel = Ti.UI.createLabel({
left : 5,
text : "",
id : "",
textAlign : Titanium.UI.TEXT_ALIGNMENT_LEFT,
color : "#444444",
height : Ti.UI.SIZE,
width : Ti.UI.SIZE,
font : {
fontSize : '14',
fontFamily : 'Helvetica Neue'
}
});
var brandHolder = Ti.UI.createView({
top : 5,
height : 90,
width : Ti.UI.FILL
});
container.add(dashboardTileHolder);
dashboardTileHolder.add(tileHolder);
//tileHolder.add(rightTileView);
leftTileView.add(userName,separator1,profileStatus,updateProfileLink,pointValue,pointLabel,pointUpdatedAt,earnPointLabel);
tileHolder.add(leftTileView);
// leftTileView.add(separator1);
// leftTileView.add(profileStatus);
// leftTileView.add(updateProfileLink);
// leftTileView.add(pointValue);
// leftTileView.add(pointLabel);
// leftTileView.add(pointUpdatedAt);
// leftTileView.add(earnPointLabel);
rightTileView.add(offerTileLoading);
rightTileView.add(storeTile);
offerTileLoading.add(offerTile);
offerTile.add(offerBatchHolder,offerTileLabel);
//offerTile.add(offerTileLabel);
offerBatchHolder.add(offerBatchValue);
storeTile.add(storeBatchHolder);
storeBatchHolder.add(storeBatchValue,storeBatchIcon);
//storeBatchHolder.add(storeBatchIcon);
storeTile.add(storeTileLabel);
dashboardTileHolder.add(brandListView);
brandListView.add(brandListLabel,brandHeader, brandHolder);
//brandListView.add(brandHeader);
//brandListView.add(brandHolder);
brandHeader.add(brandHeaderLabel);
win.add(container);
setTimeout(function(){
rightTileView.height = tileHolder.size.height;
tileHolder.add(rightTileView);
}, 1);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment