Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-24352] iOS: Add MaskedImage, BlurView, LivePhotoView and and ButtonBar API's to ListView template types

GitHub Issuen/a
TypeBug
PriorityHigh
StatusClosed
ResolutionFixed
Resolution Date2017-04-04T21:51:01.000+0000
Affected Version/sRelease 6.0.1
Fix Version/sRelease 6.1.0
ComponentsiOS
Labelsios, listview, maskedimage, template
ReporterMathias Eklöf
AssigneeHans Knöchel
Created2017-01-28T15:45:01.000+0000
Updated2017-05-10T04:15:10.000+0000

Description

All of a sudden, I can't use MaskedImages inside a ListView template. This has never been an issue earlier. This happened from no where. It works perfectly fine in the Simulator, but not when I build to the device. It's super easy to replicate, just create a listview, put a template item which uses a MaskedImage.
 var spaceTemplate = function() {
     return {
         properties: {
             backgroundColor: "transparent",
             selectionStyle: Ti.UI.iOS.ListViewCellSelectionStyle.NONE,
             height: 10
         },
         childTemplates: [{
             type: 'Ti.UI.MaskedImage',
             properties: {
                 width: 20,
                 height: 20,
                 tint: '#FFFFFF',
                 image: "/path-to-image.png"
             }
         }]
     };
 };
*EDIT* by [~hansknoechel]: Changing ticket to also include other API's that are not available for ListView templates so far.

Comments

  1. Hans Knöchel 2017-01-29

    Hey Mathias, thanks for the ticket! I can think of what's wrong there, but do you know un which version this worked? This ticket might be a good candidate for 6.0.2 as well :-). *EDIT*: Looking at [this snippet](https://github.com/appcelerator/titanium_mobile/blob/6_0_X/iphone/cli/commands/_build.js#L6013-L6026), I'm wondering how this could ever have worked. Those lines describe the valid ListItem template types. It would be OK to add USE_TI_UIMASKEDIMAGE to that list, but that would be an improvement. If this worked in 5.5.x or 6.0.0, I'll check again.
  2. Mathias Eklöf 2017-01-29

    It has worked with all previous versions. I had this struggle previously with ScrollableView inside a listview, which all of a sudden stopped to work. But that "bug" was fixed a couple of versions ago. This occurs for me now with 6.0.1. I cant explain, but as I said, the exact thin happened earlier with scrollableview. Everything is fine in the simulator, as alwasy!
  3. Hans Knöchel 2017-01-29

    It was the same for the ScrollableView: It was not defined, so it was added. The "workaround" would be to use any Ti.UI.MaskedImage somewhere else. And I'm really sure that it did not work before, I diff'd the changes for that file back to 2015 (5.0.0.GA). Supporting it is no problem, but it's an improvement rather than a bug in that case.
  4. Mathias Eklöf 2017-01-29

    I understand! So is it possible to add it in the next release of the GA?
  5. Hans Knöchel 2017-01-29

    We can include it for 6.1.0 and also look out for other possible UI elements that could be considered in item templates. 6.0.2 would only match if it would be a regression for 6.0.0 / 6.0.1
  6. Mathias Eklöf 2017-01-29

    Okey, when do you think 6.1.0 will be GA released?
  7. Hans Knöchel 2017-01-29

    No final date so far, probably march. But you can patch your SDK today, just replace the above lines with
       			'#ifdef USE_TI_UILISTVIEW',
       			'#define USE_TI_UILABEL',
       			'#define USE_TI_UIBUTTON',
       			'#define USE_TI_UIIMAGEVIEW',
       			'#define USE_TI_UIPROGRESSBAR',
       			'#define USE_TI_UIACTIVITYINDICATOR',
       			'#define USE_TI_UISWITCH',
       			'#define USE_TI_UISLIDER',
       			'#define USE_TI_UITEXTFIELD',
       			'#define USE_TI_UITEXTAREA',
       			'#define USE_TI_UISCROLLABLEVIEW',
       			'#define USE_TI_UIIOSSTEPPER',
       			'#define USE_TI_UIPICKER',
       			'#define USE_TI_UIMASKEDIMAGE',
       			'#endif'
       
    in your SDK (~/Library/Application Support/Titanium/mobilesdk/osx/6.0.1.GA/iphone/cli/commands/_build.js).
  8. Mathias Eklöf 2017-01-29

    Cool, thanks!
  9. Hans Knöchel 2017-01-29

    PR: https://github.com/appcelerator/titanium_mobile/pull/8803 (Test-Case coming)
  10. Vijay Singh 2017-03-30

    [~hansknoechel] Test case ?
  11. Hans Knöchel 2017-03-30

    Basically any list-view template with the above elements as a child-template. I'll come up with something today then.
  12. Hans Knöchel 2017-03-31

    Test-case (to be built to device from the packaged SDK):
        var win = Ti.UI.createWindow({
            backgroundColor: '#fff'
        });
        
        var templates = {
        	'ButtonBarTemplate': {
        		childTemplates: [{
        			type: 'Ti.UI.ButtonBar',
        			properties: {
        				right: 10,
        				labels: ['One', 'Two', 'Three']
        			}
        		}]
        	},
        	'TabbedBarTemplate': {
        		childTemplates: [{
        			type: 'Ti.UI.iOS.TabbedBar',
        			properties: {
        				right: 10,
        				labels: ['One', 'Two', 'Three'],
        				index: 1
        			}
        		}]
        	},
        	'BlurViewTemplate': {
        		childTemplates: [{
        			type: 'Ti.UI.ImageView',
        			properties: {
        				right: 10,
        				image: Ti.UI.createView({height: 100, width: 100, backgroundColor: 'red'}).toImage()
        			}
        		}, {
        			type: 'Ti.UI.iOS.BlurView',
        			properties: {
        				effect: 0,
        				width: Ti.UI.FILL,
        				height: Ti.UI.FILL
        			}
        		}]
        	}
        };
        
        var list = Ti.UI.createListView({
        	templates: templates,
        	sections: [Ti.UI.createListSection({
        		items: [{
        			template: 'ButtonBarTemplate'
        		},{
        			template: 'TabbedBarTemplate'
        		},{
        			template: 'BlurViewTemplate',
        			properties: {
        				height: 100
        			}
        		}]
        	})]
        });
        
        win.add(list);
        win.open();
        
    Expected behavior: https://abload.de/img/simulatorscreenshot31chr92.png
  13. Eric Wieber 2017-04-04

    FR passed, using: MacOS 10.12 (16A323) Studio 4.8.1.201612050850 Ti SDK 6.1.0 Appc NPM 4.2.8 Appc CLI 6.1.0 Alloy 1.9.5 Xcode 8.3 (8E162) Tested using the provided test case as well as another case which included a ListView using each of the added templates
  14. Eric Wieber 2017-04-26

    Verified this fix is in 6.2.0.v20170426052901 but not the 6_1_X branch. Can there be a backport or a revision of the fix version, [~hansknoechel]?
  15. Hans Knöchel 2017-05-09

    PR (6_1_X): https://github.com/appcelerator/titanium_mobile/pull/9043
  16. Eric Wieber 2017-05-10

    Verified fix in in the 6.2.0 SDK mentioned above and in 6.1.0.v20170509170935.

JSON Source