React Native 底部工作表更改栏颜色

Question

如何更改底部表单模式顶部栏的颜色？我查看了文档和软件包，但没有看到任何可以更改它的内容。我尝试更改背景颜色，但效果不佳。

<BottomSheetModal
  ref={bottomSheetModalRef}
  index={0}
  snapPoints={snapPoints}
  onChange={handleSheetChanges}>
  <View
    style={{
      flex: 1,
      backgroundColor: Colors.darkMode.cards1,
    }}>
    <Pressable
      style={{
        flexGrow: 1,
        alignItems: 'center',
        height: 40,
        borderRadius: 9,
        paddingVertical: 4,
        paddingHorizontal: 2,
        justifyContent: 'center',
      }}>
      <Text
        style={{
          color: Colors.gtechGold,
          fontSize: 17,
          fontFamily: 'RobotoSlab-Medium',
        }}>
        Test
      </Text>
    </Pressable>
  </View>
</BottomSheetModal>

Answer 1

您可以修改两个属性来更改底部工作表上的顶栏颜色：handleStyle 和 handleIndicatorStyle。

 <BottomSheetModal
  ..."your props"
  handleIndicatorStyle={{backgroundColor:"red"}}
  handleStyle={{backgroundColor:"red"}}
  >
      ...."your code"...
</BottomSheetModal>