模板版本:v0.4.0

react-native-material-ui

本项目基于 react-native-material-ui 开发。

该第三方库的仓库已迁移至 Gitcode,且支持直接从 npm 下载,新的包名为:@react-native-ohos/react-native-material-ui。 版本所属关系如下:

三方库名称 三方库版本 发布信息 支持RN版本 Autolink 编译API版本 社区基线版本 npm地址
@react-native-ohos/react-native-material-ui ~1.31.0 Gitcode Releases 0.77.* /0.82.* API12+ 1.30.1 Npm Address
@react-native-ohos/react-native-material-ui ~1.30.2 Gitcode Releases 0.72.* API12+ 1.30.1 Npm Address
@react-native-oh-tpl/react-native-material-ui <=1.30.1-0.0.1@deprecated Github Releases(deprecated) 0.72.* API12+ 1.30.1 Npm Address

1. 安装与使用

进入到工程目录并输入以下命令:

npm

npm install  @react-native-ohos/react-native-material-ui

yarn

yarn add  @react-native-ohos/react-native-material-ui

下面的代码展示了这个库的基本使用场景:

使用时 import 的库名不变。


import { ActionButton} from 'react-native-material-ui';
import { View, StyleSheet,ScrollView,Text } from 'react-native'
import { useState } from 'react';

const ActionButtonDemo = () => {
  const [actionText,setActionText] = useState('')
  return (
      <>
        <ScrollView style={styles.scrollView}>
              <View style={styles.view}>
                <ActionButton
                  actions={[
                    { icon: 'email', label: 'Email',name:'email'},
                    { icon: 'phone', label: 'Phone',name:'Phone' },
                    { icon: 'sms', label: 'Text',name:'Text' },
                    { icon: 'chat', label: 'chat',name:'chat' },
                ]}
                  icon='email'
                  transition="speedDial"
                />
              </View>

              <View style={styles.view}>
                <ActionButton
                  onPress={()=>setActionText("onPress actionText")}
                  actions={[
                    { icon: 'email', label: 'Email',name:'email'},
                    { icon: 'phone', label: 'Phone',name:'Phone' },
                    { icon: 'sms', label: 'Text',name:'Text' },
                    { icon: 'chat', label: 'chat',name:'chat' },
                ]}
                  icon='email'
                  transition="speedDial"
                />
                <Text>{actionText}</Text>
              </View>

              <View style={styles.view}>
                <ActionButton
                  actions={[{ icon: 'email', label: 'email', name: 'email' },
                  { icon: 'phone', label: 'Phone', name: 'phone' },
                  { icon: 'sms', label: 'sms', name: 'sms' },
                  { icon: 'chat', label: 'chat', name: 'chat' }]}
                  icon="share"
                  transition="toolbar"
                />
              </View>

              <View style={styles.view}>
                <ActionButton
                  style={{container:{backgroundColor:'blue'},icon:{color:'red'},positionContainer:{top:2,bottom:2}}}
                  actions={[
                    { icon: 'email', label: 'Email',name:'email'},
                    { icon: 'phone', label: 'Phone',name:'Phone' },
                    { icon: 'sms', label: 'Text',name:'Text' },
                    { icon: 'chat', label: 'chat',name:'chat' },
                ]}
                  icon='email'
                  transition="speedDial"
                />
                <Text>{actionText}</Text>
              </View>

              <View style={styles.view}>
                <ActionButton
                style={{toolbarContainer:{backgroundColor:'blue'}}}
                  actions={[{ icon: 'email', label: 'email', name: 'email' },
                  { icon: 'phone', label: 'Phone', name: 'phone' },
                  { icon: 'sms', label: 'sms', name: 'sms' },
                  { icon: 'chat', label: 'chat', name: 'chat' }]}
                  icon="share"
                  transition="toolbar"
                />
              </View>
          </ScrollView>  
          </>
  )
}

const styles = StyleSheet.create({
  view: {
    width: '100%',
    height: 350,
  },
  scrollView:{
    marginBottom:70
  }
});

export default ActionButtonDemo

在 ArkTs 侧引入和注册字体文件

步骤一: 复制字体文件到 entry/src/main/resources/rawfile/assets/assets/fonts 目录下(如使用了外部字体文件,需要将*.ttf 文件复制过来)

