Titanium.UI.iOS.PreviewContext

The example below creates a new preview context and assigns a window, actions and a contentHeight. After that, we assign the preview context to a view which will trigger the "peeking" of it. Note, that this is independent from the click event of the view itself.

var actions = [];
var win = Ti.UI.createWindow({
    backgroundColor: "white"
});

// The view to be previewed while popping.
var previewView = Ti.UI.createView({
    backgroundColor: "blue"
});

// The window to be opened after popping the preview.
var detailWindow = Ti.UI.createWindow({
    backgroundColor: "yellow"
});

detailWindow.add(Ti.UI.createLabel({
    text: "You made it!"
}));

// The actions to be added to the preview context.
var action = Ti.UI.iOS.createPreviewAction({
    title: "Preview Action",
    style: Ti.UI.iOS.PREVIEW_ACTION_STYLE_DEFAULT
});

action.addEventListener("click", function(e) {
    alert("Title: " + e.title + " / Style: " + e.style+" / Index: " + e.index);
});

var subAction = Ti.UI.iOS.createPreviewAction({
    title: "Preview Subaction"
})

subAction.addEventListener("click", function(e) {
    alert("Title: " + e.title + " / Style: " + e.style+" / Subindex: " + e.index);
});

var actionGroup = Ti.UI.iOS.createPreviewActionGroup({
    title: "More actions...",
    style: Ti.UI.iOS.PREVIEW_ACTION_STYLE_DESTRUCTIVE,
    actions: [subAction]
});

actions.push(action);
actions.push(actionGroup);

// Create the preview context
var context = Ti.UI.iOS.createPreviewContext({
    preview: previewView,
    actions: actions, // Can have both Ti.UI.iOS.PreviewAction + Ti.UI.iOS.PreviewActionGroup
        contentHeight: 300 // When unspecified, we use the available height
});

// Fired after popping the preview
context.addEventListener("pop", function(e) {
    detailWindow.open();
});

// Assign the preview context
var button = Ti.UI.createButton({
    previewContext: context, // Will be ignored on unsupported devices
    title : "Open Window!",
    backgroundColor: "#A6171C",
    width: 200,
    height: 50,
    tintColor: "#fff"
});

win.add(button);
win.open();

var actions = [];
var win = Ti.UI.createWindow({
    backgroundColor: "white"
});

// The view to be previewed while popping.
var previewView = Ti.UI.createView({
    backgroundColor: "blue"
});

// The window to be opened after popping the preview.
var detailWindow = Ti.UI.createWindow({
    backgroundColor: "yellow"
});

detailWindow.add(Ti.UI.createLabel({
    text: "You made it!"
}));

// The actions to be added to the preview context.
var action = Ti.UI.iOS.createPreviewAction({
    title: "Preview Action",
    style: Ti.UI.iOS.PREVIEW_ACTION_STYLE_DEFAULT
});

action.addEventListener("click", function(e) {
    alert(
        "Title: " + e.title +
        "\nStyle: " + e.style +
        "\nIndex: " + e.index +
        "\nSectionIndex: " + e.sectionIndex +
        "\nItemIndex: " + e.itemIndex
    );
});

actions.push(action);

// Create the preview context
var context = Ti.UI.iOS.createPreviewContext({
    preview: previewView,
    actions: actions, // Can have both Ti.UI.iOS.PreviewAction + Ti.UI.iOS.PreviewActionGroup
    contentHeight: 300 // When unspecified, we use the available height
});

// Fired after peeking the preview
// Use this event to configure the preview depending on the sectionIndex / itemIndex
context.addEventListener("peek", function(e) {
    Ti.API.warn("sectionIndex: " + e.sectionIndex);
    Ti.API.warn("itemIndex: " + e.itemIndex);
});

// Fired after popping the preview
context.addEventListener("pop", function(e) {
    detailWindow.open();
});

// Assign the preview context
var listView = Ti.UI.createListView({
    previewContext: context, // Will be ignored on unsupported devices
});

var section1 = Ti.UI.createListSection({
    headerTitle: "Section 1"
});

var section2 = Ti.UI.createListSection({
    headerTitle: "Section 2"
});

var items = [];

for(var i = 1; i <= 5; i++) {
    items.push({
        properties: {
            title: "Cell #" + i
        }
    });
}

section1.items = items;
section2.items = items;
listView.sections = [section1, section2];

win.add(listView);
win.open();