widget example

gistfile1.md

widgets/switchfield/views/widget.xml

<Alloy>
  <TableViewRow id="container">
    <Label id="label"/>
    <Switch id="switchControl" onChange="change"/>
  </TableViewRow>
</Alloy>

widgets/switchfield/controllers/widget.js

var args = arguments[0] || {};

var model, 
    id = args.id || args.title;
    
$.label.text = args.titleid ? L(args.titleid) : args.title || '';

function update_display() {
  $.switchControl.value = model && model.get(id);  
}

exports.model = function() {
  if (arguments.length > 0) {
    model = arguments[0];
    model.on('change:'+id, function() {
      update_display();
    });
    update_display();
  }
  return model;
};

function change(e) {
  model && model.set(id, $.switchControl.value);
}

widgets/switchfield/controllers/widget.tss

"#container": {
  height: "44dp"
},

"#label": {
  top: "2%",
  bottom: "2%",
  left: "2%",
  width: "30%",
  color: "#004080",
  textAlign: "right",
  font: {
    fontSize: "17dp"
  }
},

"#switchControl": {
  top: "2%",
  bottom: "2%",
  right: "2%",
  width: "60%",
  value: false /* or it won't be rendered */
}

widgets/switchfield/widget.json

{
  "id": "switchfield",
	"name": "Forms::Switch",
	"description" : "",
	"author": "Paul Mietz Egli",
	"version": "1.0",
	"copyright":"Copyright (c) 2012",
	"license":"Apache License 2",
	"min-alloy-version": "1.0",
	"min-titanium-version":"2.1",
	"tags":"",
	"platforms":"android,ios"
}