步骤二: 打开 entry/src/main/ets/pages/Index.ets,添加以下代码

 const fonts: Record<string, Resource> = {
   "Pacifico-Regular": $rawfile("assets/assets/fonts/Pacifico-Regular.ttf"),
   "StintUltraCondensed-Regular": $rawfile("assets/assets/fonts/StintUltraCondensed-Regular.ttf"),
   'Entypo': $rawfile('assets/assets/fonts/Entypo.ttf'),
   'EvilIcons': $rawfile('assets/assets/fonts/EvilIcons.ttf'),
   'Feather': $rawfile('assets/assets/fonts/Feather.ttf'),
   'FontAwesome': $rawfile('assets/assets/fonts/FontAwesome.ttf'),
   'FontAwesome5Brands-Regular': $rawfile('assets/assets/fonts/FontAwesome5_Brands.ttf'),
   'FontAwesome5Free-Regular': $rawfile('assets/assets/fonts/FontAwesome5_Regular.ttf'),
   'FontAwesome5Free-Solid': $rawfile('assets/assets/fonts/FontAwesome5_Solid.ttf'),
   'FontAwesome6Brands-Regular': $rawfile('assets/assets/fonts/FontAwesome6_Brands.ttf'),
   'FontAwesome6Free-Regular': $rawfile('assets/assets/fonts/FontAwesome6_Regular.ttf'),
   'FontAwesome6Free-Solid': $rawfile('assets/assets/fonts/FontAwesome6_Solid.ttf'),
   'fontcustom': $rawfile('assets/assets/fonts/Foundation.ttf'),
   'Ionicons': $rawfile('assets/assets/fonts/Ionicons.ttf'),
   'Material Design Icons': $rawfile('assets/assets/fonts/MaterialCommunityIcons.ttf'),
   'Material Icons': $rawfile('assets/assets/fonts/MaterialIcons.ttf'),
   'Octicons': $rawfile('assets/assets/fonts/Octicons.ttf'),
   'simple-line-icons': $rawfile('assets/assets/fonts/SimpleLineIcons.ttf'),
   'zocial': $rawfile('assets/assets/fonts/Zocial.ttf'),
 }

@Entry
@Component
struct Index {
  //...
  build() {
    Column(){
      //...

      //注册字体文件
      RNApp({
        rnInstanceConfig: {
          //...
          fontResourceByFontFamily: fonts
        },
        //...
      })

    }
    //...
  }
}

2. 约束与限制

2.1. 兼容性

本文档内容基于以下版本验证通过:

  1. RNOH: 0.72.96; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.858; ROM: 6.0.0.112;
  2. RNOH: 0.72.33; SDK: HarmonyOS NEXT B1; IDE: DevEco Studio 5.0.3.900; ROM: Next.0.0.71;
  3. RNOH: 0.77.18; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.858; ROM: 6.0.0.112;
  4. RNOH: 0.82.1; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.858; ROM: 6.0.0.112;

3. 组件

"Platform"列表示该属性在原三方库上支持的平台。

"HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性;no 则表示不支持;partially 表示部分支持。使用方法跨平台一致,效果对标 iOS 或 Android 的效果。

ActionButton

Name Description Type Required Platform HarmonyOS Support
actions 图标名称(或元素)的数组,在主按钮被按下后显示 string[] no iOS/Android yes
onPress 按钮被按下时调用 PropTypes.func no iOS/Android yes
icon 图标将显示在文本之前 PropTypes.element
PropTypes.string
no iOS/Android yes
transition 过渡效果 PropTypes.oneOf(['toolbar', 'speedDial']) no iOS/Android yes
style 可以覆盖此按钮的任何样式 ActionButton style props no iOS/Android yes

ActionButton style props

Name Description Type Required Platform HarmonyOS Support
container 容器样式 View.propTypes.style no iOS/Android yes
icon 图标样式 Text.propTypes.style no iOS/Android yes
positionContainer 位置容器样式 View.propTypes.style no iOS/Android yes
toolbarContainer 工具栏样式 View.propTypes.style no iOS/Android yes

Avatar

