Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React-Native Change Text With setNativeProps

Has anyone figured out a way to dynamically mutate text on the screen without triggering a render?

A large part of my screen utilizes setNativeProps for moving parts, meaning that the animations become lagged despite using shouldComponentUpdate. I would like to use the Text tag instead of the TextInput tag workaround suggested in this post for stylistic reasons.

Best case scenario is a workaround that involves setNaiveProps as it would follow the pattern of the rest of the screen; however, I currently plan to render all the numbers 0-9 on the screen an move them into place at the moment, so any help would be greatly appreciated!

like image 471
Brian Avatar asked Oct 30 '22 00:10

Brian


1 Answers

As it turns out, you can actually format TextInputs the same exact way as Text elements (from what I have tested). For placing text horizontally, you have to set the width (something I had trouble with before). For those still interested in the original question however, you can nest TextInputs inside of a Text Element (one per text element because there is no justification and it automatically places them in a row). Styling applied to the Text Element will apply to the TextInput.

like image 130
Brian Avatar answered Nov 08 '22 07:11

Brian