Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-24735] Android: AttributedString link underline color

GitHub Issuen/a
TypeBug
PriorityCritical
StatusClosed
ResolutionFixed
Resolution Date2021-02-19T15:02:35.000+0000
Affected Version/sRelease 6.0.4, Release 7.0.1, Release 7.1.1
Fix Version/sRelease 10.0.0
Componentsn/a
Labelsandroid, attributedString, parity
ReporterPatricia Peruga
AssigneeGary Mathews
Created2017-05-23T15:43:33.000+0000
Updated2021-02-19T15:02:45.000+0000

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

FileDateSize
screenshot-2017-05-23_17.37.09.918.png2017-05-23T15:37:54.000+000059047
Simulator Screen Shot 23 May 2017, 17.35.45.png2017-05-23T15:36:13.000+000046697

Comments

  1. Sharif AbuDarda 2017-05-25

    I can reproduce the issue for Android. Tested with SDK 6.0.4.GA.
  2. Michael Gangolf 2018-01-16

    Same for 7.0.1.GA Here is a short example on how to add color in an Android app: https://stackoverflow.com/a/43584166/5193915 Should work in Ti too (place to add it: https://github.com/appcelerator/titanium_mobile/blob/b758504ce898d0e93e461849cbb8975283da85bc/android/modules/ui/src/java/ti/modules/titanium/ui/AttributedStringProxy.java#L202)
  3. Simon Buckingham 2018-06-05

    I have the same problem. testing in Ti SDK 7.1.1 GA. With Android 4.3 and 7.1.
  4. Sohail Saddique 2021-02-03

    Issue still exists today, under 9.3.1.GA.
  5. Gary Mathews 2021-02-12

    master: https://github.com/appcelerator/titanium_mobile/pull/12471
  6. Satyam Sekhri 2021-02-17

    FR Passed. Waiting for Jenkins build.
  7. Christopher Williams 2021-02-19

    merged to master for 10.0.0 target

JSON Source