Name Description Type Required Platform HarmonyOS Support
image 渲染图片 PropTypes.shape({ type: PropTypes.oneOf([Image]) }), no iOS/Android yes
icon 在头像内部渲染图标元素 PropTypes.string no iOS/Android yes
iconColor 渲染该颜色的图标 PropTypes.string no iOS/Android yes
iconSize 渲染该大小的图标 PropTypes.number no iOS/Android yes
text 在头像内部渲染文本元素 PropTypes.string no iOS/Android yes
size 头像大小 PropTypes.number no iOS/Android yes
style 头像的内联样式 container: View.propTypes.style
content: Text.propTypes.style
no iOS/Android yes

Badge

Name Description Type Required Platform HarmonyOS Support
children 徽章将相对于此节点添加 PropTypes.node no iOS/Android yes
text 徽章内渲染的内容 PropTypes.string no iOS/Android yes
icon 图标 PropTypes.string,{name:string,color,size} no iOS/Android yes
size 徽章大小 PropTypes.number no iOS/Android yes
stroke 徽章的描边宽度 PropTypes.number no iOS/Android yes
style 可以覆盖此徽章的任何样式 PropTypes.array no iOS/Android yes

Icon

Name Description Type Required Platform HarmonyOS Support
name 图标名称 string yes iOS/Android yes
style 图标的样式 ViewStyle no iOS/Android yes
size 图标的大小 number no iOS/Android yes
color 图标的颜色 string no iOS/Android yes

IconToggle

Name Description Type Required Platform HarmonyOS Support
color 图标的颜色 PropTypes.string no iOS/Android yes
maxOpacity 涟漪效果的最大不透明度 PropTypes.number no iOS/Android yes
percent 底色的大小 PropTypes.number no iOS/Android yes
disabled 如果为 true,将禁止交互 PropTypes.bool no iOS/Android yes
size 图标的大小(默认值为 24,参见调色板中的间距) PropTypes.number no iOS/Android yes
name 要显示的图标名称 PropTypes.string.isRequired yes iOS/Android yes
children 如果存在,将替代图标使用(参见 name 属性) PropTypes.element no iOS/Android yes
onPress IconToggle 被按下时调用 PropTypes.func no iOS/Android yes
style 可以覆盖此 IconToggle 的任何样式 PropTypes.array no iOS/Android yes

BottomNavigation

Name Description Type Required Platform HarmonyOS Support
active 选中/活动选项卡的键值 PropTypes.string no iOS/Android yes
children BottomNavigation.Action 节点 PropTypes.node.isRequired yes iOS/Android yes
hidden 是否显示 BottomNavigation PropTypes.bool no iOS/Android No
style 底部导航的内联样式 container: View.propTypes.style no iOS/Android yes

BottomNavigation.Action

Name Description Type Required Platform HarmonyOS Support
icon 将作为操作的内容渲染在标签上方 PropTypes.string.isRequired yes iOS/Android yes
label 将作为操作的内容渲染在图标下方 PropTypes.string no iOS/Android yes
active 如果操作为活动状态则为 true(目前会以主色调高亮显示) PropTypes.bool.isRequired yes iOS/Android yes
onPress 按下事件的回调函数 PropTypes.func no iOS/Android yes
style 底部导航的内联样式 container: View.propTypes.style
active: Text.propTypes.style
disabled: Text.propTypes.style
no iOS/Android yes

Button

Name Description Type Required Platform HarmonyOS Support
disabled 如果为 true,按钮将被禁用 PropTypes.bool no iOS/Android yes
raised 如果为 true,按钮将具有凸起效果 PropTypes.bool no iOS/Android yes
primary 按钮是否使用主色调 PropTypes.bool no iOS/Android yes
accent 按钮是否使用强调色 PropTypes.bool no iOS/Android yes
onPress 按钮被按下时调用。文本作为参数传入 PropTypes.func no iOS/Android yes
text 按钮上显示的文本 PropTypes.string.isRequired yes iOS/Android yes
upperCase 按钮文本将显示为大写字母 PropTypes.bool no iOS/Android yes
icon 如果指定了该属性,图标将显示在文本之前 PropTypes.string no iOS/Android yes
style 可以覆盖此按钮的任何样式 container: View.propTypes.style
text: Text.propTypes.style
no iOS/Android yes

Card

Name Description Type Required Platform HarmonyOS Support
onPress 卡片被按下时调用 PropTypes.func no iOS/Android yes
style 可以覆盖此卡片的任何样式 PropTypes.object no iOS/Android yes

