Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-18037] Parity: Handing of links in Attributed Strings for Label, TextField and TextArea

GitHub Issuen/a
TypeImprovement
PriorityNone
StatusOpen
ResolutionUnresolved
Affected Version/sRelease 3.4.1
Fix Version/sn/a
ComponentsiOS
LabelsTCSupport, attributedString, label, links, textarea, textfield
ReporterFokke Zandbergen
AssigneeUnknown
Created2014-11-12T13:50:18.000+0000
Updated2018-02-28T19:54:54.000+0000

Description

Only for TextArea we have a property [handleLinks](http://docs.appcelerator.com/titanium/latest/#!/api/Titanium.UI.TextArea-property-handleLinks) which if set to true fires the link event for a single-tap on a link in an Attributed String. - For Label only a long-press can trigger this event, making a poor UX. - For TextField there's no such event at all, making the attribute type useless. - For TextArea the link has a different color, no underline and a tap will always open the URL in Safari before firing the link event, allowing no custom actions. Also, the documentation does not inform you about the need for editable to be set to false to capture link events.

Test case

var win = Titanium.UI.createWindow({
  backgroundColor: '#ddd',
});

var label = Ti.UI.createLabel({
  top: 100,
  attributedString: Ti.UI.iOS.createAttributedString({
    text: 'Appcelerator as Label (long press)',
    attributes: [{
      type: Ti.UI.iOS.ATTRIBUTE_LINK,
      value: 'http://www.appcelerator.com',
      range: [0, 12]
    }]
  })
});

// will only fire on long press
label.addEventListener('link', function(e) {
  alert(e.url);
});

var textField = Ti.UI.createTextField({
  top: 200,
  editable: false,
  attributedString: Ti.UI.iOS.createAttributedString({
    text: 'Appcelerator as TextField (long press)',
    attributes: [{
      type: Ti.UI.iOS.ATTRIBUTE_LINK,
      value: 'http://www.appcelerator.com',
      range: [0, 12]
    }]
  })
});

// no such event available for TextField
textField.addEventListener('link', function(e) {
  alert(e.url);
});

var textArea = Ti.UI.createTextArea({
  top: 300,
  handleLinks: true,
  editable: false,
  attributedString: Ti.UI.iOS.createAttributedString({
    text: 'Appcelerator as TextArea with handleLinks:true (single tap)',
    attributes: [{
      type: Ti.UI.iOS.ATTRIBUTE_LINK,
      value: 'http://www.appcelerator.com',
      range: [0, 12]
    }]
  })
});

// fires on single tap
textArea.addEventListener('link', function(e) {

  // has no effect, will always open URL in Safari and show alert when you come back
  e.cancelBubble = true;

  alert(e.url);
});

win.add(label);
win.add(textField);
win.add(textArea);

win.open();

Suggested changes:

* Bring handleLinks to TextField and Label * Let handleLinks automatically set editable to false. * Use the same color and underlining of links in TextAreas as in TextFields and Labels.

Attachments

FileDateSize
iOS Simulator Screen Shot 12 Nov 2014 14.49.50.png2014-11-12T13:50:18.000+000047034

Comments

  1. Pier Paolo Ramon 2014-11-12

    This is almost impossible to work around without doing (very) nasty stuff on the native side. Instant watch.

JSON Source