Modifying Widgets In An Alloy Project

I have a widget which is a photo gallery. It's basic functionality means that it only allows the user to click on a thumbnail and then enlarge/de enlarge upon an onclick event. I n

Solution 1:

What I often do with custom widgets is adding a callback, so you can return values directly.

widget.xml

<Alloy><Buttontitle="Click me!"onTouchend="buttonClicked" /></Alloy>

widget.js

// This will hold our callbackvar onClickCallback;

// The button has been clicked, call callbackfunctionbuttonClicked(e) {
    if(typeof(onClickCallback) === 'function') {
        onClickCallback({ type:'clicked!' }); }
   }
}

// Assign our callbackfunctiononClick(callback) {
    onClickCallback = callback;
}

// Make the onClick function publicexports.onClick = onClick;

index.xml

<Alloy><Window><Widgetid="myWidget"src="myWidget" /></Window></Alloy>

index.js

// Now we can intercept the click within the widget// and use the values passed
$.myWidget.onClick(function(e) {
    alert(e.type);
});