Checkbox

Name Description Type Required Platform HarmonyOS Support
label 图标后显示的文本 PropTypes.string yes iOS/Android yes
value onCheck 触发时返回的值 PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired yes iOS/Android yes
checked 如果已勾选则为 true PropTypes.bool no iOS/Android yes
disabled 复选框是否可用 PropTypes.bool no iOS/Android yes
uncheckedIcon 当 checked 为 false 时显示的图标 PropTypes.string no iOS/Android yes
checkedIcon 当 checked 为 true 时显示的图标 PropTypes.string no iOS/Android yes
onCheck 状态改变时调用的事件 PropTypes.func yes iOS/Android yes

Dialog:DialogDefaultActions

Name Description Type Required Platform HarmonyOS Support
actions 用于显示卡片的按钮 PropTypes.arrayOf(PropTypes.string).isRequired yes iOS/Android yes
options 这将禁用按钮 PropTypes.shape({ actionName: { disabled: PropTypes.bool } }) no iOS/Android yes
onActionPress 按下卡片按钮时触发的事件 PropTypes.func.isRequired yes iOS/Android yes
style 可以覆盖此卡片的任何样式 PropTypes.shape({ defaultActionsContainer: ViewPropTypes.style, }), no iOS/Android yes

Divider

Name Description Type Required Platform HarmonyOS Support
inset 分隔线向后缩进 PropTypes.bool no iOS/Android yes
style 可以覆盖此分隔线的任何样式 PropTypes.shape({container: View.propTypes.style }) no iOS/Android yes

Drawer

Name Description Type Required Platform HarmonyOS Support
children 抽屉中的子节点 PropTypes.node.isRequired yes iOS/Android yes
style 可以覆盖此抽屉的任何样式 style: PropTypes.shape({ container: ScrollView.propTypes.style, contentContainer: View.propTypes.style}), no iOS/Android yes

Drawer:header

Name Description Type Required Platform HarmonyOS Support
image Drawer.header 的图片 PropTypes.shape({ type: PropTypes.oneOf([Image]) }) no iOS/Android yes
backgroundColor 抽屉头部的背景图片 PropTypes.string no iOS/Android No
children 抽屉头部的子节点 PropTypes.node no iOS/Android yes
style 可以覆盖此抽屉头部的任何样式 style: PropTypes.shape({contentContainer: View.propTypes.style,container: View.propTypes.style, }), no iOS/Android yes

Drawer:HeaderAccount

Name Description Type Required Platform HarmonyOS Support
avatar Drawer.HeaderAccount 的头像 PropTypes.element no iOS/Android yes
accounts Drawer.HeaderAccount 的账户 PropTypes.string no iOS/Android yes
footer Drawer.HeaderAccount 的底部内容 ListItem.propTypes no iOS/Android yes
style 可以覆盖此抽屉头部的任何样式 PropTypes.shape({Drawer:HeaderAccount style}) no iOS/Android yes
Drawer:HeaderAccount style
name Type Required Platform HarmonyOS Support
container View.propTypes.style no iOS/Android yes
accountContainer View.propTypes.style no iOS/Android yes
topContainer View.propTypes.style no iOS/Android yes
avatarsContainer View.propTypes.style no iOS/Android yes
activeAvatarContainer View.propTypes.style no iOS/Android yes
inactiveAvatarContainer View.propTypes.style no iOS/Android yes

Drawer:Section

Name Description Type Required Platform HarmonyOS Support
title 抽屉分区的标题 PropTypes.string yes iOS/Android yes
items 抽屉分区的项目 Drawer:Section items yes iOS/Android yes
divider 抽屉分区的分隔线 PropTypes.bool no iOS/Android yes
style 可以覆盖此抽屉分区的任何样式 PropTypes.shape({Drawer:Section style}) no iOS/Android No
Drawer:Section items
name Type Required Platform HarmonyOS Support
icon PropTypes.string no iOS/Android yes
value PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired yes iOS/Android yes
label PropTypes.string no iOS/Android yes
onPress PropTypes.func no iOS/Android yes
onLongPress PropTypes.func no iOS/Android No
active PropTypes.bool no iOS/Android yes
disabled PropTypes.bool no iOS/Android No

ListItem

