[TIMOB-19488] iOS9: 3D-Touch: Support UIPreviewActions ("Peek and Pop")
GitHub Issue | n/a |
---|---|
Type | New Feature |
Priority | Medium |
Status | Closed |
Resolution | Fixed |
Resolution Date | 2015-10-08T01:09:14.000+0000 |
Affected Version/s | n/a |
Fix Version/s | Release 5.1.0 |
Components | iOS |
Labels | 3DTouch, iOS9 |
Reporter | Hans Knöchel |
Assignee | Hans Knöchel |
Created | 2015-09-09T23:13:10.000+0000 |
Updated | 2015-10-27T07:48:17.000+0000 |
Description
Apple just presented the new 3DTouch feature of the iPhone6S. User can press a view and will review an instant feedback providing a preview of a view to select different actions, called
UIPreviewAction
. Each action have a title
, style
and handler
property. Multiple actions can also be assigned to UIPreviewActionGroup
. That group can have have a title
, style
and actions
property to keep track of the assigned actions.
*Related documents:*
- https://developer.apple.com/library/prerelease/ios/documentation/UIKit/Reference/UIPreviewAction_Class/
- https://developer.apple.com/library/prerelease/ios/documentation/UIKit/Reference/UIPreviewActionGroup_Class/
*Example:*
var sendAction = Ti.UI.iOS.createPreviewAction({
title : "Send per Mail",
style : Ti.UI.iOS.PREVIEW_ACTION_STYLE_DEFAULT
});
sendAction.addEventListener("click", function() {
alert("send mail!");
});
var confirmAction = Ti.UI.iOS.createPreviewAction({
title : "Confirm",
style : Ti.UI.iOS.PREVIEW_ACTION_STYLE_DESTRUCTIVE
});
var cancelAction = Ti.UI.iOS.createPreviewAction({
title : "Cancel"
});
var deleteAction = Ti.UI.iOS.createPreviewActionGroup({
title : "Delete",
actions : [confirmAction, cancelAction],
style : Ti.UI.iOS.PREVIEW_ACTION_STYLE_DESTRUCTIVE
});
confirmAction.addEventListener("click", function() {
alert("delete!");
});
var win = Ti.UI.createWindow({
backgroundColor : "white"
});
// The view to be previewed while popping.
var previewView = Ti.UI.createView({
backgroundColor : "blue"
});
previewView.add(Ti.UI.createLabel({
color : "#fff",
text : "Preview!"
}));
// 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!"
}));
// Create the preview context
var context = Ti.UI.iOS.createPreviewContext({
preview : previewView,
actions : [sendAction, deleteAction], // Can have both Ti.UI.iOS.PreviewAction + Ti.UI.iOS.PreviewActionGroup
contentHeight : 100, // When unspecified, we use the available height
pop : function(e) {// Called after popping the preview
detailWindow.open();
}
});
// Assign the preview context
var trigger = Ti.UI.createButton({
title: "Peek here!",
backgroundColor : "#000",
tintColor: "#fff",
width : 200,
height : 50,
previewContext : context
});
win.add(trigger);
win.open();
Attachments
File | Date | Size |
---|---|---|
Peek-And-Pop.jpg | 2015-09-22T17:27:52.000+0000 | 478799 |
Screen Shot 2015-09-15 at 19.53.07.png | 2015-09-16T02:56:27.000+0000 | 559001 |
PR: https://github.com/appcelerator/titanium_mobile/pull/7235
PR approved and merged.
Building on device and for iTunes Store (just testing the build) fails.
Verified as fixed,
UIPreviewAction
features working as intended, built to device & for the iTunes Store successfully. Tested on: iPhone 6S + OSX El Capitan 10.11 Studio: 4.3.1.201509302304 Ti SDK: 5.1.0.v20151009094506 Appc NPM: 4.2.1-1 Appc CLI: 5.1.0-38 Closing Ticket.Wondering, how I can gain a preview of a listitem. I have to initially set the previewView, but I know it only, when I clicked on a listitem and have the id. I studied your listView example in https://github.com/hansemannn/titanium_mobile/blob/46a5fcaf10c3aaa4b07b7351da737c57660a171a/apidoc/Titanium/UI/iOS/PreviewContext.yml but I have no idea how to fill the preview with fetched content from the listitem or the listitem index id
uh wait... it's the described in the Ti.UI.iOS.createPreviewContext... :facepalm: First think, then write... Sorry ;)
Hello [~hansknoechel], played around and think, that it's not working completely. I copied your example for integrating in a listview. I never get the Ti.API.warn messages. So, I think I never get into the pop function from your example. What I want to do is: Having a listview. On preview, I want to show a detailview with some information out of the database. But how do I fill the previewView with some new content? I never get into the detailWindow.open of your example
[~benutzername]: It is currently not possible to provide a cell-specific preview, because the current KrollThread implementation of the core does not allow returning a proxy inside a KrollCallback. This issue is tracked in TIMOB-19763.
[~hansknoechel] is that the reason, the example in the docs does not work and is not coming into the pop function?