RepeatBox Guide

activeitem.js

rBox.useActiveItem = true;

autosize.js

repeatBox1.autoSize = true;

basics.js

var rBox = new SMF.UI.RepeatBox({
		width : "100%",
		height : "100%",
		left : 0,
		top : 0,
		showScrollbar : true,
		fillColor : "#3B3B3B"
	});
Pages.Page1.add(rBox);

binding.js

Data.execute("DROP TABLE IF EXISTS testtable;");
Data.execute("Create table testtable (col1 string)");
Data.execute("insert into testtable values('My first row');");
Data.execute("insert into testtable values('Smartface.Inc');");
Data.execute("insert into testtable values('Smartface App Studio');");
Data.dynamicDS = new Data.Dataset({
		selectQuery : "select * from testtable"
	});
Data.dynamicDS.refresh();

codeblock.js

var myDataSource = [{
		row : "First Row"
	}, {
		row : "Second Row"
	}, {
		row : "Third Row"
	}
];
var lbl = new SMF.UI.Label({
		top : "0%",
		left : "0%",
		width : "100%",
		height : "100%",
		fillColor : "#FFFFFF",
		textAlignment : SMF.UI.TextAlignment.center
	});
var repeatBox1 = new SMF.UI.RepeatBox({
		width : "60%",
		height : "50%",
		left : "20%",
		top : "25%",
		showScrollbar : true,
		fillColor : "white",
		backgroundTransparent : true
	});
repeatBox1.dataSource = myDataSource;
repeatBox1.onRowRender = function (e) {
	this.controls[0].text = myDataSource[e.rowIndex].row;
};
repeatBox1.onSelectedItem = function (e) {
	alert("Selected " + (e.rowIndex + 1) + ". row");
};

repeatBox1.onRowDeleting = function (e) {
	if (e.rowIndex === 0) {
		alert("first row is deleted...");
	}
};

repeatBox1.itemTemplate.height = Device.screenHeight / 7;
repeatBox1.itemTemplate.imageFillType = SMF.UI.ImageFillType.stretch;
repeatBox1.itemTemplate.add(lbl);

Pages.Page1.add(repeatBox1);

datasource.js

repeatBox1.dataSource = myDataSource;
repeatBox1.onRowRender = function (e) {
	this.controls[0].text = myDataSource[e.rowIndex].row;
};

groupitems.js

rBox.groupItems = true;

height.js

repeatBox1.itemTemplate.height = Device.screenHeight / 7;

label.js

var lbl = new SMF.UI.Label({
		top : "0%",
		left : "0%",
		width : "100%",
		height : "100%",
		fillColor : "#FFFFFF",
		textAlignment : SMF.UI.TextAlignment.center
	});

object.js

var myDataSource = [{
		row : "First Row"
	}, {
		row : "Second Row"
	}, {
		row : "Third Row"
	}
];

pulldown.js

rBox.enablePullDownToRefresh = true;

pullup.js

rBox.enablePullUpToRefresh = true;

repeatbox.js

var repeatBox1 = new SMF.UI.RepeatBox({
		name : "repeatBox1",
		width : "60%",
		height : "50%",
		left : "20%",
		top : "25%",
		dataSource : Data.dynamicDS,
		showScrollbar : true,
		fillColor : "white",
		backgroundTransparent : true,
		onRowRender : function (e) {
			Data.dynamicDS.seek(e.rowIndex);
			this.controls[0].text = Data.dynamicDS.col1;
		}
	});
repeatBox1.itemTemplate.height = Device.screenHeight / 7;
repeatBox1.itemTemplate.imageFillType = SMF.UI.ImageFillType.stretch;
//Adding label to repeatBox object
repeatBox1.itemTemplate.add(lbl);
Pages.Page1.add(repeatBox1);

showheader.js

rBox.showHeader = true;

swipe.js

var itemDelete = new SMF.UI.RepeatBoxSwipeItem({
		width : 50,
		height : "100%",
		left : repeatBox1.width - 50,
		top : 0,
		text : "Delete",
		fontColor : "#dddddd",
		fillColor : "#ff0000",
		onSelected : function (e) {
			alert("Delete button pressed for the row: " + e.rowIndex);
		}
	});
var itemMore = new SMF.UI.RepeatBoxSwipeItem({
		width : 50,
		height : "100%",
		x : "50%",
		y : 0,
		onSelected : function (e) {
			alert("Pressed!");
		}
	});
var items = [itemDelete, itemMore];
repeatBox1.setSwipeItems(items);