Name Description Type Required Platform HarmonyOS Support
dense 是否紧凑显示 PropTypes.bool no iOS/Android yes
divider 是否显示分隔线 PropTypes.bool no iOS/Android yes
onPress ListItem 被按下时调用 PropTypes.func no iOS/Android yes
numberOfLines 行数 PropTypes.oneOf([1, 2, 3, 'dynamic']) no iOS/Android yes
style 可以覆盖此 ListItem 的任何样式 ListItem style no iOS/Android yes
leftElement 左侧元素 PropTypes.oneOfType([ PropTypes.element,PropTypes.string ]) no iOS/Android yes
onLeftElementPress 左侧按钮被按下时触发的事件 PropTypes.func no iOS/Android No
centerElement 中间元素 PropTypes.oneOfType([PropTypes.element, PropTypes.string, PropTypes.shape({primaryText: PropTypes.string.isRequired,secondaryText: PropTypes.string,tertiaryText: PropTypes.string }) ]) yes iOS/Android yes
rightElement 右侧元素 PropTypes.element, PropTypes.string, PropTypes.shape({ menu: PropTypes.shape({ labels: PropTypes.array.isRequired}) }) no iOS/Android yes
onRightElementPress 右侧按钮被按下时触发的事件 PropTypes.func no iOS/Android yes
children 子节点 PropTypes.node no iOS/Android yes
ListItem style
name Type Required Platform HarmonyOS Support
container View.propTypes.style no iOS/Android yes
contentViewContainer View.propTypes.style no iOS/Android yes
leftElementContainer View.propTypes.style no iOS/Android yes
centerElementContainer View.propTypes.style no iOS/Android yes
textViewContainer View.propTypes.style no iOS/Android yes
primaryText Text.propTypes.style no iOS/Android yes
firstLine View.propTypes.style no iOS/Android yes
primaryTextContainer Text.propTypes.style no iOS/Android yes
secondaryText Text.propTypes.style no iOS/Android yes
tertiaryText Text.propTypes.style no iOS/Android yes
rightElementContainer View.propTypes.style no iOS/Android yes
leftElement View.propTypes.style no iOS/Android yes
rightElement View.propTypes.style no iOS/Android yes

Subheader

Name Description Type Required Platform HarmonyOS Support
text 显示的文本 PropTypes.string.isRequired yes iOS/Android yes
inset 副标题向后缩进 PropTypes.bool no iOS/Android yes
lines 副标题行数 PropTypes.number no iOS/Android yes
style 可以覆盖此副标题的任何样式 PropTypes.shape({container: View.propTypes.style ,text:Text.propTypes.style}) no iOS/Android yes

Snackbar

Name Description Type Required Platform HarmonyOS Support
message 要显示的文本消息 PropTypes.string.isRequired yes iOS/Android yes
visible 是否显示 snackbar PropTypes.bool no iOS/Android yes
timeout 显示 snackbar 的时间,单位为毫秒 PropTypes.number no iOS/Android yes
onRequestClose 超时结束时的回调函数 PropTypes.func.isRequired yes iOS/Android yes
bottomNavigation 屏幕上是否有底部导航栏 PropTypes.bool no iOS/Android yes
onActionPress 点击操作按钮时执行的函数 PropTypes.func no iOS/Android yes
actionText 操作按钮上显示的文本标签 PropTypes.string no iOS/Android yes
style snackbar 的内联样式 container: ViewPropTypes.style, message: ViewPropTypes.style, no iOS/Android yes
button 按钮 ButtonProps no iOS/Android yes

Toolbar

