From 3ba158bc5b8419fc760a73fde10e1f1e1d633ed7 Mon Sep 17 00:00:00 2001 From: GoodNullName Date: Tue, 22 Oct 2024 11:15:40 +0800 Subject: [PATCH] fix: fix display of schedule and adjust touch feedback * feat: support hide weekend in schedule * fix: fix schedule display of workdays * fix: fix schedule display of workdays * fix: try fix schedule options and improve ui * style: back to lf * feat: revert touch opacity and enrich color list * fix: lf * Revert "fix: lf" This reverts commit 67d16c2398a764f0fa5c541998a30883e26ff327. * revert: revert color list changes --- .../src/components/schedule/schedule.tsx | 11 ++-- .../thu-info-app/src/ui/schedule/schedule.tsx | 59 +++++++++++-------- 2 files changed, 42 insertions(+), 28 deletions(-) diff --git a/apps/thu-info-app/src/components/schedule/schedule.tsx b/apps/thu-info-app/src/components/schedule/schedule.tsx index ba7ada49b..0708364d0 100644 --- a/apps/thu-info-app/src/components/schedule/schedule.tsx +++ b/apps/thu-info-app/src/components/schedule/schedule.tsx @@ -11,13 +11,16 @@ interface ScheduleBlockProps { gridHeight: number; gridWidth: number; onPress: () => void; + textColor?: string; blockColor?: string; blockMargin?: number; } export const ScheduleBlock = (props: ScheduleBlockProps) => { const themeName = useColorScheme(); - const {colors} = themes(themeName); + const { colors } = themes(themeName); + + const textColor = props.textColor || "white"; const blockMargin = props.blockMargin || 2; const blockColor = props.blockColor || colors.themePurple; @@ -45,7 +48,7 @@ export const ScheduleBlock = (props: ScheduleBlockProps) => { height: blockBottomPos - blockTopPos, backgroundColor: blockColor, borderRadius: 4, - paddingVertical: 4, + paddingVertical: 6, paddingHorizontal: 2, }} onPress={props.onPress}> @@ -58,7 +61,7 @@ export const ScheduleBlock = (props: ScheduleBlockProps) => { ? blockBottomPos - blockTopPos - localeHeight - 5 : blockBottomPos - blockTopPos, textAlign: "left", - color: "white", + color: textColor, lineHeight: 18, fontWeight: "bold", fontSize: 13, @@ -73,7 +76,7 @@ export const ScheduleBlock = (props: ScheduleBlockProps) => { numberOfLines={3} style={{ textAlign: "left", - color: "white", + color: textColor, fontSize: 8, }}> {"@" + props.location} diff --git a/apps/thu-info-app/src/ui/schedule/schedule.tsx b/apps/thu-info-app/src/ui/schedule/schedule.tsx index 7a15b169e..89ec3085d 100644 --- a/apps/thu-info-app/src/ui/schedule/schedule.tsx +++ b/apps/thu-info-app/src/ui/schedule/schedule.tsx @@ -318,7 +318,7 @@ export const ScheduleScreen = ({navigation}: {navigation: RootNav}) => { const hideWeekend = useSelector((s: State) => s.config.hideWeekend); const unitHeight = exactUnitHeight * (1 + heightMode * 0.05); const scheduleBodyWidth = windowWidth - 32; - const unitWidth = scheduleBodyWidth / 7; + const unitWidth = scheduleBodyWidth / (hideWeekend ? 5 : 7); const [openConfig, setOpenConfig] = useState(false); @@ -466,7 +466,7 @@ export const ScheduleScreen = ({navigation}: {navigation: RootNav}) => { position: "absolute", right: 12, top: 5 * unitHeight + 40, - fontSize: 12, + fontSize: 10, color: theme.colors.fontB3, }}> {getStr("lunch")} @@ -476,7 +476,7 @@ export const ScheduleScreen = ({navigation}: {navigation: RootNav}) => { position: "absolute", right: 12, top: 11 * unitHeight + 40, - fontSize: 12, + fontSize: 10, color: theme.colors.fontB3, }}> {getStr("supper")} @@ -549,6 +549,9 @@ export const ScheduleScreen = ({navigation}: {navigation: RootNav}) => { {(item as SliceRenderData[]).map((data) => { + if (hideWeekend && data.slice.dayOfWeek > 5) { + return null; + } if (data.type === "normal") { const slice = data.slice; const val = data.schedule; @@ -569,11 +572,12 @@ export const ScheduleScreen = ({navigation}: {navigation: RootNav}) => { gridWidth={unitWidth} key={`${val.name}-${num}-${slice.dayOfWeek}-${slice.begin}-${val.location}`} blockColor={ - colorList[ + `${colorList[ parseInt(md5(val.name).substr(0, 6), 16) % colorList.length - ] + ]}33` } + textColor={colorList[parseInt(md5(val.name).substr(0, 6), 16) % colorList.length]} onPress={() => { navigation.navigate("ScheduleDetail", { name: val.name, @@ -607,11 +611,12 @@ export const ScheduleScreen = ({navigation}: {navigation: RootNav}) => { gridWidth={unitWidth} key={`${val.name}-${slice.weekNumber}-${slice.dayOfWeek}-${slice.begin}-${val.location}`} blockColor={ - colorList[ - parseInt(md5(val.name).substr(0, 6), 16) % - colorList.length - ] + `${colorList[ + parseInt(md5(val.name).substr(0, 6), 16) % + colorList.length + ]}33` } + textColor={colorList[parseInt(md5(val.name).substr(0, 6), 16) % colorList.length]} onPress={() => { navigation.navigate("ScheduleDetail", { name: val.name, @@ -671,23 +676,29 @@ export const ScheduleScreen = ({navigation}: {navigation: RootNav}) => { }} /> - + {getStr("hideWeekend")} + style={{ + color: theme.colors.fontB1, + fontSize: 16, + }}>{getStr("hideWeekend")} { - dispatch(configSet({ - key: "hideWeekend", - value: value, - })); - }} + thumbColor={theme.colors.contentBackground} + trackColor={{ true: theme.colors.themePurple }} + value={hideWeekend} + onValueChange={(value: boolean) => { + dispatch(configSet({ + key: "hideWeekend", + value: value, + })); + }} />