From fb6cf2552a0ab19d4e96d7d3a586de36c792c1a4 Mon Sep 17 00:00:00 2001 From: Oleksandr Melnykov Date: Fri, 24 May 2019 02:50:40 -0700 Subject: [PATCH] Fix backgroundColor top level prop of TextInput Summary: Changelog: [Android] [FIXED] - Fix backgroundColor top level prop of TextInput This diff fixes two issues with the `backgroundColor` top level property of TextInput on Android: * Now it is possible to set a **string** value for the top-level `backgroundColor` property of TextInput (crashed the app previously): ``` Hello, React Native ``` * Now it's possible to set an **integer** value for the top-level `backgroundColor` property of TextInput (had no effect previously): ``` Hello, React Native ``` A `customType = "Color"` annotation parameter must be provided for `ReactBaseTextShadowNode.setBackgroundColor(...)` since the color value must be previously processed in JS before sending it over the bridge to the native code. The JS code will parse the color value and return the proper ARGB color integer to the native platforms (https://fburl.com/uqup52tn). Without providing the custom type for the background color, if a string value is set for the top-level `backgroundColor` property in the JS code, the Android code will crash since it expects an integer value for the color in `ReactBaseTextShadowNode.setBackgroundColor(...)`, but a string will be passed from JS without any conversion and there will be a `ClassCastException` thrown. If an integer value without the alpha component (like `0xffccbb`) is set, the Android native view would get an integer color value with its alpha component set to `0x00`, which means a transparent color. On a side note: the alpha component of a color must always be set when using an integer value for `backgroundColor` since the JS code, while processing the color type, shifts the rightmost 8 bytes (alpha component) to the leftmost position. If those 8 bytes are not the alpha component, you will get the wrong color in the end. It doesn't seem to be a problem for string values of `backgroundColor` though. Reviewed By: mdvacca Differential Revision: D15453980 fbshipit-source-id: f3f5d9c9877cdbce79a67f2ed93ad4589576d166 --- .../facebook/react/views/text/ReactBaseTextShadowNode.java | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactBaseTextShadowNode.java b/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactBaseTextShadowNode.java index 3649a944908..7bfc0ae496c 100644 --- a/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactBaseTextShadowNode.java +++ b/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactBaseTextShadowNode.java @@ -459,8 +459,8 @@ public abstract class ReactBaseTextShadowNode extends LayoutShadowNode { markUpdated(); } - @ReactProp(name = ViewProps.BACKGROUND_COLOR) - public void setBackgroundColor(Integer color) { + @ReactProp(name = ViewProps.BACKGROUND_COLOR, customType = "Color") + public void setBackgroundColor(@Nullable Integer color) { // Background color needs to be handled here for virtual nodes so it can be incorporated into // the span. However, it doesn't need to be applied to non-virtual nodes because non-virtual // nodes get mapped to native views and native views get their background colors get set via