@ledvance/ui-biz-bundle 1.1.152 → 1.1.154

package/package.json

@@ -4,7 +4,7 @@
   "name": "@ledvance/ui-biz-bundle",
   "pid": [],
   "uiid": "",
-  "version": "1.1.152",
+  "version": "1.1.154",
   "scripts": {},
   "dependencies": {
     "@ledvance/base": "^1.x",

package/src/modules/flags/FlagEditPage.tsx

@@ -103,7 +103,7 @@ const FlagEditPage = (props: { theme?: ThemeType }) => {
     light: {
       color: props.theme?.global.fontColor,
       fontSize: cx(18),
-      fontFamily: 'helvetica_neue_lt_std_bd',
+      // fontFamily: 'helvetica_neue_lt_std_bd',
     },
     transitionMode: {
       marginHorizontal: cx(16),
@@ -171,7 +171,7 @@ const FlagEditPage = (props: { theme?: ThemeType }) => {
     deleteBtnText: {
       color: props.theme?.button.fontColor,
       fontSize: cx(16),
-      fontFamily: 'helvetica_neue_lt_std_bd',
+      // fontFamily: 'helvetica_neue_lt_std_bd',
     },
   })
 

package/src/modules/flags/FlagItem.tsx

@@ -37,7 +37,7 @@ function FlagItem(props: RecommendMoodItemProps) {
     headText: {
       color: props.theme?.global.fontColor,
       fontSize: cx(16),
-      fontFamily: 'helvetica_neue_lt_std_bd',
+      // fontFamily: 'helvetica_neue_lt_std_bd',
       lineHeight: cx(20),
       flex: 1
     },

package/src/modules/history/HistoryPage.tsx

@@ -124,13 +124,13 @@ const SwitchHistoryPage = (props: { theme?: ThemeType }) => {
     listEmptyText: {
       color: props.theme?.global.fontColor,
       fontSize: cx(12),
-      fontFamily: 'helvetica_neue_lt_std_roman',
+      // fontFamily: 'helvetica_neue_lt_std_roman',
     },
     titleText: {
       marginHorizontal: cx(24),
       color: props.theme?.global.fontColor,
       fontSize: cx(16),
-      fontFamily: 'helvetica_neue_lt_std_roman',
+      // fontFamily: 'helvetica_neue_lt_std_roman',
     },
     switchHistoryItem: {
       marginHorizontal: cx(24),
@@ -138,7 +138,7 @@ const SwitchHistoryPage = (props: { theme?: ThemeType }) => {
     switchHistoryItemTitle: {
       color: props.theme?.global.fontColor,
       fontSize: cx(18),
-      fontFamily: 'helvetica_neue_lt_std_bd',
+      // fontFamily: 'helvetica_neue_lt_std_bd',
     },
     switchHistoryItemActionItem: {
       flexDirection: 'row',
@@ -168,7 +168,7 @@ const SwitchHistoryPage = (props: { theme?: ThemeType }) => {
     switchHistoryItemActionItemText: {
       color: props.theme?.global.fontColor,
       fontSize: cx(16),
-      fontFamily: 'helvetica_neue_lt_std_roman',
+      // fontFamily: 'helvetica_neue_lt_std_roman',
     },
     switchHistoryItemTag: {
       paddingHorizontal: cx(10),

package/src/modules/mood/DynamicMoodEditorPage.tsx

@@ -475,7 +475,7 @@ const styles = StyleSheet.create({
   light: {
     color: '#000',
     fontSize: cx(18),
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
   },
   transitionMode: {
     marginHorizontal: cx(16),
@@ -543,7 +543,7 @@ const styles = StyleSheet.create({
   deleteBtnText: {
     color: '#fff',
     fontSize: cx(16),
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
   },
 })
 export default DynamicMoodEditorPage

package/src/modules/mood/FantasyMoodEditPage.tsx

@@ -510,7 +510,7 @@ const styles = StyleSheet.create({
   light: {
     color: '#000',
     fontSize: cx(18),
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
   },
   transitionMode: {
     marginHorizontal: cx(16),
@@ -576,7 +576,7 @@ const styles = StyleSheet.create({
   deleteBtnText: {
     color: '#fff',
     fontSize: cx(16),
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
   },
 })
 export default FantasyMoodEditPage

package/src/modules/mood/FantasyMoodItem.tsx

@@ -74,7 +74,7 @@ const styles = StyleSheet.create({
         flex: 1,
         color: '#000',
         fontSize: cx(16),
-        fontFamily: 'helvetica_neue_lt_std_bd',
+        // fontFamily: 'helvetica_neue_lt_std_bd',
         lineHeight: cx(20),
     },
     gradientItem: {
@@ -97,7 +97,7 @@ const styles = StyleSheet.create({
         color: '#000000DD',
         fontSize: cx(10),
         textAlignVertical: 'center',
-        fontFamily: 'helvetica_neue_lt_std_roman',
+        // fontFamily: 'helvetica_neue_lt_std_roman',
         lineHeight: cx(16),
     },
 })

package/src/modules/mood/MixMood/MixMoodEditPage.tsx

@@ -617,7 +617,7 @@ const styles = StyleSheet.create({
   light: {
     color: '#000',
     fontSize: cx(18),
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
   },
   transitionMode: {
     marginHorizontal: cx(16),
@@ -685,7 +685,7 @@ const styles = StyleSheet.create({
   deleteBtnText: {
     color: '#fff',
     fontSize: cx(16),
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
   },
 })
 

package/src/modules/mood/MixMood/MixMoodItem.tsx

@@ -92,7 +92,7 @@ const styles = StyleSheet.create({
     flex: 1,
     color: '#000',
     fontSize: cx(16),
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
     lineHeight: cx(20),
   },
   gradientItem: {
@@ -128,7 +128,7 @@ const styles = StyleSheet.create({
     color: '#000000DD',
     fontSize: cx(10),
     textAlignVertical: 'center',
-    fontFamily: 'helvetica_neue_lt_std_roman',
+    // fontFamily: 'helvetica_neue_lt_std_roman',
     lineHeight: cx(16),
   },
 })

package/src/modules/mood/MixMood/RecommendMixMoodItem.tsx

@@ -59,7 +59,7 @@ const styles = StyleSheet.create({
   title: {
     color: '#000',
     fontSize: cx(16),
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
   },
   lineStyle: {
     alignItems: 'center',

package/src/modules/mood/MoodItem.tsx

@@ -84,7 +84,7 @@ const styles = StyleSheet.create({
         flex: 1,
         color: '#000',
         fontSize: cx(16),
-        fontFamily: 'helvetica_neue_lt_std_bd',
+        // fontFamily: 'helvetica_neue_lt_std_bd',
         lineHeight: cx(20),
     },
     gradientItem: {
@@ -107,7 +107,7 @@ const styles = StyleSheet.create({
         color: '#000000DD',
         fontSize: cx(10),
         textAlignVertical: 'center',
-        fontFamily: 'helvetica_neue_lt_std_roman',
+        // fontFamily: 'helvetica_neue_lt_std_roman',
         lineHeight: cx(16),
     },
 })

package/src/modules/mood/RecommendMoodItem.tsx

@@ -66,7 +66,7 @@ const styles = StyleSheet.create({
     title: {
         color: '#000',
         fontSize: cx(16),
-        fontFamily: 'helvetica_neue_lt_std_bd',
+        // fontFamily: 'helvetica_neue_lt_std_bd',
     },
     lineStyle: {
         alignItems: 'center',

package/src/modules/mood/StaticMoodEditorPage.tsx

@@ -297,7 +297,7 @@ const styles = StyleSheet.create({
   light: {
     color: '#000',
     fontSize: cx(18),
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
   },
   preview: {
     width: cx(20),
@@ -314,7 +314,7 @@ const styles = StyleSheet.create({
   deleteBtnText: {
     color: '#fff',
     fontSize: cx(16),
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
   },
 })
 

package/src/modules/music/MusicPage.tsx

@@ -257,7 +257,7 @@ const MusicPage = (props: { theme?: ThemeType }) => {
     tiptext: {
       color: props.theme?.global.fontColor,
       fontSize: cx(14),
-      lineHeight: cx(14),
+      // lineHeight: cx(14),
     }
   })
 

package/src/modules/music/SelecetGenre.tsx

@@ -31,7 +31,7 @@ const styles = StyleSheet.create({
         fontSize: cx(12),
         marginStart: cx(13),
         color: '#666',
-        fontFamily: 'helvetica_neue_lt_std_bd',
+        // fontFamily: 'helvetica_neue_lt_std_bd',
     },
     textInputGroup: {
         flexDirection: 'row',
@@ -49,7 +49,7 @@ const styles = StyleSheet.create({
     textInput: {
         fontSize: cx(16),
         color: '#000',
-        fontFamily: 'helvetica_neue_lt_std_roman',
+        // fontFamily: 'helvetica_neue_lt_std_roman',
     },
     line: {
         height: 1,

package/src/modules/scene/SceneDetailPage.tsx

@@ -159,7 +159,7 @@ export default function SceneDetailPage() {
                           marginStart: cx(24),
                           fontSize: cx(14),
                           color: '#000',
-                          fontFamily: 'helvetica_neue_lt_std_roman',
+                          // fontFamily: 'helvetica_neue_lt_std_roman',
                       }}>{Strings.getLang('Transform time')}</Text>
                       <Slider.Horizontal
                         value={state.transitionTime}
@@ -262,7 +262,7 @@ export default function SceneDetailPage() {
                             tabTextStyle={{
                                 fontSize: cx(14),
                                 color: '#666',
-                                fontFamily: 'helvetica_neue_lt_std_roman',
+                                // fontFamily: 'helvetica_neue_lt_std_roman',
                             }}
                             tabActiveTextStyle={{ color: '#f60' }}
                             tabBarUnderlineStyle={{ backgroundColor: '#f60' }}
@@ -294,12 +294,12 @@ export default function SceneDetailPage() {
                                         <Text style={{
                                             fontSize: cx(14),
                                             color: '#000',
-                                            fontFamily: 'helvetica_neue_lt_std_roman',
+                                            // fontFamily: 'helvetica_neue_lt_std_roman',
                                         }}>{'亮度'}</Text>
                                         <Text style={{
                                             fontSize: cx(14),
                                             color: '#000',
-                                            fontFamily: 'helvetica_neue_lt_std_roman',
+                                            // fontFamily: 'helvetica_neue_lt_std_roman',
                                         }}>{state.currentNode.v}%</Text>
                                     </View>
                                     <Slider.Horizontal
@@ -351,12 +351,12 @@ export default function SceneDetailPage() {
                                         <Text style={{
                                             fontSize: cx(14),
                                             color: '#000',
-                                            fontFamily: 'helvetica_neue_lt_std_roman',
+                                            // fontFamily: 'helvetica_neue_lt_std_roman',
                                         }}>{Strings.getLang('add_new_trigger_time_field_brightness_text')}</Text>
                                         <Text style={{
                                             fontSize: cx(14),
                                             color: '#000',
-                                            fontFamily: 'helvetica_neue_lt_std_roman',
+                                            // fontFamily: 'helvetica_neue_lt_std_roman',
                                         }}>{state.currentNode.brightness}%</Text>
                                     </View>
                                     <Slider.Horizontal

package/src/modules/scene/ScenePage.tsx

@@ -66,7 +66,7 @@ const ScenePage = () => {
                         color: '#fff',
                         fontSize: cx(18),
                         letterSpacing: 0.2,
-                        fontFamily: 'helvetica_neue_lt_std_roman',
+                        // fontFamily: 'helvetica_neue_lt_std_roman',
                     }}>{item.name}</Text>
                 </ImageBackground>
             </TouchableOpacity>
@@ -99,7 +99,7 @@ const ScenePage = () => {
                         color: '#fff',
                         fontSize: cx(40),
                         letterSpacing: 4,
-                        fontFamily: 'helvetica_neue_lt_std_roman',
+                        // fontFamily: 'helvetica_neue_lt_std_roman',
                     }}>{state.currentScene?.name}</Text>
                 </View>
                 <View
@@ -114,7 +114,7 @@ const ScenePage = () => {
                         style={{
                             color: '#fff',
                             fontSize: cx(16),
-                            fontFamily: 'helvetica_neue_lt_std_roman',
+                            // fontFamily: 'helvetica_neue_lt_std_roman',
                         }}>{Strings.getLang('Current scene')}</Text>
                     <TouchableOpacity
                         style={{ padding: cx(10) }}

package/src/modules/select/SelectPage.tsx

@@ -95,7 +95,7 @@ const styles = StyleSheet.create({
     marginStart: cx(16),
     color: '#f60',
     fontSize: cx(17),
-    fontFamily: 'helvetica_neue_lt_std_roman',
+    // fontFamily: 'helvetica_neue_lt_std_roman',
   },
   title: {
     width: '100%',
@@ -105,7 +105,7 @@ const styles = StyleSheet.create({
     color: '#000',
     fontSize: cx(17),
     paddingHorizontal: cx(110),
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
   },
   card: {
     marginHorizontal: cx(16),
@@ -120,7 +120,7 @@ const styles = StyleSheet.create({
     marginStart: cx(13),
     color: '#000',
     fontSize: cx(17),
-    fontFamily: 'helvetica_neue_lt_std_roman',
+    // fontFamily: 'helvetica_neue_lt_std_roman',
   },
   itemLine: {
     height: cx(1),

package/src/modules/timeSchedule/LdvScheduleItem.tsx

@@ -89,19 +89,19 @@ const styles = StyleSheet.create({
     time: {
         marginBottom: convertX(5),
         fontSize: 16,
-        fontFamily: 'helvetica_neue_lt_std_bd',
+        // fontFamily: 'helvetica_neue_lt_std_bd',
         fontWeight: 'bold',
     },
     loop: {
         color: '#000',
         fontSize: convertX(14),
-        fontFamily: 'helvetica_neue_lt_std_bd',
+        // fontFamily: 'helvetica_neue_lt_std_bd',
         marginTop: convertX(8),
     },
     name: {
         color: '#000',
         fontSize: convertX(14),
-        fontFamily: 'helvetica_neue_lt_std_bd',
+        // fontFamily: 'helvetica_neue_lt_std_bd',
         marginTop: convertX(8),
     },
     switchContainer: {

package/src/modules/timeSchedule/TimeScheduleEditpage.tsx

@@ -692,7 +692,7 @@ const styles = StyleSheet.create({
   },
   loopText: {
     fontSize: cx(14),
-    fontFamily: 'PingFangSC-Medium',
+    // fontFamily: 'PingFangSC-Medium',
     color: '#999999',
     marginTop: cx(10),
   },
@@ -700,7 +700,7 @@ const styles = StyleSheet.create({
     color: '#000',
     fontSize: cx(16),
     fontWeight: 'bold',
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
     marginTop: cx(30),
     marginBottom: cx(10),
   },
@@ -723,7 +723,7 @@ const styles = StyleSheet.create({
   switchCardTitle: {
     color: '#000',
     fontSize: cx(16),
-    fontFamily: 'helvetica_neue_lt_std_bd',
+    // fontFamily: 'helvetica_neue_lt_std_bd',
   },
   skillListItem: {
     flexDirection: 'row',

package/src/modules/timer/TimerPage.tsx

@@ -170,7 +170,7 @@ const TimerPage = (props: {theme?: ThemeType}) => {
       color: props.theme?.global.fontColor,
       fontSize: cx(16),
       fontWeight: 'bold',
-      fontFamily: 'helvetica_neue_lt_std_bd',
+      // fontFamily: 'helvetica_neue_lt_std_bd',
       marginTop: cx(30),
       marginBottom: cx(10)
     },

package/src/newModules/biorhythm/BiorhythmEditPage.tsx

@@ -112,7 +112,7 @@ const BiorhythmEditPage = (props: { theme?: ThemeType }) => {
     title: {
       color: props.theme?.global.fontColor,
       fontSize: cx(16),
-      fontFamily: 'helvetica_neue_lt_std_bd',
+      // fontFamily: 'helvetica_neue_lt_std_bd',
       paddingVertical: cx(16),
     },
   })
@@ -195,7 +195,13 @@ const BiorhythmEditPage = (props: { theme?: ThemeType }) => {
             </TouchableOpacity>
           </View>
           <Text
-            style={{ fontSize: cx(16), color: props.theme?.global.fontColor, fontFamily: 'helvetica_neue_lt_std_bd', marginTop: cx(33), marginBottom: cx(16) }}>
+            style={{
+              fontSize: cx(16),
+              color: props.theme?.global.fontColor,
+              // fontFamily: 'helvetica_neue_lt_std_bd',
+              marginTop: cx(33),
+              marginBottom: cx(16)
+          }}>
             {I18n.getLang('add_new_trigger_time_subheadline_text')}
           </Text>
           <Card>

package/src/newModules/biorhythm/BiorhythmPage.tsx

@@ -224,7 +224,7 @@ const BiorhythmPage = (props: { theme?: ThemeType }) => {
             <Text
                 onPress={openLink}
                 style={{
-                  fontFamily: 'helvetica_neue_lt_std_roman',
+                  // fontFamily: 'helvetica_neue_lt_std_roman',
                   color: props.theme?.button.primary,
                   textDecorationLine: 'underline',
                   flexWrap: 'wrap',
@@ -343,7 +343,7 @@ const BiorhythmPage = (props: { theme?: ThemeType }) => {
                 <Text style={{
                   fontSize: cx(16),
                   color: props.theme?.textInput.fontColor,
-                  fontFamily: 'helvetica_neue_lt_std_roman',
+                  // fontFamily: 'helvetica_neue_lt_std_roman',
                   paddingLeft: cx(16),
                 }}>
                   {
@@ -524,7 +524,7 @@ const BiorhythmPage = (props: { theme?: ThemeType }) => {
                           style={{
                             fontSize: cx(16),
                             color: props.theme?.global.fontColor,
-                            fontFamily: 'helvetica_neue_lt_std_roman',
+                            // fontFamily: 'helvetica_neue_lt_std_roman',
                           }}
                         >
                           {convertMinutesTo12HourFormat(item.time, is24Hour)}
@@ -546,7 +546,7 @@ const BiorhythmPage = (props: { theme?: ThemeType }) => {
                         style={{
                           fontSize: cx(12),
                           color: props.theme?.global.secondFontColor,
-                          fontFamily: 'helvetica_neue_lt_std_roman',
+                          // fontFamily: 'helvetica_neue_lt_std_roman',
                           paddingLeft: cx(20),
                         }}
                       >
@@ -576,7 +576,7 @@ const BiorhythmPage = (props: { theme?: ThemeType }) => {
                     text={I18n.getLang('bio_ryhthm_default_button_reset_text')}
                     textStyle={{
                       fontSize: cx(16),
-                      fontFamily: 'helvetica_neue_lt_std_roman',
+                      // fontFamily: 'helvetica_neue_lt_std_roman',
                     }}
                     onPress={() => {
                       showCommonDialog({

package/src/newModules/biorhythm/IconSelect.tsx

@@ -1,13 +1,15 @@
 import { useNavigation, useRoute } from '@react-navigation/native'
-import React, { useEffect, useState } from 'react'
-import { Image, ScrollView, Text, TouchableOpacity, View } from 'react-native'
+import React, { useCallback, useEffect, useMemo, useState } from 'react'
+// 导入 Dimensions API 来获取屏幕宽度
+import { Dimensions, Image, ScrollView, StyleSheet, Text, TouchableOpacity, View } from 'react-native'
 import { Utils } from 'tuya-panel-kit'
 import iconList from '../biorhythm/iconListData'
 import LDVTopBar from '@ledvance/base/src/components/ldvTopBar'
 import I18n from '@ledvance/base/src/i18n'
 import ThemeType from '@ledvance/base/src/config/themeType'
+import { xLog } from '@ledvance/base/src/utils'
 
-const cx = Utils.RatioUtils.convertX
+const { convertX: cx } = Utils.RatioUtils
 const { withTheme } = Utils.ThemeUtils
 
 interface SceneDetailPageParams {
@@ -17,6 +19,13 @@ interface SceneDetailPageParams {
   iconIdList: any
 }
 
+// --- 新增：定义常量，方便维护 ---
+const ICON_WIDTH = cx(32)
+const ICON_MARGIN = cx(10)
+const CONTAINER_HORIZONTAL_PADDING = cx(24)
+// 每个图标占据的总宽度（图片宽度 + 左右margin）
+const ITEM_TOTAL_WIDTH = ICON_WIDTH + ICON_MARGIN * 2
+
 function IconSelect(props: { theme?: ThemeType }) {
   const [list, setList] = useState(iconList)
   const navigation = useNavigation()
@@ -27,7 +36,7 @@ function IconSelect(props: { theme?: ThemeType }) {
         ...item,
         selectStatus: item?.id === id,
       }
-    })
+    }) as typeof list
     setList(newList)
   }
   useEffect(() => {
@@ -39,26 +48,74 @@ function IconSelect(props: { theme?: ThemeType }) {
         selectStatus: item?.id === iconId,
         disabled: iconIdList?.some(val => val === item?.id && val !== iconId),
       }
-    })
+    }) as typeof list
     setList(newList)
   }, [])
-  useEffect(() =>{
-    console.log(list, '< --- listttt')
-  }, [list])
+
+  const getStyles = useCallback((theme?: ThemeType) => StyleSheet.create({
+    container: { flex: 1, flexDirection: 'column' },
+    scrollView: { marginHorizontal: CONTAINER_HORIZONTAL_PADDING },
+    titleView: { marginTop: cx(40), marginBottom: cx(20) },
+    title: { fontSize: cx(24), color: theme?.global.brand },
+    iconContainer: {
+      flexDirection: 'row',
+      flex: 1,
+      flexWrap: 'wrap',
+      justifyContent: 'space-between',
+      alignItems: 'center'
+    },
+    ghostItem: {
+      width: ICON_WIDTH,
+      height: 0,
+      margin: ICON_MARGIN,
+    }
+  }), [CONTAINER_HORIZONTAL_PADDING, ICON_WIDTH, ICON_MARGIN])
+
+  const styles = useMemo(() => getStyles(props.theme), [props.theme])
+
+  // --- 新增：动态计算需要渲染的幽灵元素数量 ---
+  const ghostElements = useMemo(() => {
+
+    // 1. 获取容器的可用宽度
+    const containerWidth = cx(Dimensions.get('window').width) - CONTAINER_HORIZONTAL_PADDING * 2
+
+    // 2. 计算每行可以容纳多少个元素
+    const itemsPerRow = Math.ceil(containerWidth / ITEM_TOTAL_WIDTH)
+    // 如果无法容纳任何元素，则不渲染幽灵元素
+    if (itemsPerRow <= 0) {
+      xLog('No ghost elements needed.')
+      return null
+    }
+
+    // 3. 计算需要补充的幽灵元素数量
+    const numberOfItems = list.length
+    const itemsInLastRow = numberOfItems % itemsPerRow
+
+    // 如果最后一行为空或已满，则不需要幽灵元素
+    if (itemsInLastRow === 0) {
+      return null
+    }
+
+    const numberOfGhosts = itemsPerRow - itemsInLastRow
+
+    // 4. 返回一个包含正确数量幽灵元素的数组
+    return Array.from({ length: numberOfGhosts }).map((_, index) => (
+      <View key={`ghost-${index}`} style={styles.ghostItem}/>
+    ))
+  }, [list.length]) // 依赖项：当图标总数变化时重新计算
+
   return (
-    <View style={{ flex: 1, flexDirection: 'column' }}>
+    <View style={styles.container}>
       <LDVTopBar
         title={params.backText ?? I18n.getLang('add_new_trigger_time_system_back_text')}
-        onBackPress={() => {
-          navigation.goBack()
-        }}
+        onBackPress={() => navigation.goBack()}
       />
-      <ScrollView nestedScrollEnabled={true} style={{ marginHorizontal: cx(24) }}>
-        <View style={{ marginTop: cx(40), marginBottom: cx(20) }}>
-          <Text style={{ fontSize: cx(24), color: props.theme?.global.brand }}>{I18n.getLang('add_new_trigger_time_icon_selection_headline_text')}</Text>
+      <ScrollView nestedScrollEnabled={true} style={styles.scrollView}>
+        <View style={styles.titleView}>
+          <Text style={styles.title}>{I18n.getLang('add_new_trigger_time_icon_selection_headline_text')}</Text>
         </View>
-        <View
-          style={{ flexDirection: 'row', flex: 1, flexWrap: 'wrap', justifyContent: 'space-between', alignItems: 'flex-start' }}>
+        <View style={styles.iconContainer}>
+          {/* 渲染真实的图标 */}
           {list?.map(item => {
             return <TouchableOpacity
               onPress={() => {
@@ -71,14 +128,17 @@ function IconSelect(props: { theme?: ThemeType }) {
               <Image
                 source={{ uri: item?.icon }}
                 style={{
-                  width: cx(32),
-                  height: cx(32),
-                  margin: cx(10),
+                  width: ICON_WIDTH,
+                  height: cx(32), // 高度保持不变
+                  margin: ICON_MARGIN,
                   tintColor: item?.selectStatus ? props.theme?.icon.primary : item?.disabled && props.theme?.icon.disable || props.theme?.icon.normal,
                 }}
               />
             </TouchableOpacity>
           })}
+
+          {/* 渲染精确计算出的幽灵元素 */}
+          {ghostElements}
         </View>
       </ScrollView>
     </View>

package/src/newModules/childLock/ChildLockPage.tsx

@@ -48,7 +48,7 @@ const ChildLockPage = (props: { theme?: ThemeType }) => {
     title: {
       color: props.theme?.global.fontColor,
       fontSize: cx(14),
-      fontFamily: 'helvetica_neue_lt_std_bd',
+      // fontFamily: 'helvetica_neue_lt_std_bd',
       paddingVertical: cx(16),
     },
     shadow: {

package/src/newModules/diyScene/DiySceneEditorPage.tsx

@@ -180,7 +180,7 @@ const DiySceneEditorPage = (props: { theme?: ThemeType }) => {
     deleteBtnText: {
       color: props.theme?.button.fontColor,
       fontSize: cx(16),
-      fontFamily: 'helvetica_neue_lt_std_bd',
+      // fontFamily: 'helvetica_neue_lt_std_bd',
     },
   })