movie-web/native-app
1
0
Fork 0
mirror of https://github.com/movie-web/native-app.git synced 2025-09-13 18:13:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

use insets to respect notch

Browse Source
This commit is contained in:
Jorrin
2024-03-22 20:37:39 +01:00
parent 68e66a6d94
commit c1b5ceacc3
1 changed files with 6 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
apps/expo/src/components/player/VideoPlayer.tsx
View File

@@ -8,6 +8,7 @@ import Animated, {
useAnimatedStyle, useAnimatedStyle,
useSharedValue, useSharedValue,
} from "react-native-reanimated"; } from "react-native-reanimated";
import { useSafeAreaInsets } from "react-native-safe-area-context";
import { ResizeMode, Video } from "expo-av"; import { ResizeMode, Video } from "expo-av";
import * as Haptics from "expo-haptics"; import * as Haptics from "expo-haptics";
import * as NavigationBar from "expo-navigation-bar"; import * as NavigationBar from "expo-navigation-bar";
@@ -279,6 +280,7 @@ function GestureOverlay(props: {
type: "brightness" | "volume"; type: "brightness" | "volume";
}) { }) {
const theme = useTheme(); const theme = useTheme();
const insets = useSafeAreaInsets();
const animatedStyle = useAnimatedStyle(() => { const animatedStyle = useAnimatedStyle(() => {
return { return {
@@ -291,8 +293,10 @@ function GestureOverlay(props: {
return ( return (
<View <View
position="absolute" position="absolute"
left={props.type === "brightness" ? "$7" : undefined} // left={props.type === "brightness" ? "$7" : undefined}
right={props.type === "volume" ? "$7" : undefined} left={props.type === "brightness" ? insets.left + 20 : undefined}
// right={props.type === "volume" ? "$7" : undefined}
right={props.type === "volume" ? insets.right + 20 : undefined}
borderRadius="$4" borderRadius="$4"
gap={8} gap={8}
height="50%" height="50%"