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,