react native ant design

Posted 2023-03-15

参考技术A Drawer is a panel that displays the app's navigation options on the left edge of the screen.

在点击控件或者某个区域后，浮出一个气泡菜单来做更多的操作。 如果设置了遮罩层，建议通过点击遮罩层的任一位置，进行退出。

分隔长列表，每次只加载一个页面。

由至少 2 个分段控件组成，用作不同视图的显示；是 ios 的推荐组件。

规则

用于让用户在不同的视图中进行切换。

位于 APP 底部，方便用户在不同功能模块之间进行快速切换。

点击后会触发一个操作。

复选框

DatePickerView 的功能类似于 DatePicker ，但它是直接渲染在区域中，而不是弹出窗口。

用于选择日期或者时间。

用于接受单行文本。

注意：只是图片选择器，一般用于上传图片前的文件选择操作，但不包括图片上传的功能

权限相关的问题可以移步至： https://github.com/ant-design/ant-design-mobile-rn/issues/90 查看

PickerView 的功能类似于 Picker ，但它是直接渲染在区域中，而不是弹出窗口。

在一组预设数据中进行选择，e.g. 省市区选择。

在两个互斥对象进行选择，eg：选择开或关。

用作增加或者减少当前数值。

允许用户在一个区间中选择特定值，eg：控制屏幕的显示亮度。

一般可位于 NavBar 下方，通过『取消按钮』退出激活状态。

用于接受多行文本。

图标右上角的红点、数字或者文字。用于告知用户，该区域的状态变化或者待处理任务的数量。

可以折叠/展开的内容区域。

走马灯，轮播图

在水平和垂直方向，将布局切分成若干等大的区块。

单个连续模块垂直排列，显示当前的内容、状态和可进行的操作。eg：联系人列表。

当你需要一个 infinite scroll 列表时，请使用 ListView 。

从 3.0.0 开始使用 ant-design-icons 字体图标不需要单独安装但是需要 link

更多信息请查看 https://github.com/ant-design/ant-design-icons/tree/master/packages/icons-react-native

安装完成后需要link字体文件

使用方式：

在导航栏下方，一般用作系统提醒、活动提醒等通知。

进行标记和分类的小标签，用于标记事物的属性和维度，以及进行分类。

显示一个任务的进度；或者引导用户完成某个复杂任务。

从底部弹出的模态框，提供和当前场景相关的 2 个以上的操作动作，也支持提供标题和描述。内置固定的展示样式、不支持特别灵活的修改。

活动指示器。 表明某个任务正在进行中。

用作显示系统的重要信息，并请求用户进行操作反馈，eg：删除某个重要内容时，弹出 Modal 进行二次确认。

表明某个任务的当前进度。

一种轻量级反馈/提示，可以用来显示不会打断用户操作的内容，适合用于页面转场、数据交互的等场景中。

在整张页面中组织插画、图标、文字等内容，向用户反馈操作结果。

在整张页面中组织插画、图标、文字等内容，向用户反馈操作结果。

为组件内建文案提供统一的国际化支持。

Provider 使用 React 的 context 特性，只需在应用外围包裹一次即可全局生效。

我们暂时只提供英语，中文两种语言支持（ 默认语言是中文 ），所有语言包可以在 这里 找到。

如果你找不到你需要的语言包，欢迎你在 英文语言包 的基础上创建一个新的语言包，并给我们 Pull Request。

本模块仅用于组件的内建文案，若有业务文案的国际化需求，建议使用 react-intl ，可参考示例： Intl demo 1 和 Intl demo 2 。