update Text to support gradient colors #54
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
mrkcsc
reviewed
Apr 22, 2025
| */ | ||
| minimumFontScale?: number | undefined; | ||
|
|
||
| gradientColors?: number[] | undefined; |
There was a problem hiding this comment.
I know it's a fork but maybe doc on the expected format, eg: what type of "int based color" is expected here and also presumably its a horizontal gradient only.
mrkcsc
reviewed
Apr 22, 2025
mrkcsc
reviewed
Apr 22, 2025
| protected boolean mIsBackgroundColorSet = false; | ||
| protected int mBackgroundColor; | ||
|
|
||
| protected int[] mGradientColors = new int[0]; |
There was a problem hiding this comment.
maybe just leave it as null so we don't pay any added memory cost for the majority case where gradient colors are not being used.
mrkcsc
reviewed
Apr 22, 2025
| } | ||
| } | ||
| if (colors.size() >= 2) { | ||
| mGradientColors = colors.stream() |
There was a problem hiding this comment.
I would be wary of using .stream() I am not entirely sure if this Java API is backported to all the old Android versions we support.
I'd suggest sticking to a simple for loop.
mrkcsc
approved these changes
Apr 22, 2025
Flewp
approved these changes
Apr 22, 2025
This was referenced Apr 30, 2025
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary:
We added a new Boost perk called "Enhanced Role Colors/Styles" that allows admins to set gradient colors for roles in their guild. To support this on mobile, we have to provide native components that can render gradients.
At first, we were planning to create a custom native component but ran into 2 issues:
heightandwidthdefined for it to render. This was fixed by using aShadowNodebut we ran into other sizing issues.Textnodes and wouldn't render our custom view even when it extendedBaseText.We decided rather than creating a new custom component and solving for the above issues, it'd be easier to update
Textto support gradient colors.Changelog:
Textto supportgradientColorswhich is an optional array ofnumbersTest Plan:
Tested updating
ChatInputReplyBarto show gradient colors with the following test cases:gradientColorswith a list ofnumbersgradientColorswith somenullvaluesgradientColorswith somestringvaluesgradientColorswith somedoublevaluesFor the value types not
int, the goal is to not crash the app. This equates to different behaviors between the platforms but the dev will get a type error on the React JS side of things so things should generally work as expected.I picked
ChatInputReplyBarbecause it demonstrates the behavior with nestedTextnodes and is a place where we will want to render gradient colors.screenshots
happy path
tertiaryColorisstring(which is ignored so only first 2 colors show)tertiaryColorisdouble(which is translated as0on Android and some other number on iOS)