Uploaded image for project: 'Titanium SDK/CLI'
  1. Titanium SDK/CLI
  2. TIMOB-18037

Parity: Handing of links in Attributed Strings for Label, TextField and TextArea

    Details

      Description

      Only for TextArea we have a 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

          Activity

            People

            • Assignee:
              Unassigned
              Reporter:
              fokkezb Fokke Zandbergen
            • Watchers:
              8 Start watching this issue

              Dates

              • Created:
                Updated:

                Backbone Issue Sync

                • Backbone Issue Sync is enabled for your project, but we do not have any synchronization info for this issue.

                  Git Integration