react native fab : round button

Quite hard to integrate a Floating action button into react native.
Especially when your app is fusion = has react-native-web but can also be displayed on a desktop.

You cannot react-native link on a webapp and you cannot render anything based on native implementation.

What can you do to easily have a FAB ready to go everywhere (and even on an iPhone) ?

I have made an implementation of the floating action button and I have called it « round button ».
The purpose is to be clickable, to be visible and to not depend of the external layout (to be displayable over the screen, on top of the current display)

I could give you screenshots but better thing is to get a gist and a storybook link

Here is a comprehensive usage of that button : a button which transforms into another when long pressed :

<RoundButton align='left top' longPressText='⚙' longPressColor='#0d5da6' longPressFontColor='#FFFFFF' text='↻'
color='#dfc81f' fontColor='#FFFFFF' onClick={() => console.log('You clicked on ↻')}
onLongClick={() => console.log('You clicked on ⚙')}/>

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *