[TIMOB-19335] iOS: ListView editActions specify better action

GitHub Issue	n/a
Type	Improvement
Priority	Medium
Status	Closed
Resolution	Fixed
Resolution Date	2016-06-30T19:00:25.000+0000
Affected Version/s	n/a
Fix Version/s	Release 6.0.0
Components	iOS
Labels	editActions, listview, qe-6.0.0
Reporter	Sebastian Klaus
Assignee	Hans Knöchel
Created	2015-06-30T10:40:25.000+0000
Updated	2016-09-29T16:53:47.000+0000

Description

Since 4.1.0.Beta we got a really super-duper feature: https://docs.appcelerator.com/platform/latest/#!/guide/ListViews-section-37521650_ListViews-ActionItems But one thing is not really charming. The listener for which action is pressed by the user has to be the title of the edit button? That seems very untypical. *Existing example*

var win = Ti.UI.createWindow({backgroundColor: 'white'}),
    favoriteAction = {
        title: 'Favorite',
        style: Ti.UI.iOS.ROW_ACTION_STYLE_DEFAULT
    },
    unfavoriteAction = {
        title: 'Unfavorite',
        style: Ti.UI.iOS.ROW_ACTION_STYLE_NORMAL
    },
    data = [
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Kitten Whiskers'}},
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Copper Kettle'}},
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Woolen Mittens'}},
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Apple Strudel'}},
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Brown Packages'}},
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Dog Bites'}},
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Bee Stings'}}
    ],
    listSection = Ti.UI.createListSection({
        items: data
    }),
    listView = Ti.UI.createListView({
        top: 15,
        sections: [listSection]
    });
listView.addEventListener('editaction', function(e) {
    var item = e.section.getItemAt(e.itemIndex)
    if (e.action === 'Favorite') {
        item.properties.editActions = [unfavoriteAction];
    } else if (e.action === 'Unfavorite') {
        item.properties.editActions = [favoriteAction];
    }
    e.section.updateItemAt(e.itemIndex, item);
});
 
win.add(listView);
win.open();

*Should be example*

var win = Ti.UI.createWindow({backgroundColor: 'white'}),
    favoriteAction = {
    	action: 'setFavorite',
        title: 'Favorite',
        style: Ti.UI.iOS.ROW_ACTION_STYLE_DEFAULT
    },
    unfavoriteAction = {
    	action: 'unsetFavorite',
        title: 'Unfavorite',
        style: Ti.UI.iOS.ROW_ACTION_STYLE_NORMAL
    },
    data = [
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Kitten Whiskers'}},
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Copper Kettle'}},
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Woolen Mittens'}},
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Apple Strudel'}},
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Brown Packages'}},
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Dog Bites'}},
        {properties: {canEdit: true, editActions: [favoriteAction], title: 'Bee Stings'}}
    ],
    listSection = Ti.UI.createListSection({
        items: data
    }),
    listView = Ti.UI.createListView({
        top: 15,
        sections: [listSection]
    });
listView.addEventListener('editaction', function(e) {
    var item = e.section.getItemAt(e.itemIndex)
    if (e.action === 'setFavorite') {
        item.properties.editActions = [unfavoriteAction];
    } else if (e.action === 'unsetFavorite') {
        item.properties.editActions = [favoriteAction];
    }
    e.section.updateItemAt(e.itemIndex, item);
});
 
win.add(listView);
win.open();

As you see, the developer can define the action himself. Otherwise I have to compare on localized strings. That's not a good coding behavior . What do you think?

Comments

Be Rushton 2016-04-08

I'd like to see this too.
Hans Knöchel 2016-06-29

Hey [~benutzername], good improvement! 90 % agree, but can we name it identifier instead of action? to have parity with other identifier-based API's? -I also noticed, that we don't have a Ti.UI.iOS.ListViewEditAction proxy that would ease the additional property immense. So currently I'm trying to extend the current UI-element by the identifier, but that's a mess. We should introduce the proxy for 6.0.0 / 6.1.0 ^^- EDIT: That's way too much overhead for that API. Figured it out more easy.
Sebastian Klaus 2016-06-29

I agree with _identifier_

Hans Knöchel 2016-06-29

PR: https://github.com/appcelerator/titanium_mobile/pull/8097 Demo:

   var win = Ti.UI.createWindow({backgroundColor: 'white'}),
       favoriteAction = {
       	identifier: 'setFavorite',
           title: 'Favorite',
           style: Ti.UI.iOS.ROW_ACTION_STYLE_DEFAULT
       },
       unfavoriteAction = {
       	identifier: 'unsetFavorite',
           title: 'Unfavorite',
           style: Ti.UI.iOS.ROW_ACTION_STYLE_NORMAL
       },
       data = [
           {properties: {canEdit: true, editActions: [favoriteAction], title: 'Kitten Whiskers'}},
           {properties: {canEdit: true, editActions: [favoriteAction], title: 'Copper Kettle'}},
           {properties: {canEdit: true, editActions: [favoriteAction], title: 'Woolen Mittens'}},
           {properties: {canEdit: true, editActions: [favoriteAction], title: 'Apple Strudel'}},
           {properties: {canEdit: true, editActions: [favoriteAction], title: 'Brown Packages'}},
           {properties: {canEdit: true, editActions: [favoriteAction], title: 'Dog Bites'}},
           {properties: {canEdit: true, editActions: [favoriteAction], title: 'Bee Stings'}}
       ],
       listSection = Ti.UI.createListSection({
           items: data
       }),
       listView = Ti.UI.createListView({
           top: 15,
           sections: [listSection]
       });
   listView.addEventListener('editaction', function(e) {
       var item = e.section.getItemAt(e.itemIndex)
       if (e.identifier === 'setFavorite') {
           item.properties.editActions = [unfavoriteAction];
       } else if (e.identifier === 'unsetFavorite') {
           item.properties.editActions = [favoriteAction];
       }
       e.section.updateItemAt(e.itemIndex, item);
   });
    
   win.add(listView);
   win.open();

Harry Bryant 2016-09-29

Verified as fixed, identifier can be set to define the action, as opposed to the title. Tested On: iPhone 6 Plus 10.0.2 Device iPhone 5S 9.3.5 Device Mac OSX El Capitan 10.11.6 Ti SDK: 6.0.0.v20160929031439 Appc Studio: 4.8.0.201609232005 Appc NPM: 4.2.8-7 App CLI: 6.0.0-54 Xcode 8.0 Node v4.4.7 *Closing ticket.*

JSON Source