brien.crean brien.crean - 4 months ago 70
CSS Question

React Native font outline / textShadow

Is it possible to add an outline or textShadow to a font in react native to achieve something like this (white font with a black outline):

enter image description here

In CSS on the web its possible to add a text shadow or an outline to a font, to give the text a border that follows the font, something like this:



h1 {
color: yellow;
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

<h1>Hello World</h1>





Is it possible to do something similar in react native?

I took the CCS snippet example from this stack overflow post on how to do it with CSS: CSS Font Border?

EDIT: Updated question to try and make it clearer

Answer

Yes it is possible through the following properties:

textShadowColor color
textShadowOffset ReactPropTypes.shape( {width: ReactPropTypes.number, height: ReactPropTypes.number} )
textShadowRadius ReactPropTypes.number

https://facebook.github.io/react-native/docs/text.html

Actual completed pull request: https://github.com/facebook/react-native/pull/4975