diff --git a/demo/src/screens/componentScreens/FloatingButtonScreen.tsx b/demo/src/screens/componentScreens/FloatingButtonScreen.tsx index 2333fedba6..528f79be53 100644 --- a/demo/src/screens/componentScreens/FloatingButtonScreen.tsx +++ b/demo/src/screens/componentScreens/FloatingButtonScreen.tsx @@ -1,6 +1,6 @@ import React, {Component} from 'react'; import {View, StyleSheet, Alert, ScrollView} from 'react-native'; -import {Colors, Text, FloatingButton, FloatingButtonLayouts} from 'react-native-ui-lib'; +import {Colors, Text, FloatingButton, FloatingButtonLayouts, Keyboard} from 'react-native-ui-lib'; import {renderBooleanOption} from '../ExampleScreenPresenter'; interface State { @@ -8,6 +8,7 @@ interface State { showPrimary: boolean; showSecondary: boolean; showVertical: boolean; + withTrackingView: boolean; } export default class FloatingButtonScreen extends Component<{}, State> { @@ -16,7 +17,8 @@ export default class FloatingButtonScreen extends Component<{}, State> { showPrimary: true, showSecondary: true, showVertical: true, - fullWidth: false + fullWidth: false, + withTrackingView: false }; notNow = () => { @@ -30,7 +32,8 @@ export default class FloatingButtonScreen extends Component<{}, State> { }; render() { - const {showSecondary, showVertical} = this.state; + const {showSecondary, showVertical, withTrackingView} = this.state; + const Container = withTrackingView ? Keyboard.KeyboardTrackingView : React.Fragment; return ( @@ -41,6 +44,7 @@ export default class FloatingButtonScreen extends Component<{}, State> { {renderBooleanOption.call(this, 'Show Primary Button', 'showPrimary')} {renderBooleanOption.call(this, 'Show Secondary Button', 'showSecondary')} {renderBooleanOption.call(this, 'Button Layout Vertical', 'showVertical')} + {renderBooleanOption.call(this, 'With tracking view', 'withTrackingView')} @@ -67,30 +71,32 @@ export default class FloatingButtonScreen extends Component<{}, State> { - + + + ); } diff --git a/packages/react-native-ui-lib/src/components/floatingButton/index.tsx b/packages/react-native-ui-lib/src/components/floatingButton/index.tsx index 472595d7b2..4a7a38e045 100644 --- a/packages/react-native-ui-lib/src/components/floatingButton/index.tsx +++ b/packages/react-native-ui-lib/src/components/floatingButton/index.tsx @@ -254,9 +254,9 @@ class FloatingButton extends PureComponent { const styles = StyleSheet.create({ container: { - ...StyleSheet.absoluteFillObject, + // ...StyleSheet.absoluteFillObject, // TODO: this is breaking scenarios where the FloatingButton is inside a KeyboardTrackingView top: undefined, - zIndex: Constants.isAndroid ? 99 : undefined + zIndex: 99 }, image: { ...StyleSheet.absoluteFillObject,