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

Improve layout, add current time and duration

Browse Source
This commit is contained in:
Jorrin
2024-02-13 21:13:48 +01:00
parent 0a98e86de1
commit 378b16b3e4
7 changed files with 118 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
apps/expo/src/components/player/MiddleControls.tsx
View File

@@ -1,31 +1,21 @@
import { TouchableWithoutFeedback, View } from "react-native";
import { View } from "react-native";
import { usePlayerStore } from "~/stores/player/store";
import { Controls } from "./Controls";
import { PlayButton } from "./PlayButton";
import { SeekButton } from "./SeekButton";
export const MiddleControls = () => {
const idle = usePlayerStore((state) => state.interface.isIdle);
const setIsIdle = usePlayerStore((state) => state.setIsIdle);
const handleTouch = () => {
setIsIdle(!idle);
};
return (
<TouchableWithoutFeedback onPress={handleTouch}>
<View className="absolute inset-x-0 bottom-1/3 top-1/3 flex flex-row items-center justify-center gap-24">
<Controls>
<SeekButton type="backward" />
</Controls>
<Controls>
<PlayButton />
</Controls>
<Controls>
<SeekButton type="forward" />
</Controls>
</View>
</TouchableWithoutFeedback>
<View className="flex flex-1 flex-row items-center justify-center gap-24">
<Controls>
<SeekButton type="backward" />
</Controls>
<Controls>
<PlayButton />
</Controls>
<Controls>
<SeekButton type="forward" />
</Controls>
</View>
);
};