[TIMOB-18499] TiAPI: Ti.UI.ATTRIBUTE_LINK needs to support click events
| GitHub Issue | n/a |
|---|---|
| Type | Improvement |
| Priority | Medium |
| Status | Reopened |
| Resolution | Unresolved |
| Affected Version/s | Release 3.5.0 |
| Fix Version/s | Release 4.0.0 |
| Components | iOS |
| Labels | TCSupport |
| Reporter | Shannon Hicks |
| Assignee | Unknown |
| Created | 2015-01-15T13:48:32.000+0000 |
| Updated | 2018-02-28T19:54:54.000+0000 |
Description
Is it possible that Ti.UI.ATTRIBUTE_LINK could respond to click events in addition to longpress? It is difficult to explain to users that they see something that looks clickable, but no, they need to longpress it. We end up having to use StyledLabel modules to get this working.
I didn't flag this as iOS or Android because it should be implemented for both, now that Android supports attributed strings TIMOB-15998
Test case
var win = Ti.UI.createWindow({ backgroundColor: '#ddd', fullscreen:true, layout:'vertical' }); var text = 'Tap on any of the following:\n1.Appcelerator Titanium \t2.Android \t3.IOS'; var attr = Ti.UI.createAttributedString({ text: text, attributes: [ { type: Ti.UI.ATTRIBUTE_LINK, value: 'http://www.appcelerator.com/developers/', range: [text.indexOf('Appcelerator Titanium'), ('Appcelerator Titanium').length] }, { type: Ti.UI.ATTRIBUTE_FONT, value: {textStyle:Ti.UI.TEXT_STYLE_HEADLINE}, range: [text.indexOf('Appcelerator'), ('Appcelerator').length] }, { type: Ti.UI.ATTRIBUTE_FONT, value: {textStyle:Ti.UI.TEXT_STYLE_SUBHEADLINE}, range: [text.indexOf('Titanium'), ('Titanium').length] }, { type: Ti.UI.ATTRIBUTE_LINK, value: 'http://developer.android.com/', range: [text.indexOf('Android'), ('Android').length] }, { type: Ti.UI.ATTRIBUTE_FONT, value: {textStyle:Ti.UI.TEXT_STYLE_CAPTION1}, range: [text.indexOf('Android'), ('Android').length] }, { type: Ti.UI.ATTRIBUTE_LINK, value: 'https://developer.apple.com/', range: [text.indexOf('IOS'), ('IOS').length] }, { type: Ti.UI.ATTRIBUTE_FONT, value: {textStyle:Ti.UI.TEXT_STYLE_CAPTION1}, range: [text.indexOf('IOS'), ('IOS').length] }, ] }); var label = Ti.UI.createLabel({ backgroundColor: '#ccc', attributedString: attr, }); label.addEventListener('link',function(e){ alert(e.url); }) var container1 = Ti.UI.createView({width:Ti.UI.SIZE,height:Ti.UI.SIZE,layout:'horizontal'}); var b11 = Ti.UI.createButton({title:' W 200 '}); var b12 = Ti.UI.createButton({title:' W 300 '}); var b13 = Ti.UI.createButton({title:' W SIZE '}); container1.add(b11); container1.add(b12); container1.add(b13); var container2 = Ti.UI.createView({width:Ti.UI.SIZE,height:Ti.UI.SIZE,layout:'horizontal'}); var b21 = Ti.UI.createButton({title:' H 200 '}); var b22 = Ti.UI.createButton({title:' H 300 '}); var b23 = Ti.UI.createButton({title:' H SIZE '}); container2.add(b21); container2.add(b22); container2.add(b23); var container3 = Ti.UI.createView({width:Ti.UI.SIZE,height:Ti.UI.SIZE,layout:'horizontal'}); var b31 = Ti.UI.createButton({title:' Vert C '}); var b32 = Ti.UI.createButton({title:' Vert T '}); var b33 = Ti.UI.createButton({title:' Vert B '}); container3.add(b31); container3.add(b32); container3.add(b33); var container4 = Ti.UI.createView({width:Ti.UI.SIZE,height:Ti.UI.SIZE,layout:'horizontal'}); var b41 = Ti.UI.createButton({title:' Hor L '}); var b42 = Ti.UI.createButton({title:' Hor C '}); var b43 = Ti.UI.createButton({title:' Hor R '}); container4.add(b41); container4.add(b42); container4.add(b43); //vertical = {center:0,top:1,bottom:2} //horizontal = {left:0,center:1,right:2} function clickHandler(e){ if (e.source == b11) { label.width = 200; } if (e.source == b12) { label.width = 300; } if (e.source == b13) { label.width = Ti.UI.SIZE; } if (e.source == b21) { label.height = 200; } if (e.source == b22) { label.height = 300; } if (e.source == b23) { label.height = Ti.UI.SIZE; } if (e.source == b31) { label.verticalAlign = 0; } if (e.source == b32) { label.verticalAlign = 1; } if (e.source == b33) { label.verticalAlign = 2; } if (e.source == b41) { label.textAlign = 0; } if (e.source == b42) { label.textAlign = 1; } if (e.source == b43) { label.textAlign = 2; } } win.addEventListener('click',clickHandler); win.add(label); win.add(container1); win.add(container2); win.add(container3); win.add(container4); win.open();Changing to TiAPI as requested by Shannon.
looks like the test case needs tweaking... createAttributedString has been moved to
Titanium.UI.createAttributedStringin 4.0.0 [https://github.com/appcelerator/titanium_mobile/blob/124852b1b7def38a37e565cacff067bca3dcdd65/apidoc/Titanium/UI/iOS/Attribute.yml#L5] via TIMOB-15998Pull pending master - https://github.com/appcelerator/titanium_mobile/pull/6653
@vduggal The PR only addresses iOS. That doesn't Resloved/Fixed this ticket. It only creates another iOS/Android parity issue.
@[~iotashan] The Android work is done in a separate task as a new feature.
Do you have the JIRA ticket for that handy? I couldn't find one that specifically calls this out or shows a test case for it.
@[~iotashan] See TIMOB-18608
Verified fixed using: Titanium SDK 4.0.0.v20150311105810 Studio 4.0.0.201503062102 CLI 3.4.2 Xcode 6.2 Node 0.10.36 On: Galaxy Note 2, Android 4.3 iPhone 6, iOS 8.2 Click and Longpress events correctly fired.