当前位置: 首页 > 软件库 > 手机/移动开发 > >

ant-design-mobile-rn

Ant Design for React Native
授权协议 MIT License
开发语言 Java
所属分类 手机/移动开发
软件类型 开源软件
地区 不详
投 递 者 袁俊弼
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

English | 简体中文

Ant Design Mobile RN

A configurable Mobile UI specification and React-based implementation.

Features

  • Follow Ant Design Mobile UI specification.
  • Configurable UI style for different products.
  • Support web and native usages based on React Native.
  • Develop in TypeScript.

Demo

# clone
git clone git@github.com:ant-design/ant-design-mobile-rn.git

# go to ant rn folder
cd ant-design-mobile-rn

# install dependencies
yarn

# start ios simulator or android
# cd rn-kitchen-sink/ios && pod install
yarn ios # or yarn android

Install & Usage

$ npm install @ant-design/react-native --save

or

yarn add @ant-design/react-native

Installing peer dependencies

npm install @react-native-community/cameraroll @react-native-picker/picker @react-native-community/segmented-control @react-native-community/slider react-native-pager-view

or

yarn add @react-native-community/cameraroll @react-native-picker/picker @react-native-community/segmented-control @react-native-community/slider react-native-pager-view react-native-gesture-handler

You need go to ios folder and run pod install (auto linking),Android will handle it by itself.

Link icon fonts

npx react-native link

introduce

Links

Contributing

We welcome all contributions, please read our CONTRIBUTING.md first. You can submit any ideas as pull requests or as a GitHub issue. If you'd like to improve code, check out the Development Instruction and have a good time! :)

  • 1、使用ant-design组件的时候,我们有时候需要自定义去改变组件的一些样式。 2、这里我们可以只用全局样式定义去改变对应类的样式 3、举例 我要去改变ListView组件的背景样式 <ListView style={{ overflow: 'auto', height: `${height}p

  •  阿里 ant-design  菜单比较丰富 https://github.com/ant-design/ant-design-mobile   天和风雨顺 地和五谷丰 人和事业旺 家和万事兴 转载于:https://www.cnblogs.com/wukong1688/p/11067609.html

  •   https://antd-mobile.gitee.io/index-cn     https://ant-design.gitee.io/index-cn

  • 如果网络不好的时候ant-design 的官网很难打开的 ,用下面的镜像地址就可以打开啦 ant-design 官网镜像地址: http://ant-design.gitee.io/index-cn ant-design-pro镜像地址: http://ant-design-pro.gitee.io/index-cn antd-mobile镜像地址: https://antd-mobile.git

  • ant-design地址打不开,可能和网络有关,用下面的镜像地址就可以打开 ant-design-pro镜像地址: http://ant-design-pro.gitee.io/index-cn antd-mobile镜像地址: https://antd-mobile.gitee.io/index-cn ant-design像地址 http://ant-design.gitee.io/index-

  • 知识点GET Ant design组件安装 搜索栏SearchBar 宫格Grid的使用 Hook简介 涉及的网址 1.ant design rn 官网https://rn.mobile.ant.design/components/grid-cn/ 2.Hook 简介 https://react.docschina.org/docs/hooks-intro.html 创建项目并安装ant desi

  • 首先创建RN工程,参照我的另一篇文章:创建RN工程 1. 添加组件库: npm install @ant-design/react-native --save npm add babel-plugin-import // 遇到了几个错误: npm install --save babel-preset-react-native@5 npm add @react-native-community/

  • Install: yarn add @ant-design/icons-react-native Linking: react-native link @ant-design/icons-react-native 运行以上命令

 相关资料
  • Ant Design Mobile Ant Design 移动端设计规范,一个基于 Preact/React/React Native 的 UI 组件库。antd-mobile 是 Ant Design 的移动规范的 React 实现,服务于蚂蚁及口碑无线业务。 特性 基于 Ant Design 移动设计规范。 规则化的视觉样式配置,适应各类产品风格。 基于 React Native 的多平台支持

  •  Ant Design,一套企业级 UI 设计语言和 React 组件库。 ✨ 特性 �� 提炼自企业级中后台产品的交互语言和视觉风格。 �� 开箱即用的高质量 React 组件。 �� 使用 TypeScript 开发,提供完整的类型定义文件。 ⚙️ 全链路开发和设计工具体系。 �� 数十个国际化语言支持。 �� 深入每个细节的主题定制能力。 �� 支持环境 现代浏览器和 IE11 及以上。 支

  • Ant Design Blazor 是一套基于 Ant Design 和 Blazor 的企业级组件库。 特性 提炼自企业级中后台产品的交互语言和视觉风格。 开箱即用的高质量 Blazor 组件,可在多种托管方式共享。 支持基于 WebAssembly 的客户端和基于 SignalR 的服务端 UI 事件交互。 支持渐进式 Web 应用(PWA) 使用 C# 构建,多范式静态语言带来高效的开发体验

  • Ant Design Pro 是一套开箱即用的中台前端/设计解决方案。 特性 优雅美观:基于 Ant Design 体系精心设计 常见设计模式:提炼自中后台应用的典型页面和场景 最新技术栈:使用 React/dva/antd 等前端前沿技术开发 响应式:针对不同屏幕大小设计 主题:可配置的主题满足多样化的品牌诉求 国际化:内建业界通用的国际化方案 最佳实践:良好的工程实践助您持续产出高质量代码 M

  • Ant Design Vue 是使用 Vue 实现的遵循 Ant Design 设计规范的高质量 UI 组件库,用于开发和服务于企业级中后台产品。 特性 提炼自企业级中后台产品的交互语言和视觉风格。 开箱即用的高质量 Vue 组件。 共享 Ant Design of React 设计工具体系。 支持环境 现代浏览器和 IE9 及以上(需要 polyfills)。 支持服务端渲染。 安装 使用 np

  • ⭐ The abstract trees of the Ant Design SVG icons. Packages Vanilla: @ant-design/icons-svg React: @ant-design/icons React Native: @ant-design/icons-react-native Angular: @ant-design/icons-angular Vue: