diff --git a/src/components/FAB/AnimatedFAB.tsx b/src/components/FAB/AnimatedFAB.tsx index ecfe7e1c60..a43c713677 100644 --- a/src/components/FAB/AnimatedFAB.tsx +++ b/src/components/FAB/AnimatedFAB.tsx @@ -130,6 +130,8 @@ export type Props = $Omit<$RemoveChildren, 'mode'> & { const SIZE = 56; const SCALE = 0.9; +const SHADOW_LAYER_Z_INDEX = 1; +const CONTENT_LAYER_Z_INDEX = 2; /** * An animated, extending horizontally floating action button represents the primary action in an application. @@ -596,9 +598,19 @@ const styles = StyleSheet.create({ innerWrapper: { flexDirection: 'row', overflow: 'hidden', + ...Platform.select({ + android: { + zIndex: CONTENT_LAYER_Z_INDEX, + }, + }), }, shadowWrapper: { elevation: 0, + ...Platform.select({ + android: { + zIndex: SHADOW_LAYER_Z_INDEX, + }, + }), }, shadow: { elevation: 6,