Added support for textDecorationLine style prop on Android

Summary:As suggested by kmagiera in #3819, I've implemented `textDecorationLine` style for Android in `ReactTextShadowNode` using span operations so we can support nested Text components.

![Demo](http://c.hlp.sc/022k2l033p0n/Image%202016-01-03%20at%2011.17.15%20PM.png)
Closes https://github.com/facebook/react-native/pull/5105

Differential Revision: D3167756

Pulled By: andreicoman11

fb-gh-sync-id: 122701a53d50f47f89b49e1f343c97db5fa2323d
fbshipit-source-id: 122701a53d50f47f89b49e1f343c97db5fa2323d
This commit is contained in:
Maxi Ferreira
2016-04-12 03:36:29 -07:00
committed by Facebook Github Bot 9
parent eac617d6ee
commit 2039be9d32
5 changed files with 101 additions and 3 deletions

View File

@@ -71,6 +71,7 @@ public class ViewProps {
public static final String RESIZE_MODE = "resizeMode";
public static final String TEXT_ALIGN = "textAlign";
public static final String TEXT_ALIGN_VERTICAL = "textAlignVertical";
public static final String TEXT_DECORATION_LINE = "textDecorationLine";
public static final String BORDER_WIDTH = "borderWidth";
public static final String BORDER_LEFT_WIDTH = "borderLeftWidth";

View File

@@ -25,6 +25,8 @@ import android.text.TextPaint;
import android.text.style.AbsoluteSizeSpan;
import android.text.style.BackgroundColorSpan;
import android.text.style.ForegroundColorSpan;
import android.text.style.StrikethroughSpan;
import android.text.style.UnderlineSpan;
import android.widget.TextView;
import com.facebook.csslayout.CSSConstants;
@@ -146,6 +148,12 @@ public class ReactTextShadowNode extends LayoutShadowNode {
textCSSNode.mFontFamily,
textCSSNode.getThemedContext().getAssets())));
}
if (textCSSNode.mIsUnderlineTextDecorationSet) {
ops.add(new SetSpanOperation(start, end, new UnderlineSpan()));
}
if (textCSSNode.mIsLineThroughTextDecorationSet) {
ops.add(new SetSpanOperation(start, end, new StrikethroughSpan()));
}
if (textCSSNode.mTextShadowOffsetDx != 0 || textCSSNode.mTextShadowOffsetDy != 0) {
ops.add(new SetSpanOperation(
start,
@@ -287,6 +295,9 @@ public class ReactTextShadowNode extends LayoutShadowNode {
private float mTextShadowRadius = 1;
private int mTextShadowColor = DEFAULT_TEXT_SHADOW_COLOR;
private boolean mIsUnderlineTextDecorationSet = false;
private boolean mIsLineThroughTextDecorationSet = false;
/**
* mFontStyle can be {@link Typeface#NORMAL} or {@link Typeface#ITALIC}.
* mFontWeight can be {@link Typeface#NORMAL} or {@link Typeface#BOLD}.
@@ -428,6 +439,22 @@ public class ReactTextShadowNode extends LayoutShadowNode {
}
}
@ReactProp(name = ViewProps.TEXT_DECORATION_LINE)
public void setTextDecorationLine(@Nullable String textDecorationLineString) {
mIsUnderlineTextDecorationSet = false;
mIsLineThroughTextDecorationSet = false;
if (textDecorationLineString != null) {
for (String textDecorationLineSubString : textDecorationLineString.split(" ")) {
if ("underline".equals(textDecorationLineSubString)) {
mIsUnderlineTextDecorationSet = true;
} else if ("line-through".equals(textDecorationLineSubString)) {
mIsLineThroughTextDecorationSet = true;
}
}
}
markUpdated();
}
@ReactProp(name = PROP_SHADOW_OFFSET)
public void setTextShadowOffset(ReadableMap offsetMap) {
if (offsetMap == null) {