CarouselBoxコンポーネントのrenderItem関数を分離し、MenuコンポーネントでのcurrentStationの管理をnearPositionStationに変更
This commit is contained in:
@@ -46,6 +46,29 @@ export const CarouselBox = ({
|
||||
setDotButton(data === "true");
|
||||
});
|
||||
}, []);
|
||||
const RenderItem = ({ item, index }) => {
|
||||
return (
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: "#0000",
|
||||
width,
|
||||
flexDirection: "row",
|
||||
marginLeft: 0,
|
||||
marginRight: 0,
|
||||
}}
|
||||
key={item[0].StationNumber}
|
||||
>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Sign
|
||||
stationID={item[0].StationNumber}
|
||||
isCurrentStation={item == currentStation}
|
||||
oP={oPSign}
|
||||
oLP={oLPSign}
|
||||
/>
|
||||
<View style={{ flex: 1 }} />
|
||||
</View>
|
||||
);
|
||||
};
|
||||
return (
|
||||
<View style={{ flex: 1, paddingTop: 10 }}>
|
||||
<Carousel
|
||||
@@ -64,29 +87,7 @@ export const CarouselBox = ({
|
||||
parallaxAdjacentItemScale: 0.8,
|
||||
}}
|
||||
onSnapToItem={setSelectedCurrentStation}
|
||||
renderItem={({ item, index }) => {
|
||||
return (
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: "#0000",
|
||||
width,
|
||||
flexDirection: "row",
|
||||
marginLeft: 0,
|
||||
marginRight: 0,
|
||||
}}
|
||||
key={item[0].StationNumber}
|
||||
>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Sign
|
||||
stationID={item[0].StationNumber}
|
||||
isCurrentStation={item == currentStation}
|
||||
oP={oPSign}
|
||||
oLP={oLPSign}
|
||||
/>
|
||||
<View style={{ flex: 1 }} />
|
||||
</View>
|
||||
);
|
||||
}}
|
||||
renderItem={RenderItem}
|
||||
/>
|
||||
<View
|
||||
style={{
|
||||
@@ -99,25 +100,21 @@ export const CarouselBox = ({
|
||||
{originalStationList &&
|
||||
allStationData.map((d, index) => {
|
||||
const active = index == selectedCurrentStation;
|
||||
const numberIndex = d[0].StationNumber;
|
||||
if (dotButton) {
|
||||
return (
|
||||
<StationNumber
|
||||
onPress={() => setSelectedCurrentStation(index)}
|
||||
currentStation={d}
|
||||
active={active}
|
||||
key={numberIndex + index}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<SimpleDot
|
||||
onPress={() => setSelectedCurrentStation(index)}
|
||||
active={active}
|
||||
key={numberIndex + index}
|
||||
/>
|
||||
);
|
||||
}
|
||||
const numberKey = d[0].StationNumber + index;
|
||||
return dotButton ? (
|
||||
<StationNumber
|
||||
onPress={() => setSelectedCurrentStation(index)}
|
||||
currentStation={d}
|
||||
active={active}
|
||||
key={numberKey}
|
||||
/>
|
||||
) : (
|
||||
<SimpleDot
|
||||
onPress={() => setSelectedCurrentStation(index)}
|
||||
active={active}
|
||||
key={numberKey}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
</View>
|
||||
</View>
|
||||
|
Reference in New Issue
Block a user