diff options
author | Thomas F. K. Jorna <[email protected]> | 2021-07-14 15:10:31 +0200 |
---|---|---|
committer | Thomas F. K. Jorna <[email protected]> | 2021-07-14 15:10:31 +0200 |
commit | e5021187e96b78b53203bd95d08d6818aea47d17 (patch) | |
tree | 37ec45d00eb963db53cd4bb4f04a770414b351cc /app/components/screen/screen.tsx |
New Ignite 7.0.6 app
Diffstat (limited to 'app/components/screen/screen.tsx')
-rw-r--r-- | app/components/screen/screen.tsx | 66 |
1 files changed, 66 insertions, 0 deletions
diff --git a/app/components/screen/screen.tsx b/app/components/screen/screen.tsx new file mode 100644 index 0000000..ba84547 --- /dev/null +++ b/app/components/screen/screen.tsx @@ -0,0 +1,66 @@ +import * as React from "react" +import { KeyboardAvoidingView, Platform, ScrollView, StatusBar, View } from "react-native" +import { useSafeAreaInsets } from "react-native-safe-area-context" +import { ScreenProps } from "./screen.props" +import { isNonScrolling, offsets, presets } from "./screen.presets" + +const isIos = Platform.OS === "ios" + +function ScreenWithoutScrolling(props: ScreenProps) { + const insets = useSafeAreaInsets() + const preset = presets.fixed + const style = props.style || {} + const backgroundStyle = props.backgroundColor ? { backgroundColor: props.backgroundColor } : {} + const insetStyle = { paddingTop: props.unsafe ? 0 : insets.top } + + return ( + <KeyboardAvoidingView + style={[preset.outer, backgroundStyle]} + behavior={isIos ? "padding" : undefined} + keyboardVerticalOffset={offsets[props.keyboardOffset || "none"]} + > + <StatusBar barStyle={props.statusBar || "light-content"} /> + <View style={[preset.inner, style, insetStyle]}>{props.children}</View> + </KeyboardAvoidingView> + ) +} + +function ScreenWithScrolling(props: ScreenProps) { + const insets = useSafeAreaInsets() + const preset = presets.scroll + const style = props.style || {} + const backgroundStyle = props.backgroundColor ? { backgroundColor: props.backgroundColor } : {} + const insetStyle = { paddingTop: props.unsafe ? 0 : insets.top } + + return ( + <KeyboardAvoidingView + style={[preset.outer, backgroundStyle]} + behavior={isIos ? "padding" : undefined} + keyboardVerticalOffset={offsets[props.keyboardOffset || "none"]} + > + <StatusBar barStyle={props.statusBar || "light-content"} /> + <View style={[preset.outer, backgroundStyle, insetStyle]}> + <ScrollView + style={[preset.outer, backgroundStyle]} + contentContainerStyle={[preset.inner, style]} + keyboardShouldPersistTaps={props.keyboardShouldPersistTaps || "handled"} + > + {props.children} + </ScrollView> + </View> + </KeyboardAvoidingView> + ) +} + +/** + * The starting component on every screen in the app. + * + * @param props The screen props + */ +export function Screen(props: ScreenProps) { + if (isNonScrolling(props.preset)) { + return <ScreenWithoutScrolling {...props} /> + } else { + return <ScreenWithScrolling {...props} /> + } +} |