Text, Icon and maybe other components are not responsive.

[TechSaq]

Text and Icon are not responsive according to different devices.

In iPad, Text looks small and if I add responsive font size to Text then Icon beside Text doesn't looks good.

Tablet - Normal UI

Tablet - UI after adding responsive text

Is there a way to make UI Kitten components to be responsive?

I thought to add device type checks for styling like width, height, fontSize but it didn't feel good to me. I would like to know what is the best approach to achieve responsiveness.

Please provide the suggestions or any resources, it will be really helpful.

Thanks.

[greenfrvr]

@TechSaq do I understand correctly, that the issue appears, when changing font size on a system level? (e.i. Larger Text on iOS, Font Size on Android)

[ev3nst]

Hello @greenfrvr,

I experienced similar if not the same issue. You can view the issue just by implementing demo ui-kitten ap and running on different sized devices. While text sizes looks perfectly normal on my android phone it looks too small in iOS (iPhone 14) simulator.

Does ui-kitten handle scaling/responsiveness in font-sizes ? Or should we use something like this instead --> https://github.com/nirsky/react-native-size-matters

Edit: When i clicked on Simulator -> Window -> Point Accurate simulator showed better results. Im not sure anymore. In any case it would be better to have more pre-defined text sizes. For example bigger versions of p1 and to be able to edit input label sizes as well they are especially small.