Files
mobile-darmasaba/components/progressBar.tsx
amel c04c1de119 upd: project
Deskripsi:
- load page project
- pencarian project
- filter group project
- update label status pada project home

No Issues
2025-05-08 17:25:03 +08:00

35 lines
963 B
TypeScript

import Styles from "@/constants/Styles";
import { useEffect, useState } from "react";
import { Animated, View } from "react-native";
type Props = {
margin?: number
value: number
category: "page" | "carousel"
}
export default function ProgressBar({ margin, value, category }: Props) {
const [progress, setProgress] = useState(new Animated.Value(0));
const [totalProgress, setTotalProgress] = useState(category == 'carousel' ? 255 : 290);
useEffect(() => {
Animated.timing(progress, {
// carousel:: 100% = 255
// page:: 100% = 290
toValue: value / 100 * totalProgress,
duration: 1000,
useNativeDriver: false
}).start();
}, [value]);
return (
<View style={[Styles.contentItemCenter]}>
<View style={[Styles.wrapBar, { margin: margin && margin }]}>
<Animated.View style={[Styles.contentBar, { width: progress }]} />
</View>
</View>
)
}