Name Description Type Required Platform HarmonyOS Support
isSearchActive 指示搜索是否处于活动状态 PropTypes.bool yes iOS/Android yes
searchable 要激活搜索功能时,需要传入此对象并配置搜索参数 searchable props yes iOS/Android yes
size 工具栏上每个图标的大小 PropTypes.number no iOS/Android yes
style 可以通过此属性覆盖组件的任何样式 Toolbar style no iOS/Android yes
hidden 是否显示工具栏 PropTypes.bool no iOS/Android No
onPress centerElement 被按下时调用 PropTypes.func no iOS/Android yes
leftElement 将显示在左侧 PropTypes.element no iOS/Android yes
onLeftElementPress leftElement 被按下时调用 PropTypes.func no iOS/Android yes
centerElement 将显示在 leftElement 和 rightElement 之间,通常用于标题 PropTypes.element no iOS/Android yes
rightElement 将显示在右侧 rightElement props no iOS/Android yes
onRightElementPress rightElement 被按下时调用 PropTypes.func no iOS/Android yes
searchable props
name Description Type Required Platform HarmonyOS Support
onChangeText 搜索文本改变时调用 PropTypes.func no iOS/Android yes
onSearchClosed 搜索关闭时调用 PropTypes.func no iOS/Android yes
onSearchCloseRequested 请求关闭搜索时调用 PropTypes.func no iOS/Android yes
onSearchPressed 搜索打开时调用 PropTypes.func no iOS/Android yes
onSubmitEditing 用户在硬件键盘上按下提交按钮时调用 PropTypes.func no iOS/Android yes
placeholder 搜索输入框的占位文本 PropTypes.string no iOS/Android yes
autoFocus 指示搜索打开后输入框是否应自动获得焦点 PropTypes.bool no iOS/Android yes
autoCapitalize 启用搜索输入框的自动大写功能 PropTypes.string no iOS/Android No
autoCorrect 启用搜索输入框的自动纠正功能 PropTypes.bool no iOS/Android No
icon 覆盖默认搜索图标 PropTypes.string no iOS/Android yes
rightElement props
name Description Required Platform HarmonyOS Support
PropTypes.element 一个操作(图标名称),相当于 的别名 no iOS/Android yes
PropTypes.string 一个操作(图标名称),相当于 ['icon1'] 的别名 no iOS/Android yes
PropTypes.arrayOf(PropTypes.string), 多个操作:['icon1', 'icon2', ...] no iOS/Android yes
PropTypes.shape 用于操作和菜单。菜单将作为最后一个图标显示 no iOS/Android yes
Toolbar style
name Type Required Platform HarmonyOS Support
container Animated.View.propTypes.style no iOS/Android yes
leftElementContainer View.propTypes.style no iOS/Android yes
leftElement Text.propTypes.style, no iOS/Android yes
centerElementContainer View.propTypes.style no iOS/Android yes
titleText Text.propTypes.style, no iOS/Android yes
rightElementContainer View.propTypes.style no iOS/Android yes
rightElement Text.propTypes.style no iOS/Android yes

4.主题

如果您想使用默认主题,可以跳过此步骤

如果您想更改应用程序的主色,只需将自己的设置传递给 ThemeContext.Provider 对象即可。这些设置将与默认主题合并。

import React, { Component } from 'react';
import { Navigator, NativeModules } from 'react-native';

import { COLOR, ThemeContext, getTheme } from 'react-native-material-ui';

// you can set your style right here, it'll be propagated to application
const uiTheme = {
  palette: {
    primaryColor: COLOR.green500,
  },
  toolbar: {
    container: {
      height: 50,
    },
  },
};

class Main extends Component {
  render() {
    return (
      <ThemeContext.Provider value={getTheme(uiTheme)}>
        <App />
      </ThemeContext.Provider>
    );
  }
}

5.遗留问题

6.其他

  • RadioButton组件功能在Android和iOS不生效, HarmonyOS与Android,iOS表现一致。原库 issue
  • BottomNavigation和Toolbar组件hidden属性功能在Android和iOS不生效, HarmonyOS与Android,iOS表现一致。原库 issue
  • Toolbar组件autoCapitalize属性和autoCorrect功能在Android和iOS不生效, HarmonyOS与Android,iOS表现一致。原库 issue
  • Drawer:Section组件中的style属性设置样式在Android和iOS不生效,HarmonyOS与Android,iOS表现一致。原库 issue
  • Drawer:Section组件中items属性对象中的onLongPress属性和disabled属性在Android和iOS不生效,HarmonyOS与Android,iOS表现一致。原库 issue
  • ListItem组件中onLeftElementPress属性在Android和iOS不生效,HarmonyOS与Android,iOS表现一致。原库 issue
  • Drawer:Header组件中backgroundColor属性与子元素中的Style属性冲突在Android和iOS不生效,HarmonyOS与Android,iOS表现一致。原库 issue

7.开源协议

本项目基于 The MIT License (MIT),请自由地享受和参与开源。