0

I use react-native-ui-kitten library: https://akveo.github.io/react-native-ui-kitten/#/docs/ui-components/rkbutton . And would like to make RkButton to wrap my long text into the several lines. But don't know how to do that.

Currently this:

<RkButton
  style={{ backgroundColor: "red", margin: 5 }}
  rkType="xlarge"
>
  Very very very long text Very very very long text Very very very long text Very very very long text
</RkButton>

Is being displayed as this: text is not wrapped

I want that it wraps the text into the next line(s).

Here is the demo snack: https://snack.expo.io/HkMDcBpd4 .

Any thoughts?

Regards,

Richard Chambers
  • 16,643
  • 4
  • 81
  • 106
Pavel Polyakov
  • 866
  • 1
  • 8
  • 13

1 Answers1

1

I received some help in the Reactiflux discord. It turned out, that the only thing missing was height: auto in the RkButton style.

<RkButton style={{ backgroundColor: "red", margin: 5, height: 'auto' }} rkType="xlarge">
        Very long text Very long text Very long text Very long text Very long text
</RkButton>

Here is a snack: https://snack.expo.io/HJbHLLpO4 .

Pavel Polyakov
  • 866
  • 1
  • 8
  • 13