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

Android: AttributedString link underline color

    Details

    • Type: Bug
    • Status: Closed
    • Priority: Critical
    • Resolution: Fixed
    • Affects Version/s: Release 6.0.4, Release 7.0.1, Release 7.1.1
    • Fix Version/s: Release 10.0.0
    • Component/s: None
    • Environment:

      1. MacOS Sierra 10.12
      2. Appcelerator Studio, build: 4.8.1.201612050850
      3. Titanium SDK: 6.0.4
      4. Titanium CLI version: 5.0.12
      5. Xcode 6.1

    • Story Points:
      5
    • Sprint:
      2021 Sprint 4

      Description

      Problem description

      When trying to change ATTRIBUTE_UNDERLINE_COLOR of a link AttributedString, on Android does not change anything, on iOS it is working.

      This is a problem if you need to keep the link on a label but without the underline (just like ClickableSpan on native), on iOS just set the underline color to "transparent" works.

      The attachment screenshots show how the second label on iOS has transparent color, while on Android it keeps the same color as the ATTRIBUTE_FOREGROUND_COLOR.

      Trying to not set the underline attribute also causes the same effect.

      Steps to reproduce

      1. Create a new mobile project classic titanium
      2. Add this code to app.js:

      var win = Ti.UI.createWindow({
      	layout : 'vertical'
      });
       
      win.add(createLabel());
       
      var lbl = createLabel();
      colorLinks(lbl.attributedString);
      win.add(lbl);
       
      win.open();
       
      function createLabel() {
       
      	var label = Ti.UI.createLabel({
      		top : 50,
      		attributedString : Ti.UI.createAttributedString({
      			text : 'Check out the Appcelerator Developer Portal',
      			attributes : [{
      				type : Ti.UI.ATTRIBUTE_LINK,
      				value : 'https://developer.appcelerator.com',
      				range : [14, 29]
      			}]
      		})
      	});
       
      	label.addEventListener('link', function(e) {
      		Ti.Platform.openURL(e.url);
      	});
       
      	return label;
      }
       
      function colorLinks(as) {
      	var colorText = '#CD1625';
      	//var colorUnderline = "#FFFFFF";
      	var colorUnderline = "transparent";
       
      	as.attributes.forEach(function(attribute) {
       
      		if (attribute.type === Ti.UI.ATTRIBUTE_LINK) {
       
      			as.addAttribute({
      				type : Ti.UI.ATTRIBUTE_FOREGROUND_COLOR,
      				value : colorText,
      				range : attribute.range
      			});
      			
      			// This is not working on Android
      			as.addAttribute({
      				type : Ti.UI.ATTRIBUTE_UNDERLINE_COLOR,
      				value : colorUnderline,
      				range : attribute.range
      			});
      		}
      	});
       
      	return as;
      }
      
      

      3. Run in a device or simulator

      Actual results

      Android does not change the color of the link, it just takes the default link color or the ATTRIBUTE_FOREGROUND_COLOR

      Expected results

      Being able to change underline color of the links or just keep the link without any underline, like CSS text-decoration property.

        Attachments

          Activity

            People

            • Assignee:
              gmathews Gary Mathews
              Reporter:
              pperuga Patricia Peruga
              Reviewer:
              Joshua Quick
              Tester:
              Satyam Sekhri
            • Watchers:
              8 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:

                Backbone Issue Sync

                • Titanium SDK/CLI <> Titanium Mobile
                  Synced with:
                  TIMOB-10722
                  Sync status:
                  ERROR
                  Last received:
                  Last sent:

                  Git Integration