Skip to content

Instantly share code, notes, and snippets.

@skypanther
Created September 1, 2011 21:48
Show Gist options
  • Save skypanther/1187384 to your computer and use it in GitHub Desktop.
Save skypanther/1187384 to your computer and use it in GitHub Desktop.
Draw gridlines in a Titanium window
// implement like this:
var window = Ti.UI.createWindow({
backgroundColor:'#fff'
});
// draw the gridlines first so your other elements stack on top of them
// without requiring you to set the z-index property of each
var grid = require('gridlines');
grid.drawgrid(10,window);
exports.drawgrid = function(gridspacing, win, color) {
// gridspacing = integer
// win = window to which the grid will be added
// color = optional color for lines
var clr = (color) ? color : '#dedede';
var numhoriz = Math.ceil(Ti.Platform.displayCaps.platformHeight / gridspacing);
var numvert = Math.ceil(Ti.Platform.displayCaps.platformWidth / gridspacing);
for(h=0; h<numhoriz;h++) {
var hline = Ti.UI.createView({
height:1,
width:'100%',
backgroundColor:clr,
top: h*gridspacing,
left:0
});
win.add(hline);
}
for(v=0; v<numvert;v++) {
var vline = Ti.UI.createView({
width:1,
height:'100%',
backgroundColor:clr,
left: v*gridspacing,
top:0
});
win.add(vline);
}
}
@thaikoh
Copy link

thaikoh commented Oct 20, 2014

I'm new to Titanium. Need help.
I put gridlines.js to controllers folder of my new app, then in index.js put two lines:
var grid = require('gridlines');
grid.drawgrid(20,win);
Try to run and got the error: Script Error Couldn't find module: gridlines.
What I'm doing wrong?

@wojtossfm
Copy link

Just to possibly leave some info here - as I understand gridlines.js should go into your alloy apps lib folder and not into the controllers folder.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment