upd: home
Deskripsi: - update progress pada kegiatan terupdate home No Issues
This commit is contained in:
@@ -55,7 +55,7 @@ export default function ProjectHome() {
|
|||||||
vertical={false}
|
vertical={false}
|
||||||
renderItem={({ index }) => (
|
renderItem={({ index }) => (
|
||||||
<PaperGridContent content="carousel" onPress={() => { router.push(`/project/${data[index].id}`) }} title={data[index].title} headerColor="primary">
|
<PaperGridContent content="carousel" onPress={() => { router.push(`/project/${data[index].id}`) }} title={data[index].title} headerColor="primary">
|
||||||
<ProgressBar />
|
<ProgressBar value={data[index].progress}/>
|
||||||
<View style={[Styles.rowSpaceBetween]}>
|
<View style={[Styles.rowSpaceBetween]}>
|
||||||
<Text style={[Styles.textDefault, Styles.cGray]}>{data[index].createdAt}</Text>
|
<Text style={[Styles.textDefault, Styles.cGray]}>{data[index].createdAt}</Text>
|
||||||
<View style={[Styles.labelStatus,
|
<View style={[Styles.labelStatus,
|
||||||
|
|||||||
@@ -1,28 +1,31 @@
|
|||||||
import Styles from "@/constants/Styles";
|
import Styles from "@/constants/Styles";
|
||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
import { Animated, Text, View } from "react-native";
|
import { Animated, View } from "react-native";
|
||||||
|
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
margin?: number
|
margin?: number
|
||||||
|
value: number
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function ProgressBar({ margin }: Props) {
|
export default function ProgressBar({ margin, value }: Props) {
|
||||||
const [progress, setProgress] = useState(new Animated.Value(0));
|
const [progress, setProgress] = useState(new Animated.Value(0));
|
||||||
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
Animated.timing(progress, {
|
Animated.timing(progress, {
|
||||||
// 100% = 255
|
// 100% = 255
|
||||||
toValue: 127.5,
|
toValue: value / 100 * 255,
|
||||||
duration: 1000,
|
duration: 1000,
|
||||||
useNativeDriver: false
|
useNativeDriver: false
|
||||||
}).start();
|
}).start();
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View style={[Styles.wrapBar, { margin: margin && margin }]}>
|
<View style={[Styles.contentItemCenter]}>
|
||||||
<Animated.View style={[Styles.contentBar, { width: progress }]} />
|
<View style={[Styles.wrapBar, { margin: margin && margin }]}>
|
||||||
|
<Animated.View style={[Styles.contentBar, { width: progress }]} />
|
||||||
|
</View>
|
||||||
</View>
|
</View>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user