diff --git a/.editorconfig b/.editorconfig new file mode 100755 index 000000000..7e3649acc --- /dev/null +++ b/.editorconfig @@ -0,0 +1,16 @@ +# http://editorconfig.org +root = true + +[*] +indent_style = space +indent_size = 2 +end_of_line = lf +charset = utf-8 +trim_trailing_whitespace = true +insert_final_newline = true + +[*.md] +trim_trailing_whitespace = false + +[Makefile] +indent_style = tab diff --git a/.eslintignore b/.eslintignore new file mode 100644 index 000000000..f50ccf390 --- /dev/null +++ b/.eslintignore @@ -0,0 +1,8 @@ +es/** +demo/es/** +plugin/** +src/.umi/** +src/.umi-production/** +dist/** +docs-dist/** +node_modules diff --git a/.eslintrc b/.eslintrc new file mode 100644 index 000000000..d5ac563d6 --- /dev/null +++ b/.eslintrc @@ -0,0 +1,25 @@ +{ + "env": { + "node": true + }, + "globals": { + "my": true, + "App": true, + "Component": true, + "Page": true + }, + "parser": "@typescript-eslint/parser", + "plugins": [ + "@typescript-eslint" + ], + "extends": [ + "eslint:recommended", + "plugin:@typescript-eslint/eslint-recommended", + "plugin:@typescript-eslint/recommended" + ], + "rules": { + "no-console": "warn", + "@typescript-eslint/no-var-requires": "warn", + "@typescript-eslint/no-empty-function": "warn" + } + } \ No newline at end of file diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md new file mode 100644 index 000000000..771729768 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/bug_report.md @@ -0,0 +1,47 @@ +--- +name: Bug Report +about: Bug Report +--- + + + +## 组件 + + +## 基础库版本 + + + +- [ ] 1.x +- [ ] 2.x + +## 设备机型 + +## 手机系统 + +- [ ] iOS +- [ ] Android +- [ ] HarmonyOS + +## APP + + +## 组件库版本 + + +## 预期行为 + + +## 复现步骤 + +1. +2. + +## 复现 demo + diff --git a/.github/ISSUE_TEMPLATE/feature_request_template.md b/.github/ISSUE_TEMPLATE/feature_request_template.md new file mode 100644 index 000000000..1e813f537 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/feature_request_template.md @@ -0,0 +1,17 @@ +--- +name: 功能优化需求 +about: 期望组件增强的功能需求 +labels: enhancement + +--- + +## 背景 + + + +## 期望 + + + +## 思路 + \ No newline at end of file diff --git a/.github/contributing.md b/.github/contributing.md new file mode 100644 index 000000000..d42be3de3 --- /dev/null +++ b/.github/contributing.md @@ -0,0 +1,32 @@ +--- +toc: false +--- + +## 参与 antd-mini 建设 + +antd-mini 的发展离不开社区的每一位用户，这里有一些信息可以帮助你参与共建。 + +### 项目运作流程 + +### issue + +如果你有组件库的相关使用问题或需求，可以前往 issue 区域搜索或者提问。我们提供了多种 issue 模板，请根据需要选择对应模板。同时，也非常欢迎你为其他同学解惑。 + +#### feature request + +如果现有的组件不能满足你的开发需求，请提交 issue 来描述你的需求。当然，并不是每一个 FR 都会实现。因为 antd-mini 的定位是一个基础组件库，而非业务组件库。我们会讨论每一个 FR，确认是一个基础组件需求后，我们就会进入开发流程。 + +#### bug + +提交 issue 时，请尽可能多地提供 bug 相关信息，以帮助我们更快地复现并解决。 + +下面是一些注意事项： + +- 设备信息、客户端版本、组件库版本、组件等 +- 你期望的组件行为是什么，实际上组件的行为是什么 +- 详细描述复习步骤 +- 尽可能提供能够复现 demo 以方便我们快速定位问题 + +### 贡献代码 + +非常欢迎各位为 antd-mini 贡献代码，这里有一份[贡献指南](https://github.com/ant-design/ant-design-mini/blob/main/docs/guide/contribute.md)。在贡献代码之前，请提交 RFC issue 并详细描述你的改动，以便我们能够在 RFC 中充分讨论，节省双方的时间。 diff --git a/.github/pull_requeset_template.md b/.github/pull_requeset_template.md new file mode 100644 index 000000000..8490bbfb2 --- /dev/null +++ b/.github/pull_requeset_template.md @@ -0,0 +1,37 @@ +--- +name: Pull Request +about: Pull Request +--- + +## 概要 + + + + +## 变更范围 + +- [ ] demo/** +- [ ] src/** + +## 变更类型 + +- [ ] Bug +- [ ] Docs +- [ ] Feature +- [ ] Performance +- [ ] Refactor +- [ ] 其他: 请补充 + +## 自查清单 + +- [ ] 更新/添加 相关文档 +- [ ] 更新/添加 demo 以展示新特性 + + +## 改动前 / 后 (可选) + + + +- 改动前： + +- 改动后： diff --git a/.github/workflows/pull_request.yml b/.github/workflows/pull_request.yml new file mode 100644 index 000000000..8b772f103 --- /dev/null +++ b/.github/workflows/pull_request.yml @@ -0,0 +1,28 @@ +name: pull_request ci + +on: [push, pull_request] + +jobs: + build: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v2 + - name: Use Node.js 14.x + uses: actions/setup-node@v1 + with: + node-version: 14.x + - name: build + run: | + npm i + npm run build + + - name: Save PR number + if: ${{ always() }} + run: echo ${{ github.event.number }} > ./pr-id.txt + + - name: Upload PR number + if: ${{ always() }} + uses: actions/upload-artifact@v2 + with: + name: pr + path: ./pr-id.txt \ No newline at end of file diff --git a/.gitignore b/.gitignore new file mode 100644 index 000000000..c4fede282 --- /dev/null +++ b/.gitignore @@ -0,0 +1,31 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/npm-debug.log* +/yarn-error.log +/yarn.lock +/package-lock.json + +# production +/es +/docs-dist +/dist +/demo/es + +# misc +.DS_Store +/coverage + +# umi +.umi +.umi-production +.umi-test +.env.local + +# ide +/.vscode +/.idea + +# other +/.mini-ide diff --git a/.minidev/config.json b/.minidev/config.json new file mode 100644 index 000000000..02facceea --- /dev/null +++ b/.minidev/config.json @@ -0,0 +1 @@ +{ "plugins": ["./scripts/umi.js"] } \ No newline at end of file diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 000000000..ecb24d331 --- /dev/null +++ b/.prettierignore @@ -0,0 +1,7 @@ +**/*.svg +**/*.ejs +**/*.html +package.json +.umi +.umi-production +.umi-test diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 000000000..edf6afac8 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,15 @@ +{ + "overrides": [ + { + "files": "*.axml", + "options": { + "parser": "html", + "printWidth": 40, + "tabWidth": 2, + "useTabs":true, + "bracketSameLine":true, + "bracketSpacing":true + } + } + ] +} \ No newline at end of file diff --git a/.stylelintrc b/.stylelintrc new file mode 100644 index 000000000..10b4b8e19 --- /dev/null +++ b/.stylelintrc @@ -0,0 +1,35 @@ +{ + "extends": "stylelint-config-standard", + "rules": { + at-rule-empty-line-before: null, + at-rule-name-space-after: null, + at-rule-no-unknown: null, + comment-empty-line-before: null, + declaration-bang-space-before: null, + declaration-empty-line-before: null, + function-comma-newline-after: null, + function-name-case: null, + function-parentheses-newline-inside: null, + function-max-empty-lines: null, + function-whitespace-after: null, + indentation: null, + number-leading-zero: null, + number-no-trailing-zeros: null, + rule-empty-line-before: null, + selector-combinator-space-after: null, + selector-list-comma-newline-after: null, + selector-pseudo-element-colon-notation: null, + unit-no-unknown: null, + value-list-max-empty-lines: null, + unit-case: null, + color-hex-case: null, + "selector-type-no-unknown": [ + true, + { + "ignoreTypes": [ + "page" + ] + } + ], + } +} \ No newline at end of file diff --git a/CONTRIBUTE.md b/CONTRIBUTE.md new file mode 100644 index 000000000..6f668e75a --- /dev/null +++ b/CONTRIBUTE.md @@ -0,0 +1,66 @@ +### 代码克隆 + +``` bash +git clone git@github.com:ant-design/ant-design-mini.git +``` + +### 目录结构 + +首先，初步了解目录结构的组成 + +``` bash +├── CHANGELOG.md # 更新日志 +├── demo # 示例小程序 +│ ├── app.acss +│ ├── app.js +│ ├── app.json +│ ├── mini.project.json +│ ├── package.json +│ └── pages +│ ├── Avatar +│ ├── Badge +│ └── ... +├── src # 组件源码 +│ ├── Avatar +│ │ ├── index.axml # 组件 axml 文件 +│ │ ├── index.json # 组件 json 文件 +│ │ ├── index.less # 组件 less 文件 +│ │ ├── index.ts # 组件 ts 文件 +│ │ └── index.md # 组件文档 +│ ├── Badge +│ │ └── ... +│ └── ... +└── tsconfig.json +``` + +### 投入开发 + +*** Tip：请遵循 git flow，正式开发时，新建 feat/xxx 或 fix/xxx 分支进行开发。 *** + +``` bash +// 安装依赖 +npm i + +// 开发环境 +npm run dev +``` + +### 效果预览 + +1. antd-mini 组件使用 [minidev](https://www.npmjs.com/package/minidev/v/0.0.7) 开发，可以通过编写、预览 demo 小程序来验证 src 目录下组件源码是否符合预期； + +2. antd-mini 文档使用 [umi](https://umijs.org/zh-CN) 开发，可在代码开发的同时修改文档，并嵌入编写的 demo； + + +### Commit 规范 + +开发过程中，提交 commit 时，需要遵循以下原则： + +1. 最小化代码变更：保证每个 commit 的逻辑独立、原子化。一个 commit 只做一件事，哪怕这件事只改了 1 行代码，你也应该独立 commit 这次变更； + +2. 遵循 Conventional Commits 原则：避免没有意义、看不懂的 Commit Message 引入，一般情况下，你会大量的使用到： + a. 使用 feat(scope): xxx 来描述一个 feature 的 commit； + b. 使用 fix(scope): xxx 来描述一个 bug fixes 的 commit； + c. 使用 chore(scope): xxx 来来描述一个无关 feature 和 bug fixes 的小调整； + +3. issue：如果改动与 issue 相关，请在 Commit Message 中带上 issue 参数，如：fix(scope): [#1] xxxxxx； diff --git a/LICENSE b/LICENSE new file mode 100644 index 000000000..b491431fa --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2022 Ant Design Team + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md new file mode 100644 index 000000000..d786af830 --- /dev/null +++ b/README.md @@ -0,0 +1,24 @@ +logo + +![npm (tag)](https://img.shields.io/npm/v/antd-mini) +  +![npm](https://img.shields.io/npm/dw/antd-mini) +  +![GitHub](https://img.shields.io/github/license/ant-design/ant-design-mini) + +```bash +$ npm i antd-mini@beta -S +``` + +antd-mini 是支付宝小程序 UI 组件库，遵循 Ant Design 规范。你可以扫描下方的支付宝二维码体验，或者访问[官网](https://mini.ant.design/)以获取更多信息。 + +logo + +目前还在不断完善和打磨中，如果你想在生产环境接入使用，请**务必仔细阅读[常见问题和解答](/docs/guide/faq.md)**。 + + +如果你发现了 bug 或者是希望 antd-mini 增加一些特性，可以[提交 issue](https://github.com/ant-design/ant-design-mini/issues)。也欢迎参与共建，这里有一份[贡献指南](https://github.com/ant-design/ant-design-mini/blob/main/docs/guide/contribute.md)。 + +如果你想深入参与讨论，可以加入我们的社区钉钉群：35097715 + +dingding diff --git a/babel.config.js b/babel.config.js new file mode 100644 index 000000000..765b7a7ea --- /dev/null +++ b/babel.config.js @@ -0,0 +1,16 @@ +module.exports = { + presets: [ + [ + '@babel/preset-env', + { + loose: true, + modules: false, + }, + ], + '@babel/preset-typescript', + ], + plugins: [ + '@babel/plugin-syntax-dynamic-import', + '@babel/plugin-transform-runtime', + ], +}; diff --git a/config/config.ts b/config/config.ts new file mode 100644 index 000000000..71aad96a3 --- /dev/null +++ b/config/config.ts @@ -0,0 +1,64 @@ +export default { + title:" ", + favicon: 'https://gw.alipayobjects.com/zos/bmw-prod/35bd3910-2382-4f5d-903f-ac4c31b76199.svg', + logo: 'https://gw.alipayobjects.com/zos/bmw-prod/d1971355-ffff-44ef-9e20-1bc9a237d463.svg', + outputPath: 'docs-dist', + locales: [['zh', '中文']], + mode: 'site', + hash: true, + plugins: ['./plugin/index.ts'], + headScripts: [{ src: 'https://gw.alipayobjects.com/os/lib/ali/mini-simulator/9.1.5/dist/index.js' }], + styles:[` + #root .__dumi-default-navbar { + padding-left: 32px; + } + #root .__dumi-default-navbar-logo{ + padding-left: 200px; + } + #root .__dumi-default-navbar{ + box-shadow: none; + border-bottom: 1px solid #ebedf1; + } + `], + navs: { + zh: [ + { + title: '指南', + path: '/guide', + }, + { + title: '组件', + path: '/components', + }, + { + title: '仓库地址', + path: 'https://github.com/ant-design/ant-design-mini', + }], + }, + menus: { + '/': [ + { + title: 'Home', + path: 'index', + }, + ], + '/guide': [ + { + title: '快速开始', + path: '/guide/quick-start', + }, + { + title: '项目共建', + path: '/guide/cooperation', + }, + { + title: '贡献指南', + path: '/guide/contribute', + }, + { + title: '常见问题', + path: '/guide/faq', + }, + ], + }, +}; diff --git a/demo/app.acss b/demo/app.acss new file mode 100644 index 000000000..5e17c3d08 --- /dev/null +++ b/demo/app.acss @@ -0,0 +1,3 @@ +page { + background-color: #f5f5f5; +} \ No newline at end of file diff --git a/demo/app.js b/demo/app.js new file mode 100644 index 000000000..d0a8cdce4 --- /dev/null +++ b/demo/app.js @@ -0,0 +1,2 @@ +App({ +}); diff --git a/demo/app.json b/demo/app.json new file mode 100644 index 000000000..98027cf59 --- /dev/null +++ b/demo/app.json @@ -0,0 +1,61 @@ +{ + "pages": [ + "pages/index/index", + "pages/FormAFor/index", + "pages/FormInsMethod/index", + "pages/FormAIf/index", + "pages/FormBasic/index", + "pages/List/index", + "pages/Icon/index", + "pages/Switch/index", + "pages/Picker/index", + "pages/InputItem/index", + "pages/Badge/index", + "pages/Button/index", + "pages/ButtonInline/index", + "pages/ButtonIcon/index", + "pages/ButtonAddon/index", + "pages/Modal/index", + "pages/SwipeAction/index", + "pages/Tabs/index", + "pages/VTabs/index", + "pages/Stepper/index", + "pages/Steps/index", + "pages/Terms/index", + "pages/Popover/index", + "pages/PopoverBase/index", + "pages/PopoverMask/index", + "pages/NoticeBar/index", + "pages/Filter/index", + "pages/SearchBar/index", + "pages/Popup/index", + "pages/Result/index", + "pages/Collapse/index", + "pages/CollapseAccordion/index", + "pages/Tag/index", + "pages/Tips/index", + "pages/Mask/index", + "pages/Avatar/index", + "pages/AvatarDesc/index", + "pages/Loading/index", + "pages/Checkbox/index", + "pages/CheckboxControlled/index", + "pages/CheckboxGroup/index", + "pages/RadioGroup/index", + "pages/Selector/index", + "pages/Form/index", + "pages/SafeArea/index", + "pages/Dialog/index", + "pages/FormValidate/index" + ], + "window": { + "enableWK": "YES", + "enableDSL": "YES", + "enableJSC": "YES", + "defaultTitle": "小程序版 antd-mini 库", + "backgroundColor": "#F5F5F9", + "pullRefresh": false, + "allowsBounceVertical": true + }, + "debug": true +} diff --git a/demo/components/WhiteSpace/index.acss b/demo/components/WhiteSpace/index.acss new file mode 100644 index 000000000..6d66e6bf9 --- /dev/null +++ b/demo/components/WhiteSpace/index.acss @@ -0,0 +1,3 @@ +.amd-whitespace { + height: 10px; +} \ No newline at end of file diff --git a/demo/components/WhiteSpace/index.axml b/demo/components/WhiteSpace/index.axml new file mode 100644 index 000000000..5d63f629e --- /dev/null +++ b/demo/components/WhiteSpace/index.axml @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/demo/components/WhiteSpace/index.js b/demo/components/WhiteSpace/index.js new file mode 100644 index 000000000..6420b1220 --- /dev/null +++ b/demo/components/WhiteSpace/index.js @@ -0,0 +1 @@ +Component({}) \ No newline at end of file diff --git a/demo/components/WhiteSpace/index.json b/demo/components/WhiteSpace/index.json new file mode 100644 index 000000000..fba482a42 --- /dev/null +++ b/demo/components/WhiteSpace/index.json @@ -0,0 +1,3 @@ +{ + "component": true +} \ No newline at end of file diff --git a/demo/components/test/index.acss b/demo/components/test/index.acss new file mode 100644 index 000000000..e69de29bb diff --git a/demo/components/test/index.axml b/demo/components/test/index.axml new file mode 100644 index 000000000..e8ed62779 --- /dev/null +++ b/demo/components/test/index.axml @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/demo/components/test/index.js b/demo/components/test/index.js new file mode 100644 index 000000000..3b5813582 --- /dev/null +++ b/demo/components/test/index.js @@ -0,0 +1,5 @@ +import form from '../../../src/mixins/form'; + +Component({ + mixins: [form()], +}); diff --git a/demo/components/test/index.json b/demo/components/test/index.json new file mode 100644 index 000000000..1d95561aa --- /dev/null +++ b/demo/components/test/index.json @@ -0,0 +1,6 @@ +{ + "component": true, + "usingComponents": { + "input": "../../../src/InputItem/index" + } +} \ No newline at end of file diff --git a/demo/mini.project.json b/demo/mini.project.json new file mode 100644 index 000000000..63533ecb8 --- /dev/null +++ b/demo/mini.project.json @@ -0,0 +1,8 @@ +{ + "component2": true, + "axmlStrictCheck": false, + "enableAppxNg": true, + "exclude": [ + "miniapptools_dist/**/*" + ] +} \ No newline at end of file diff --git a/demo/package.json b/demo/package.json new file mode 100644 index 000000000..342a6c3f0 --- /dev/null +++ b/demo/package.json @@ -0,0 +1,12 @@ +{ + "name": "antd-mini-demo", + "version": "0.0.1", + "dependencies": { + "antd-mini": "latest" + }, + "keywords": [], + "author": "", + "license": "MIT", + "main": "app.js", + "description": "antd-mini 组件库示例" +} diff --git a/demo/pages/Avatar/index.acss b/demo/pages/Avatar/index.acss new file mode 100644 index 000000000..30b68ab84 --- /dev/null +++ b/demo/pages/Avatar/index.acss @@ -0,0 +1,21 @@ +.demo-avatar-size { + display: flex; + justify-content: space-between; + padding: 24rpx; +} + +.demo-avatar-size-container { + display: flex; + flex-direction: column; + align-items: center; + justify-content: flex-end; +} + +.demo-avatar-size-container text { + padding-top: 16rpx; + font-size: 26rpx; +} + +.demo-avatar-content { + padding: 24rpx; +} diff --git a/demo/pages/Avatar/index.axml b/demo/pages/Avatar/index.axml new file mode 100644 index 000000000..2c2f01ccb --- /dev/null +++ b/demo/pages/Avatar/index.axml @@ -0,0 +1,21 @@ + + + + + + large + + + + 默认值：medium + + + + small + + + + x-small + + + diff --git a/demo/pages/Avatar/index.js b/demo/pages/Avatar/index.js new file mode 100644 index 000000000..560d44d43 --- /dev/null +++ b/demo/pages/Avatar/index.js @@ -0,0 +1 @@ +Page({}); diff --git a/demo/pages/Avatar/index.json b/demo/pages/Avatar/index.json new file mode 100644 index 000000000..74ee2c30a --- /dev/null +++ b/demo/pages/Avatar/index.json @@ -0,0 +1,8 @@ +{ + "defaultTitle": "Avatar", + "usingComponents": { + "avatar": "../../../src/Avatar/index", + "white-space": "../../components/WhiteSpace/index", + "container": "../../../src/Container/index" + } +} diff --git a/demo/pages/AvatarDesc/index.acss b/demo/pages/AvatarDesc/index.acss new file mode 100644 index 000000000..bbd66adcf --- /dev/null +++ b/demo/pages/AvatarDesc/index.acss @@ -0,0 +1,3 @@ +.demo-avatar-content { + padding: 24rpx; +} diff --git a/demo/pages/AvatarDesc/index.axml b/demo/pages/AvatarDesc/index.axml new file mode 100644 index 000000000..4c86b6a73 --- /dev/null +++ b/demo/pages/AvatarDesc/index.axml @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/demo/pages/AvatarDesc/index.js b/demo/pages/AvatarDesc/index.js new file mode 100644 index 000000000..560d44d43 --- /dev/null +++ b/demo/pages/AvatarDesc/index.js @@ -0,0 +1 @@ +Page({}); diff --git a/demo/pages/AvatarDesc/index.json b/demo/pages/AvatarDesc/index.json new file mode 100644 index 000000000..74ee2c30a --- /dev/null +++ b/demo/pages/AvatarDesc/index.json @@ -0,0 +1,8 @@ +{ + "defaultTitle": "Avatar", + "usingComponents": { + "avatar": "../../../src/Avatar/index", + "white-space": "../../components/WhiteSpace/index", + "container": "../../../src/Container/index" + } +} diff --git a/demo/pages/Badge/index.acss b/demo/pages/Badge/index.acss new file mode 100644 index 000000000..17a9ae513 --- /dev/null +++ b/demo/pages/Badge/index.acss @@ -0,0 +1,39 @@ +.list-like { + display: flex; + background: #fff; + padding: 12px; + justify-content: space-between; +} + +.list-like-black{ + display: flex; + background: #000; + padding: 12px; + justify-content: space-between; +} + +.inner { + height: 24px; + width: 44px; + background-color: #ddd; +} + +.intro { + margin-left: 12px; +} + +.container { + padding: 10px; + background-color: #333; + color: #f8f8f8; + font-size: 20px; +} + +.content { + background-color: #333; + color: #333; +} + +.title{ + padding: 24rpx +} diff --git a/demo/pages/Badge/index.axml b/demo/pages/Badge/index.axml new file mode 100644 index 000000000..29939e310 --- /dev/null +++ b/demo/pages/Badge/index.axml @@ -0,0 +1,31 @@ + + + + + {{item.info}} + + + + 带有描边，stroke: true + + + + + + {{item.info}} + diff --git a/demo/pages/Badge/index.js b/demo/pages/Badge/index.js new file mode 100644 index 000000000..a828b7005 --- /dev/null +++ b/demo/pages/Badge/index.js @@ -0,0 +1,36 @@ +Page({ + data: { + items: [ + { + type: 'dot', + intro: 'Dot Badge', + position: 'top-right', + }, + { + type: 'number', + text: 1, + position: 'top-right', + info: 'number', + }, + { + type: 'number', + text: 100, + position: 'top-right', + info: 'number > 99', + }, + { + type: 'text', + text: '优惠信息', + position: 'top-right', + info: 'text', + }, + { + type: 'bubble', + text: '紧急', + iconType: 'DownOutline', + position: 'top-right', + info: '自定义图标', + }, + ], + }, +}); diff --git a/demo/pages/Badge/index.json b/demo/pages/Badge/index.json new file mode 100644 index 000000000..9dbf266ca --- /dev/null +++ b/demo/pages/Badge/index.json @@ -0,0 +1,7 @@ +{ + "defaultTitle": "Badge", + "usingComponents": { + "list-item": "../../../src/List/ListItem/index", + "badge": "../../../src/Badge/index" + } +} diff --git a/demo/pages/Button/index.acss b/demo/pages/Button/index.acss new file mode 100644 index 000000000..67188d72d --- /dev/null +++ b/demo/pages/Button/index.acss @@ -0,0 +1,17 @@ +.container { + padding: 20rpx; +} + +.container button { + margin-bottom: 24rpx; +} + +.changeItem { + display: flex; + align-items: center; + margin-bottom: 24rpx; +} + +.changeItem label { + margin-left: 8rpx; +} diff --git a/demo/pages/Button/index.axml b/demo/pages/Button/index.axml new file mode 100644 index 000000000..24b113e19 --- /dev/null +++ b/demo/pages/Button/index.axml @@ -0,0 +1,45 @@ + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/demo/pages/Button/index.js b/demo/pages/Button/index.js new file mode 100644 index 000000000..b719b5595 --- /dev/null +++ b/demo/pages/Button/index.js @@ -0,0 +1,50 @@ +Page({ + data: { + list: [ + { type: 'default' }, + { type: 'primary' }, + { type: 'warn' }, + { type: 'danger' }, + { type: 'success' }, + { type: 'light' }, + ], + fillList: [ + { value: 'solid', label: 'solid', checked: true }, + { value: 'outline', label: 'outline' }, + { value: 'none', label: 'none' }, + ], + fill: 'solid', + title: '按钮操作 Normal', + subText: '', + disabled: false, + showLoading: false, + icon: '', + }, + onDisableChange(e) { + this.setData({ + disabled: e, + }); + }, + onLoadingChange(e) { + this.setData({ + showLoading: e, + loadingChangeValue: e, + }); + }, + onShowSubText(e) { + if (e) { + this.setData({ + subText: '副标题', + }); + } else { + this.setData({ + subText: '', + }); + } + }, + onFillChange(e) { + this.setData({ + fill: e.detail.value, + }); + }, +}); diff --git a/demo/pages/Button/index.json b/demo/pages/Button/index.json new file mode 100644 index 000000000..348522f89 --- /dev/null +++ b/demo/pages/Button/index.json @@ -0,0 +1,7 @@ +{ + "defaultTitle": "Button", + "usingComponents": { + "button": "../../../src/Button/index", + "checkbox": "../../../src/Checkbox/index" + } +} diff --git a/demo/pages/ButtonAddon/index.acss b/demo/pages/ButtonAddon/index.acss new file mode 100644 index 000000000..5872a76de --- /dev/null +++ b/demo/pages/ButtonAddon/index.acss @@ -0,0 +1,31 @@ +.container-1, +.container-2 { + display: flex; + padding: 0 12px; + margin: 12px 0; +} + +.container-3, +.container-4 { + padding: 0 12px; + margin: 12px 0; +} + + +.container-1 .amd-button:first-child, +.container-2 .amd-button:first-child, +.container-3 .amd-button:first-child, +.container-4 .amd-button:first-child { + margin-right: 6px; +} + +.container-1 .amd-button:last-child, +.container-2 .amd-button:last-child, +.container-3 .amd-button:last-child, +.container-4 .amd-button:last-child { + margin-right: 6px; +} + +.amd-button { + flex: 1; +} diff --git a/demo/pages/ButtonAddon/index.axml b/demo/pages/ButtonAddon/index.axml new file mode 100644 index 000000000..0a7aa09e8 --- /dev/null +++ b/demo/pages/ButtonAddon/index.axml @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + + + + + + diff --git a/demo/pages/ButtonAddon/index.js b/demo/pages/ButtonAddon/index.js new file mode 100644 index 000000000..9569f02aa --- /dev/null +++ b/demo/pages/ButtonAddon/index.js @@ -0,0 +1,3 @@ +Page({ +}); + diff --git a/demo/pages/ButtonAddon/index.json b/demo/pages/ButtonAddon/index.json new file mode 100644 index 000000000..02cfdcbf3 --- /dev/null +++ b/demo/pages/ButtonAddon/index.json @@ -0,0 +1,8 @@ +{ + "defaultTitle": "Button", + "usingComponents": { + "button": "../../../src/Button/index", + "checkbox": "../../../src/Checkbox/index" + } + } + \ No newline at end of file diff --git a/demo/pages/ButtonIcon/index.acss b/demo/pages/ButtonIcon/index.acss new file mode 100644 index 000000000..288edea21 --- /dev/null +++ b/demo/pages/ButtonIcon/index.acss @@ -0,0 +1,8 @@ +.amd-button{ + margin: 20px 5px; +} + +.button-icon { + font-size: 20px; + color: inherit; +} diff --git a/demo/pages/ButtonIcon/index.axml b/demo/pages/ButtonIcon/index.axml new file mode 100644 index 000000000..4bb5c3e9b --- /dev/null +++ b/demo/pages/ButtonIcon/index.axml @@ -0,0 +1,20 @@ + + + + + + \ No newline at end of file diff --git a/demo/pages/ButtonIcon/index.js b/demo/pages/ButtonIcon/index.js new file mode 100644 index 000000000..62444e344 --- /dev/null +++ b/demo/pages/ButtonIcon/index.js @@ -0,0 +1,10 @@ +Page({ + data: { + url: 'https://gw.alipayobjects.com/mdn/rms_ce4c6f/afts/img/A*XMCgSYx3f50AAAAAAAAAAABkARQnAQ', + }, + onTap() { + my.alert({ + title: 'tap', + }); + }, +}); diff --git a/demo/pages/ButtonIcon/index.json b/demo/pages/ButtonIcon/index.json new file mode 100644 index 000000000..348522f89 --- /dev/null +++ b/demo/pages/ButtonIcon/index.json @@ -0,0 +1,7 @@ +{ + "defaultTitle": "Button", + "usingComponents": { + "button": "../../../src/Button/index", + "checkbox": "../../../src/Checkbox/index" + } +} diff --git a/demo/pages/ButtonInline/index.acss b/demo/pages/ButtonInline/index.acss new file mode 100644 index 000000000..5b95d5247 --- /dev/null +++ b/demo/pages/ButtonInline/index.acss @@ -0,0 +1,18 @@ +.container { + padding: 20rpx; +} + +.container button { + margin-bottom: 24rpx; + margin-right: 10rpx; +} + +.changeItem { + display: flex; + align-items: center; + margin-bottom: 24rpx; +} + +.changeItem label { + margin-left: 8rpx; +} diff --git a/demo/pages/ButtonInline/index.axml b/demo/pages/ButtonInline/index.axml new file mode 100644 index 000000000..81e5544d9 --- /dev/null +++ b/demo/pages/ButtonInline/index.axml @@ -0,0 +1,102 @@ + + inlineSize: x-small + + + + inlineSize: small + + + + nlineSize: medium + + + + + + inlineSize: large + + + + + inlineSize: x-large + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/demo/pages/ButtonInline/index.js b/demo/pages/ButtonInline/index.js new file mode 100644 index 000000000..7e830038b --- /dev/null +++ b/demo/pages/ButtonInline/index.js @@ -0,0 +1,38 @@ +Page({ + data: { + list: [ + { type: 'default' }, + { type: 'primary' }, + { type: 'warn' }, + { type: 'danger' }, + { type: 'success' }, + { type: 'light' }, + ], + title: '按钮操作 Normal', + subText: '', + disabled: false, + showLoading: false, + }, + onDisableChange(e) { + this.setData({ + disabled: e, + }); + }, + onLoadingChange(e) { + this.setData({ + showLoading: e, + loadingChangeValue: e, + }); + }, + onShowSubText(e) { + if (e) { + this.setData({ + subText: '副标题', + }); + } else { + this.setData({ + subText: '', + }); + } + }, +}); diff --git a/demo/pages/ButtonInline/index.json b/demo/pages/ButtonInline/index.json new file mode 100644 index 000000000..348522f89 --- /dev/null +++ b/demo/pages/ButtonInline/index.json @@ -0,0 +1,7 @@ +{ + "defaultTitle": "Button", + "usingComponents": { + "button": "../../../src/Button/index", + "checkbox": "../../../src/Checkbox/index" + } +} diff --git a/demo/pages/Checkbox/index.acss b/demo/pages/Checkbox/index.acss new file mode 100644 index 000000000..2d4e67a4a --- /dev/null +++ b/demo/pages/Checkbox/index.acss @@ -0,0 +1,17 @@ +.demo { + padding-top: 24rpx; +} + +.demoItem label { + display: flex; + align-items: center; + line-height: 1; +} + +.a-button{ + margin:10px 10px +} + +.options{ + padding-left: 8px +} diff --git a/demo/pages/Checkbox/index.axml b/demo/pages/Checkbox/index.axml new file mode 100644 index 000000000..1f3c953db --- /dev/null +++ b/demo/pages/Checkbox/index.axml @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/demo/pages/Checkbox/index.js b/demo/pages/Checkbox/index.js new file mode 100644 index 000000000..c221c9b08 --- /dev/null +++ b/demo/pages/Checkbox/index.js @@ -0,0 +1,16 @@ +Page({ + data: { + disabled: false, + }, + changeCheckBox(v) { + my.showToast({ + content: `当前 checkbox 状态为： ${v}，${v ? '选中' : '未选中'} 状态。`, + duration: 1000, + }); + }, + onTap() { + this.setData({ + disabled: !this.data.disabled, + }); + }, +}); diff --git a/demo/pages/Checkbox/index.json b/demo/pages/Checkbox/index.json new file mode 100644 index 000000000..35eee92fb --- /dev/null +++ b/demo/pages/Checkbox/index.json @@ -0,0 +1,8 @@ +{ + "defaultTitle": "CheckBox", + "usingComponents": { + "checkbox": "../../../src/Checkbox/index", + "list": "../../../src/List/index", + "list-item": "../../../src/List/ListItem/index" + } +} diff --git a/demo/pages/CheckboxControlled/index.acss b/demo/pages/CheckboxControlled/index.acss new file mode 100644 index 000000000..171ac9d12 --- /dev/null +++ b/demo/pages/CheckboxControlled/index.acss @@ -0,0 +1,17 @@ +.demo { + padding-top: 24rpx; +} + +.demoItem label { + display: flex; + align-items: center; + line-height: 1; +} + +.demoItem text { + margin-left: 16rpx; +} + +.a-button{ + margin:10px 10px +} \ No newline at end of file diff --git a/demo/pages/CheckboxControlled/index.axml b/demo/pages/CheckboxControlled/index.axml new file mode 100644 index 000000000..ea2577f2f --- /dev/null +++ b/demo/pages/CheckboxControlled/index.axml @@ -0,0 +1,45 @@ + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/demo/pages/CheckboxControlled/index.js b/demo/pages/CheckboxControlled/index.js new file mode 100644 index 000000000..ba7d308db --- /dev/null +++ b/demo/pages/CheckboxControlled/index.js @@ -0,0 +1,34 @@ +Page({ + data: { + checked1: false, + checked2: false, + checked3: false, + checked4: false, + }, + changeCheckBox(v) { + my.showToast({ + content: `当前 checkbox 状态为： ${v}，${v ? '选中' : '未选中'} 状态。`, + duration: 1000, + }); + }, + onTap1() { + this.setData({ + checked1: !this.data.checked1, + }); + }, + onTap2() { + this.setData({ + checked2: !this.data.checked2, + }); + }, + onTap3() { + this.setData({ + checked3: !this.data.checked3, + }); + }, + onTap4() { + this.setData({ + checked4: !this.data.checked4, + }); + }, +}); diff --git a/demo/pages/CheckboxControlled/index.json b/demo/pages/CheckboxControlled/index.json new file mode 100644 index 000000000..35eee92fb --- /dev/null +++ b/demo/pages/CheckboxControlled/index.json @@ -0,0 +1,8 @@ +{ + "defaultTitle": "CheckBox", + "usingComponents": { + "checkbox": "../../../src/Checkbox/index", + "list": "../../../src/List/index", + "list-item": "../../../src/List/ListItem/index" + } +} diff --git a/demo/pages/CheckboxGroup/index.acss b/demo/pages/CheckboxGroup/index.acss new file mode 100644 index 000000000..f86d3e162 --- /dev/null +++ b/demo/pages/CheckboxGroup/index.acss @@ -0,0 +1,15 @@ +.btns { + display: flex; + padding: 0 24rpx 24rpx; + justify-content: space-between; +} + +.btns button { + flex: 1; + margin-right: 12rpx; +} + +.btns button~button { + margin-right: 0; + margin-left: 12rpx; +} diff --git a/demo/pages/CheckboxGroup/index.axml b/demo/pages/CheckboxGroup/index.axml new file mode 100644 index 000000000..aa16814ee --- /dev/null +++ b/demo/pages/CheckboxGroup/index.axml @@ -0,0 +1,32 @@ + + + + {{item.value}} + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/demo/pages/CheckboxGroup/index.js b/demo/pages/CheckboxGroup/index.js new file mode 100644 index 000000000..4d1072e5b --- /dev/null +++ b/demo/pages/CheckboxGroup/index.js @@ -0,0 +1,58 @@ +Page({ + data: { + value: ['a2', 'a3'], + radius: true, + controlled: false, + disabled: false, + uid: 'checkboxGroup', + list: [ + { value: 'a1', disabled: false }, + { value: 'a2', disabled: false }, + { value: 'a3', disabled: false }, + { value: 'a4', disabled: false }, + { value: 'a5', disabled: false }, + { value: 'a6', disabled: false }, + ], + }, + checkBoxGroupChange(v) { + my.alert({ + title: `当前选中的元素为：${v}`, + }); + this.setData({ + value: v, + }); + }, + selectAll() { + const newValue = this.data.list.map((item) => item.value); + if (newValue.length > 0) { + this.setData({ + value: newValue, + }); + } + }, + selectNone() { + this.setData({ + value: [], + }); + }, + disableAll() { + this.setData({ + disabled: true, + }); + }, + enableAll() { + this.setData({ + disabled: false, + }); + }, + controlledTrue() { + this.setData({ + controlled: true, + }); + }, + controlledFalse() { + this.setData({ + controlled: false, + }); + }, +}); diff --git a/demo/pages/CheckboxGroup/index.json b/demo/pages/CheckboxGroup/index.json new file mode 100644 index 000000000..a48aeab9c --- /dev/null +++ b/demo/pages/CheckboxGroup/index.json @@ -0,0 +1,7 @@ +{ + "defaultTitle": "CheckBoxGroup", + "usingComponents": { + "checkbox-group": "../../../src/CheckboxGroup/index", + "checkbox-item": "../../../src/CheckboxGroup/CheckboxItem/index" + } +} diff --git a/demo/pages/Collapse/index.acss b/demo/pages/Collapse/index.acss new file mode 100644 index 000000000..3796f4222 --- /dev/null +++ b/demo/pages/Collapse/index.acss @@ -0,0 +1,15 @@ +.item-content { + font-size: 34rpx; + color: #333; + line-height: 48rpx; + background-color: white; +} +.collapse-disable{ + margin: 24rpx 0; + font-size: 34rpx; + color: #333; + line-height: 48rpx; +} +.amd-icon{ + font-size: 22px; +} \ No newline at end of file diff --git a/demo/pages/Collapse/index.axml b/demo/pages/Collapse/index.axml new file mode 100644 index 000000000..114823af7 --- /dev/null +++ b/demo/pages/Collapse/index.axml @@ -0,0 +1,109 @@ + + + + + + + 自适应高度的内容区域 共 {{index + 1}} 行 + + + + + + + title 插槽 + + + 内容区域 + + + + + + 内容区域 + + + + + + 内容区域 + + + + + + + 禁用状态 + + + + + + + item-1 + + + + + + item-2 + + + + + + 自定义图标 + + + + + + title 插槽 + + 自定义图标 + + + + + title 插槽 + + + 自定义图标 + + \ No newline at end of file diff --git a/demo/pages/Collapse/index.js b/demo/pages/Collapse/index.js new file mode 100644 index 000000000..b3452dede --- /dev/null +++ b/demo/pages/Collapse/index.js @@ -0,0 +1,19 @@ +let index = 0; +Page({ + data: { + randomLine: 1, + name: ['item-1'], + }, + onTap() { + index += 1; + const name = [`item-${index % 3}`, `item-${(index - 1) % 3}`]; + this.setData({ + name: [...name], + }); + }, + onChange(e) { + my.showToast({ + content: `当前展开的元素: ${e}`, + }); + }, +}); diff --git a/demo/pages/Collapse/index.json b/demo/pages/Collapse/index.json new file mode 100644 index 000000000..0982b2fde --- /dev/null +++ b/demo/pages/Collapse/index.json @@ -0,0 +1,8 @@ +{ + "defaultTitle": "Collapse", + "usingComponents": { + "collapse": "../../../src/Collapse/index", + "collapse-item": "../../../src/Collapse/CollapseItem/index", + "icon": "../../../src/Icon/index" + } +} diff --git a/demo/pages/CollapseAccordion/index.acss b/demo/pages/CollapseAccordion/index.acss new file mode 100644 index 000000000..cdcbad801 --- /dev/null +++ b/demo/pages/CollapseAccordion/index.acss @@ -0,0 +1,5 @@ +.item-content { + font-size: 34rpx; + color: #333; + line-height: 48rpx; +} \ No newline at end of file diff --git a/demo/pages/CollapseAccordion/index.axml b/demo/pages/CollapseAccordion/index.axml new file mode 100644 index 000000000..d26a61944 --- /dev/null +++ b/demo/pages/CollapseAccordion/index.axml @@ -0,0 +1,24 @@ + + + + + 内容区域 + + + + + + 内容区域 + + + + + + 内容区域 + + + diff --git a/demo/pages/CollapseAccordion/index.js b/demo/pages/CollapseAccordion/index.js new file mode 100644 index 000000000..4543f183f --- /dev/null +++ b/demo/pages/CollapseAccordion/index.js @@ -0,0 +1,7 @@ +Page({ + onChange(e) { + my.alert({ + content: `当前展开的元素: ${e}`, + }); + }, +}); diff --git a/demo/pages/CollapseAccordion/index.json b/demo/pages/CollapseAccordion/index.json new file mode 100644 index 000000000..a48a1b6f5 --- /dev/null +++ b/demo/pages/CollapseAccordion/index.json @@ -0,0 +1,7 @@ +{ + "defaultTitle": "Collapse：手风琴模式", + "usingComponents": { + "collapse": "../../../src/Collapse/index", + "collapse-item": "../../../src/Collapse/CollapseItem/index" + } +} diff --git a/demo/pages/Dialog/index.acss b/demo/pages/Dialog/index.acss new file mode 100644 index 000000000..1952ba2f3 --- /dev/null +++ b/demo/pages/Dialog/index.acss @@ -0,0 +1,39 @@ +.deleteBtn { + color: #f93a4a; + font-weight: bolder; +} + +.cancelBtn { + color: #ccc; +} + +.buttonBold, +.modalButtonBold .am-modal-footer { + font-weight: bold; +} + +.space { + margin-top: 10px; +} + +.slide { + margin-top: 10px; + padding-bottom: 10px; +} + +.amd-input-item{ + border-color: #ccc; +} + +.input-container{ + border: 1px solid #e5e5e5; + padding: 8px 12px; +} + +.a-input-content{ + font-size: 15px; +} + +.a-input-placeholder{ + font-size:15px !important; +} diff --git a/demo/pages/Dialog/index.axml b/demo/pages/Dialog/index.axml new file mode 100644 index 000000000..1e024b388 --- /dev/null +++ b/demo/pages/Dialog/index.axml @@ -0,0 +1,84 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/demo/pages/Dialog/index.js b/demo/pages/Dialog/index.js new file mode 100644 index 000000000..5f9363b52 --- /dev/null +++ b/demo/pages/Dialog/index.js @@ -0,0 +1,81 @@ +Page({ + data: { + isVerticalShow: false, + isHoriShow: false, + isSImgDialogShow: false, + isMImgDialogShow: false, + isLImgDialogShow: false, + isCusDialogShow: false, + url: 'https://gw.alipayobjects.com/zos/rmsportal/yFeFExbGpDxvDYnKHcrs.png', + }, + onVerticalButtonTap() { + this.setData({ + isVerticalShow: false, + }); + }, + onHoriButtonTap() { + this.setData({ + isHoriShow: false, + }); + }, + onVerticalClose() { + this.setData({ + isVerticalShow: false, + }); + }, + onHoriClose() { + this.setData({ + isHoriShow: false, + }); + }, + openVertical() { + this.setData({ + isVerticalShow: true, + }); + }, + openHori() { + this.setData({ + isHoriShow: true, + }); + }, + openSImg() { + this.setData({ + isSImgDialogShow: true, + }); + }, + openMImg() { + this.setData({ + isMImgDialogShow: true, + }); + }, + openLImg() { + this.setData({ + isLImgDialogShow: true, + }); + }, + openCus() { + this.setData({ + isCusDialogShow: true, + }); + }, + onSImgClose() { + this.setData({ + isSImgDialogShow: false, + }); + }, + onMImgClose() { + this.setData({ + isMImgDialogShow: false, + }); + }, + onLImgClose() { + this.setData({ + isLImgDialogShow: false, + }); + }, + onCusClose() { + this.setData({ + isCusDialogShow: false, + }); + }, +}); diff --git a/demo/pages/Dialog/index.json b/demo/pages/Dialog/index.json new file mode 100644 index 000000000..e94cff284 --- /dev/null +++ b/demo/pages/Dialog/index.json @@ -0,0 +1,6 @@ +{ + "usingComponents":{ + "dialog": "../../../src/Dialog/index", + "input-item": "../../../src/InputItem/index" + } +} \ No newline at end of file diff --git a/demo/pages/Filter/index.acss b/demo/pages/Filter/index.acss new file mode 100644 index 000000000..ebd07979d --- /dev/null +++ b/demo/pages/Filter/index.acss @@ -0,0 +1,15 @@ +.filter-num{ + padding: 20rpx; +} + +.filter-1 .amd-filter-item{ + z-index: 2; +} + +.filter-2 .amd-filter-item{ + z-index: 2; +} + +.filter-3 .amd-filter-item{ + z-index: 2; +} diff --git a/demo/pages/Filter/index.axml b/demo/pages/Filter/index.axml new file mode 100644 index 000000000..689b9a9ea --- /dev/null +++ b/demo/pages/Filter/index.axml @@ -0,0 +1,146 @@ + 两项筛选 + + + + + + + + + 三项筛选 + + + + + + + + + + 四项筛选 + + + + + + + + + + + + 插槽：title 与 icon + + + + + {{item.title === '筛选项一' ? '筛选项 1' : '筛选项 2'}} + + + + + + + + + + + diff --git a/demo/pages/Filter/index.js b/demo/pages/Filter/index.js new file mode 100644 index 000000000..4f23d489f --- /dev/null +++ b/demo/pages/Filter/index.js @@ -0,0 +1,58 @@ +Page({ + data: { + value: ['3', '5'], + items: [ + { + text: '选项一', + value: '1', + }, + { + text: '选项二', + value: '2', + }, + { + text: '选项三', + value: '3', + }, + { + text: '选项四', + value: '4', + }, + { + text: '选项五', + value: '5', + }, + ], + items1: new Array(100).fill(0).map((_, idx) => { + return { + text: `选项${idx + 1}`, + value: `${idx + 1}`, + }; + }), + }, + changeSelect(v) { + if (v.length > 0) { + my.alert({ + content: `当前选择了 ${v}`, + }); + } else { + my.showToast({ + content: '未选择任何一项', + }); + } + }, + formatValue(fv) { + return `${fv}🔥`; + }, + onOpen() { + my.alert({ + title: '选项卡打开', + }); + }, + onTap() { + this.ins.changeSelect('1'); + }, + ref(ins) { + this.ins = ins; + }, +}); diff --git a/demo/pages/Filter/index.json b/demo/pages/Filter/index.json new file mode 100644 index 000000000..354bc65a8 --- /dev/null +++ b/demo/pages/Filter/index.json @@ -0,0 +1,8 @@ +{ + "defaultTitle": "Filter", + "usingComponents": { + "filter": "../../../src/Filter/index", + "filter-item": "../../../src/Filter/FilterItem/index", + "icon": "../../../src/Icon/index" + } +} diff --git a/demo/pages/Form/index.acss b/demo/pages/Form/index.acss new file mode 100644 index 000000000..5f2c489cd --- /dev/null +++ b/demo/pages/Form/index.acss @@ -0,0 +1,5 @@ +.checkbox-item, +.radio-item { + padding-bottom: 0; + padding-right: 0; +} diff --git a/demo/pages/Form/index.axml b/demo/pages/Form/index.axml new file mode 100644 index 000000000..e97f7002a --- /dev/null +++ b/demo/pages/Form/index.axml @@ -0,0 +1,143 @@ +
+ + + + + + + + + + + + + + + + 复选框文本内容1 + 复选框文本内容2 + 复选框文本内容3 + 复选框文本内容4 + 复选框文本内容5 + + + + + + + + 单选框文本内容 + 单选框文本内容 + 单选框文本内容 + 单选框文本内容 + 单选框文本内容 + + + + + + + + + + + + + + + Picker 选择器 + + + + + + + + + + + + + + + +
+ \ No newline at end of file diff --git a/demo/pages/Form/index.js b/demo/pages/Form/index.js new file mode 100644 index 000000000..2bb174ae8 --- /dev/null +++ b/demo/pages/Form/index.js @@ -0,0 +1,96 @@ +Page({ + data: { + form: 'form', + initVal: { + input: 10, + input1: 'disabled', + checkbox: ['a1', 'a3'], + radio: 'a3', + picker: ['2014', '12', 24], + switch: true, + selector: ['1'], + }, + pickerList: [ + ['2011', '2012', '2013', '2014', '2015', '2016', '2017', '2018', '2019', '2020', '2021', '2022'], + ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12'], + [ + 1, + 2, + 3, + 4, + 5, + 6, + 7, + 8, + 9, + 10, + 11, + 12, + 13, + 14, + 15, + 16, + 17, + 18, + 19, + 20, + 21, + 22, + 23, + 24, + 25, + 26, + 27, + 28, + 29, + 30, + 31, + ], + ], + sitems: [ + { + text: '选项一', + value: '1', + }, + { + text: '选项二', + value: '2', + }, + { + text: '选项三', + value: '3', + }, + { + text: '选项四', + value: '4', + }, + { + text: '选项五', + value: '5', + }, + ], + }, + onFinish(allValues) { + my.alert({ + title: 'onFinish', + content: JSON.stringify(allValues), + }); + }, + onValuesChange(fieldVal, allVals) { + // eslint-disable-next-line no-console + console.log(fieldVal, allVals); + }, + cancelPicker() { + my.showToast({ + content: '取消操作，关闭 picker，无回调。', + }); + }, + changePikcer(v) { + // eslint-disable-next-line no-console + console.log('changePikcer', v); + }, + formatValue(v) { + return v.join('/'); + }, +}); + diff --git a/demo/pages/Form/index.json b/demo/pages/Form/index.json new file mode 100644 index 000000000..554fb693f --- /dev/null +++ b/demo/pages/Form/index.json @@ -0,0 +1,21 @@ +{ + "defaultTitle": "Form", + "usingComponents": { + "form": "../../../src/Form/index", + "form-item": "../../../src/Form/FormItem/index", + "input": "../../../src/InputItem/index", + "my":"../../components/test/index", + "button":"../../../src/Button/index", + "checkbox":"../../../src/Checkbox/index", + "stepper":"../../../src/Stepper/index", + "picker":"../../../src/Picker/index", + "checkbox-group":"../../../src/CheckboxGroup/index", + "checkbox-item":"../../../src/CheckboxGroup/CheckboxItem/index", + "radio-group":"../../../src/RadioGroup/index", + "radio-item":"../../../src/RadioGroup/RadioItem/index", + "switch":"../../../src/Switch/index", + "terms":"../../../src/Terms/index", + "selector":"../../../src/Selector/index", + "form-group": "../../../src/Form/FormGroup/index" + } +} \ No newline at end of file diff --git a/demo/pages/FormAFor/index.acss b/demo/pages/FormAFor/index.acss new file mode 100644 index 000000000..8a3d90478 --- /dev/null +++ b/demo/pages/FormAFor/index.acss @@ -0,0 +1,4 @@ +.changedFields, .allFields{ + font-size: large; + margin:20px 0 +} \ No newline at end of file diff --git a/demo/pages/FormAFor/index.axml b/demo/pages/FormAFor/index.axml new file mode 100644 index 000000000..c64899d66 --- /dev/null +++ b/demo/pages/FormAFor/index.axml @@ -0,0 +1,25 @@ + + + +
+ + + +
+ + + changedFields: {{changedFields}} + + + + allFields: {{allFields}} + \ No newline at end of file diff --git a/demo/pages/FormAFor/index.js b/demo/pages/FormAFor/index.js new file mode 100644 index 000000000..f5b05d263 --- /dev/null +++ b/demo/pages/FormAFor/index.js @@ -0,0 +1,34 @@ +Page({ + data: { + list: [ + { name: 'field1', placeholder: 'field1' }, + { name: 'field2', placeholder: 'field2' }, + { name: 'field3', placeholder: 'field3' }, + ], + changedFields: '', + allFields: '', + form: 'formAFor', + }, + onValuesChange(changedFields, allFields) { + this.setData({ + changedFields: JSON.stringify(changedFields), + allFields: JSON.stringify(allFields), + }); + }, + sub() { + this.setData({ + list: this.data.list.slice(1), + }); + }, + add() { + const list = [ + { name: 'field1', placeholder: 'field1' }, + { name: 'field2', placeholder: 'field2' }, + { name: 'field3', placeholder: 'field3' }, + { name: 'field4', placeholder: 'field4' }, + ]; + this.setData({ + list, + }); + }, +}); diff --git a/demo/pages/FormAFor/index.json b/demo/pages/FormAFor/index.json new file mode 100644 index 000000000..a9b95210e --- /dev/null +++ b/demo/pages/FormAFor/index.json @@ -0,0 +1,8 @@ +{ + "defaultTitle": "结合 a:for 指令使用", + "usingComponents": { + "form": "../../../src/Form/index", + "form-item": "../../../src/Form/FormItem/index", + "input": "../../../src/InputItem/index" + } +} \ No newline at end of file diff --git a/demo/pages/FormAIf/index.acss b/demo/pages/FormAIf/index.acss new file mode 100644 index 000000000..8a3d90478 --- /dev/null +++ b/demo/pages/FormAIf/index.acss @@ -0,0 +1,4 @@ +.changedFields, .allFields{ + font-size: large; + margin:20px 0 +} \ No newline at end of file diff --git a/demo/pages/FormAIf/index.axml b/demo/pages/FormAIf/index.axml new file mode 100644 index 000000000..a4d7c9527 --- /dev/null +++ b/demo/pages/FormAIf/index.axml @@ -0,0 +1,43 @@ + + + + changedFields: {{changedFields}} + + + allFields: {{allFields}} + +
+ + + + 复选框文本内容1 + 复选框文本内容2 + 复选框文本内容3 + 复选框文本内容4 + 复选框文本内容5 + + + + + + + + + +
\ No newline at end of file diff --git a/demo/pages/FormAIf/index.js b/demo/pages/FormAIf/index.js new file mode 100644 index 000000000..13de71c29 --- /dev/null +++ b/demo/pages/FormAIf/index.js @@ -0,0 +1,24 @@ +Page({ + data: { + checkboxShow: true, + form: 'formCheckbox', + uid: 'formCheckboxGroup', + initVal: { + checkbox: ['a1', 'a2'], + input: 'initVal', + }, + changedFields: '', + allFields: '', + }, + changeCheckboxShow() { + this.setData({ + checkboxShow: !this.data.checkboxShow, + }); + }, + onValuesChange(changedFields, allFields) { + this.setData({ + changedFields: JSON.stringify(changedFields), + allFields: JSON.stringify(allFields), + }); + }, +}); diff --git a/demo/pages/FormAIf/index.json b/demo/pages/FormAIf/index.json new file mode 100644 index 000000000..c9f89dee7 --- /dev/null +++ b/demo/pages/FormAIf/index.json @@ -0,0 +1,11 @@ +{ + "defaultTitle": "结合 a:if 使用", + "usingComponents": { + "form": "../../../src/Form/index", + "form-item": "../../../src/Form/FormItem/index", + "form-group": "../../../src/Form/FormGroup/index", + "input": "../../../src/InputItem/index", + "checkbox-group": "../../../src/CheckboxGroup/index", + "checkbox-item":"../../../src/CheckboxGroup/CheckboxItem/index" + } +} diff --git a/demo/pages/FormBasic/index.acss b/demo/pages/FormBasic/index.acss new file mode 100644 index 000000000..8a3d90478 --- /dev/null +++ b/demo/pages/FormBasic/index.acss @@ -0,0 +1,4 @@ +.changedFields, .allFields{ + font-size: large; + margin:20px 0 +} \ No newline at end of file diff --git a/demo/pages/FormBasic/index.axml b/demo/pages/FormBasic/index.axml new file mode 100644 index 000000000..12afbb0a2 --- /dev/null +++ b/demo/pages/FormBasic/index.axml @@ -0,0 +1,35 @@ +
+ + + + + + + + + + + + + +
+ + + changedFields: {{changedFields}} + + + + allFields: {{allFields}} + \ No newline at end of file diff --git a/demo/pages/FormBasic/index.js b/demo/pages/FormBasic/index.js new file mode 100644 index 000000000..ae7b33b46 --- /dev/null +++ b/demo/pages/FormBasic/index.js @@ -0,0 +1,17 @@ +Page({ + data: { + form: 'form', + initVal: { + input1: 'input1', + input2: 'input2', + }, + changedFields: '', + allFields: '', + }, + onValuesChange(changedFields, allFields) { + this.setData({ + changedFields: JSON.stringify(changedFields), + allFields: JSON.stringify(allFields), + }); + }, +}); diff --git a/demo/pages/FormBasic/index.json b/demo/pages/FormBasic/index.json new file mode 100644 index 000000000..cf70f4e81 --- /dev/null +++ b/demo/pages/FormBasic/index.json @@ -0,0 +1,9 @@ +{ + "defaultTitle": "Form", + "usingComponents": { + "form": "../../../src/Form/index", + "form-item": "../../../src/Form/FormItem/index", + "form-group": "../../../src/Form/FormGroup/index", + "input": "../../../src/InputItem/index" + } +} \ No newline at end of file diff --git a/demo/pages/FormInsMethod/index.acss b/demo/pages/FormInsMethod/index.acss new file mode 100644 index 000000000..64031e2ea --- /dev/null +++ b/demo/pages/FormInsMethod/index.acss @@ -0,0 +1,4 @@ +.ins{ + font-size: large; + margin:20px 0 +} \ No newline at end of file diff --git a/demo/pages/FormInsMethod/index.axml b/demo/pages/FormInsMethod/index.axml new file mode 100644 index 000000000..4722be309 --- /dev/null +++ b/demo/pages/FormInsMethod/index.axml @@ -0,0 +1,18 @@ +
+ + + +
+ + + + + ins: {{ins}} + \ No newline at end of file diff --git a/demo/pages/FormInsMethod/index.js b/demo/pages/FormInsMethod/index.js new file mode 100644 index 000000000..dbc17c37f --- /dev/null +++ b/demo/pages/FormInsMethod/index.js @@ -0,0 +1,26 @@ +Page({ + data: { + list: [ + { name: 'field1', placeholder: 'field1' }, + { name: 'field2', placeholder: 'field2' }, + { name: 'field3', placeholder: 'field3' }, + ], + form: 'formInsMethod', + ins: '', + }, + setFieldsValue() { + this.formInstance.setFieldsValue(this.data.form, { + field1: '1', + field2: '2', + field3: '3', + }); + }, + getCompInstance() { + const ins = JSON.stringify(this.formInstance.getCompInstance(), undefined, 4); + this.setData({ ins }); + }, + ref(ins) { + this.formInstance = ins; + }, +}); + diff --git a/demo/pages/FormInsMethod/index.json b/demo/pages/FormInsMethod/index.json new file mode 100644 index 000000000..5c0ab0da6 --- /dev/null +++ b/demo/pages/FormInsMethod/index.json @@ -0,0 +1,9 @@ + +{ + "defaultTitle": "组件实例方法使用", + "usingComponents": { + "form": "../../../src/Form/index", + "form-item": "../../../src/Form/FormItem/index", + "input": "../../../src/InputItem/index" + } +} \ No newline at end of file diff --git a/demo/pages/FormValidate/index.acss b/demo/pages/FormValidate/index.acss new file mode 100644 index 000000000..8a3d90478 --- /dev/null +++ b/demo/pages/FormValidate/index.acss @@ -0,0 +1,4 @@ +.changedFields, .allFields{ + font-size: large; + margin:20px 0 +} \ No newline at end of file diff --git a/demo/pages/FormValidate/index.axml b/demo/pages/FormValidate/index.axml new file mode 100644 index 000000000..962b70f05 --- /dev/null +++ b/demo/pages/FormValidate/index.axml @@ -0,0 +1,59 @@ +
+ + + + + + + + + + + + + + + + + + + +
diff --git a/demo/pages/FormValidate/index.js b/demo/pages/FormValidate/index.js new file mode 100644 index 000000000..f851ec87a --- /dev/null +++ b/demo/pages/FormValidate/index.js @@ -0,0 +1,53 @@ +Page({ + data: { + form: 'form', + initVal: { + input1: 'input1', + input2: 'input2', + }, + changedFields: '', + allFields: '', + sRules: [ + { + validator: (rule, value = []) => { + return value.indexOf('2') !== -1; + }, + message: '请至少选择选项二', + }, + ], + sitems: [ + { + text: '选项一', + value: '1', + }, + { + text: '选项二', + value: '2', + }, + { + text: '选项三', + value: '3', + }, + { + text: '选项四', + value: '4', + }, + { + text: '选项五', + value: '5', + }, + ], + }, + onValuesChange(changedFields, allFields) { + this.setData({ + changedFields: JSON.stringify(changedFields), + allFields: JSON.stringify(allFields), + }); + }, + onFinish(allValues) { + my.alert({ + title: 'onFinish', + content: JSON.stringify(allValues), + }); + }, +}); diff --git a/demo/pages/FormValidate/index.json b/demo/pages/FormValidate/index.json new file mode 100644 index 000000000..57fcf1707 --- /dev/null +++ b/demo/pages/FormValidate/index.json @@ -0,0 +1,12 @@ +{ + "defaultTitle": "Form", + "usingComponents": { + "form": "../../../src/Form/index", + "form-item": "../../../src/Form/FormItem/index", + "form-group": "../../../src/Form/FormGroup/index", + "input": "../../../src/InputItem/index", + "button":"../../../src/Button/index", + "picker":"../../../src/Picker/index", + "selector":"../../../src/Selector/index" + } +} \ No newline at end of file diff --git a/demo/pages/Icon/index.acss b/demo/pages/Icon/index.acss new file mode 100644 index 000000000..709795fbc --- /dev/null +++ b/demo/pages/Icon/index.acss @@ -0,0 +1,52 @@ +.icon-sum { + padding: 24rpx 24rpx 0; + background-color: #fff; +} +.icon-sum text { + color: red; +} + +.icon-list { + display: flex; + flex-wrap: wrap; + padding: 20rpx; + background: #fff; +} + +.icon-item { + display: flex; + flex-direction: row; + align-items: flex-start; + justify-content: center; + flex-wrap: wrap; + flex: 0 33.33333%; + height: 170rpx; + padding: 16rpx; + border: 1rpx solid #eee; + box-sizing: border-box; +} + +.icon-desc { + flex: 0 100%; + margin-top: 20rpx; + font-size: 24rpx; + text-align: center; + word-wrap: break-word; + word-break: break-all; +} + +.searchInput { + width: 100%; + color: #f32600; + background-color: #f5f5f5; + border-bottom: 2rpx solid #eee; + box-sizing: border-box; +} +.title { + flex: 0 100%; + padding: 40rpx 10rpx 20rpx; + font-size: 38rpx; + font-weight: bold; + color: #f32600; + box-sizing: border-box; +} diff --git a/demo/pages/Icon/index.axml b/demo/pages/Icon/index.axml new file mode 100644 index 000000000..6524742e3 --- /dev/null +++ b/demo/pages/Icon/index.axml @@ -0,0 +1,90 @@ + + + 目前共有 {{ typeLen }} 个 icon图标类型。 + + + + Outline + + + + + {{item}} + + + + Fill + + + + + {{item}} + + + + Others + + + + + {{item}} + + + + + + Outline + + + + + {{item}} + + + + Fill + + + + + {{item}} + + + + Others + + + + + {{item}} + + + + + diff --git a/demo/pages/Icon/index.js b/demo/pages/Icon/index.js new file mode 100644 index 000000000..a0f9dcb47 --- /dev/null +++ b/demo/pages/Icon/index.js @@ -0,0 +1,183 @@ +Page({ + data: { + iconTypes: [ + 'MinusOutline', + 'AlipayCircleFill', + 'CheckCircleFill', + 'FireFill', + 'FaceRecognitionOutline', + 'StarFill', + 'EyeInvisibleFill', + 'SmileFill', + 'FrownFill', + 'BankcardOutline', + 'HeartOutline', + 'EyeFill', + 'HeartFill', + 'DownFill', + 'CloseCircleFill', + 'VideoOutline', + 'CouponOutline', + 'ReceiptOutline', + 'AntOutline', + 'UserCircleOutline', + 'PayCircleOutline', + 'BillOutline', + 'PlayOutline', + 'PayOutline', + 'MoreOutline', + 'ShrinkOutline', + 'ArrowsAltOutline', + 'StarOutline', + 'CheckOutline', + 'DeleteOutline', + 'LinkOutline', + 'InformationCircleOutline', + 'GlobalOutline', + 'InformationCircleFill', + 'ExclamationCircleFill', + 'CheckCircleOutline', + 'CloseCircleOutline', + 'SetOutline', + 'QuestionCircleFill', + 'QuestionCircleOutline', + 'UpCircleOutline', + 'FrownOutline', + 'DownCircleOutline', + 'ExclamationCircleOutline', + 'MinusCircleOutline', + 'RedoOutline', + 'UndoOutline', + 'EyeInvisibleOutline', + 'ForbidFill', + 'PicturesOutline', + 'PictureOutline', + 'PictureWrongOutline', + 'EyeOutline', + 'AddCircleOutline', + 'ClockCircleFill', + 'ClockCircleOutline', + 'BellMuteOutline', + 'KeyOutline', + 'BellOutline', + 'SearchOutline', + 'CollectMoneyOutline', + 'UnorderedListOutline', + 'AppstoreOutline', + 'ExclamationTriangleOutline', + 'AddOutline', + 'ScanningOutline', + 'ScanCodeOutline', + 'ExclamationOutline', + 'CloseOutline', + 'ScanningFaceOutline', + 'LeftOutline', + 'DownOutline', + 'UpOutline', + 'RightOutline', + 'KoubeiOutline', + 'KoubeiFill', + 'AAOutline', + 'ArrowDownCircleOutline', + 'MovieOutline', + 'CompassOutline', + 'LoopOutline', + 'TextOutline', + 'TagOutline', + 'FlagOutline', + 'EnvironmentOutline', + 'CalendarOutline', + 'LocationFill', + 'PhoneFill', + 'PhonebookOutline', + 'SmileOutline', + 'UserAddOutline', + 'FileWrongOutline', + 'SoundMuteFill', + 'SoundMuteOutline', + 'LockOutline', + 'UnlockOutline', + 'EditSOutline', + 'UploadOutline', + 'SoundOutline', + 'DownlandOutline', + 'SendOutline', + 'FillinOutline', + 'AudioMutedOutline', + 'AudioOutline', + 'UserOutline', + 'UserContactOutline', + 'TeamOutline', + 'UserSetOutline', + 'FileOutline', + 'MailOutline', + 'TruckOutline', + 'MailOpenOutline', + 'ChatCheckOutline', + 'ChatAddOutline', + 'ChatWrongOutline', + 'PhonebookFill', + 'AddressBookFill', + 'CalculatorOutline', + 'PieOutline', + 'HandPayCircleOutline', + 'GiftOutline', + 'TransportQRcodeOutline', + 'FolderOutline', + 'AlipaySquareFill', + 'TravelOutline', + 'AppOutline', + 'HistogramOutline', + 'MailFill', + 'CameraOutline', + 'EditFill', + 'SystemQRcodeOutline', + 'LockFill', + 'AudioFill', + 'TeamFill', + 'FilterOutline', + 'EditSFill', + 'LikeOutline', + 'TextDeletionOutline', + 'StopOutline', + 'FingerdownOutline', + 'MessageFill', + 'LocationOutline', + 'ContentOutline', + 'ExclamationShieldFill', + 'ReceivePaymentOutline', + 'ExclamationShieldOutline', + 'AddSquareOutline', + 'CloseShieldOutline', + 'CheckShieldOutline', + 'CheckShieldFill', + 'ShopbagOutline', + 'MessageOutline', + ], + searchIcon: [], + typeLen: 0, + }, + onLoad() { + const { iconTypes } = this.data; + this.setData({ + typeLen: iconTypes.length, + }); + }, + searchIcon(e) { + const inputValue = e.detail.value; + const searchIcon = []; + this.data.iconTypes.forEach((evalue) => { + if (evalue.match(inputValue)) { + searchIcon.push(evalue); + this.setData({ + searchIcon, + }); + } + }); + }, + clickIcon(e) { + my.showToast({ + content: e.currentTarget.dataset.info, + }); + }, +}); diff --git a/demo/pages/Icon/index.json b/demo/pages/Icon/index.json new file mode 100644 index 000000000..5a79ba589 --- /dev/null +++ b/demo/pages/Icon/index.json @@ -0,0 +1,6 @@ +{ + "defaultTitle": "Icon", + "usingComponents": { + "am-icon": "../../../src/Icon/index" + } +} diff --git a/demo/pages/InputItem/index.acss b/demo/pages/InputItem/index.acss new file mode 100644 index 000000000..ffc3c30fe --- /dev/null +++ b/demo/pages/InputItem/index.acss @@ -0,0 +1,54 @@ +.demoList { + margin-top: 12px; + margin-bottom: 12px; + padding: 0 12px +} +.amd-input-item-title { + margin-top: 12px; + font-family: PingFangSC-Regular; + font-size: 17px; + color: #666666; + margin-bottom: 8px; + text-align: center; +} +.amd-list-item-line { + position: relative; + -webkit-box-flex: 1; + -webkit-flex: 1; + flex: 1; + display: -webkit-box; + display: -webkit-flex; + display: flex; + -webkit-box-align: center; + -webkit-align-items: center; + align-items: center; + -webkit-align-self: stretch; + align-self: stretch; + max-width: 100%; + overflow: hidden; + padding: 0px 0px; +} + +.amd-list-input-item-arrow { + height: 15px; + width: 7.5px; +} +.amd-list-input-item-phone { + height: 18px; + width: 16px; +} + +.amd-list-input-item-code { + font-family: PingFangSC-Regular; + font-size: 17px; + color: #1677ff; + text-align: center; +} +.amd-list-input-item-line { + color: #EEEEEE; + margin: 0 12px 0 10px; +} + + + + diff --git a/demo/pages/InputItem/index.axml b/demo/pages/InputItem/index.axml new file mode 100644 index 000000000..b91b3cd7e --- /dev/null +++ b/demo/pages/InputItem/index.axml @@ -0,0 +1,16 @@ + + + 基本的输入框 + + + + + 带清除按钮 + + + + + 禁用状态 + + + \ No newline at end of file diff --git a/demo/pages/InputItem/index.js b/demo/pages/InputItem/index.js new file mode 100644 index 000000000..fadef382c --- /dev/null +++ b/demo/pages/InputItem/index.js @@ -0,0 +1,37 @@ +Page({ + data: { + name: '王五', + cardNo: '1234****', + }, + onSend(e) { + my.alert({ + title: 'verify code sent', + content: e, + }); + }, + onExtraTap() { + my.alert({ + content: 'extra tapped', + }); + }, + onItemChange(e) { + // eslint-disable-next-line no-console + console.log('onItemChange:', e); + }, + onItemFocus(v) { + // eslint-disable-next-line no-console + console.log('focus:', v); + }, + onItemBlur(v) { + // eslint-disable-next-line no-console + console.log('blur:', v); + }, + onItemConfirm(v) { + // eslint-disable-next-line no-console + console.log('confirm:', v); + }, + onItemClear() { + // eslint-disable-next-line no-console + console.log('onItemClear'); + }, +}); diff --git a/demo/pages/InputItem/index.json b/demo/pages/InputItem/index.json new file mode 100644 index 000000000..e12d7623e --- /dev/null +++ b/demo/pages/InputItem/index.json @@ -0,0 +1,9 @@ +{ + "defaultTitle": "Input-item", + "usingComponents": { + "list": "../../../src/List/index", + "list-item": "../../../src/List/ListItem/index", + "input-item": "../../../src/InputItem/index", + "amd-icon": "../../../src/Icon/index" + } +} diff --git a/demo/pages/List/index.acss b/demo/pages/List/index.acss new file mode 100644 index 000000000..a8458d103 --- /dev/null +++ b/demo/pages/List/index.acss @@ -0,0 +1,26 @@ +.customImage { + display: flex; + justify-content: center; + align-items: flex-end; + width: 100%; + height: 100%; + overflow: hidden; + font-size: 12rpx; + color: red; + background-color: #e5e5e5; + border-radius: 12rpx; + box-sizing: border-box; +} + +.extraInfo { + white-space: nowrap; +} + +.radio-group-container{ + display:flex; + padding: 24rpx +} + +.radio-group{ + padding: 0 20rpx +} \ No newline at end of file diff --git a/demo/pages/List/index.axml b/demo/pages/List/index.axml new file mode 100644 index 000000000..058b4b64c --- /dev/null +++ b/demo/pages/List/index.axml @@ -0,0 +1,81 @@ + + radius: + + 是 + 否 + + + + + + + + + 单行列表 + + + + 禁用状态 + + + + 箭头分为： + up/right/down + + + + + + + + 两行列表，列表含有 onTap，可点击 + + + + 自定义 + {{item.content}} + + + + + + + + 自定义 + {{item.content}} + + + + + diff --git a/demo/pages/List/index.js b/demo/pages/List/index.js new file mode 100644 index 000000000..aae57f3b4 --- /dev/null +++ b/demo/pages/List/index.js @@ -0,0 +1,36 @@ +Page({ + data: { + radius: false, + list: [ + { + info: '第一个 list-item 被点击', + image: 'https://gw.alipayobjects.com/mdn/rms_ce4c6f/afts/img/A*XMCgSYx3f50AAAAAAAAAAABkARQnAQ', + arrow: 'right', + content: '第一个 list-item', + }, + { + info: '第二个 list-item 被点击', + image: 'AlipaySquareFill', + arrow: 'right', + content: '第二个 list-item', + }, + { + info: '第三个 list-item 被点击', + image: '', + arrow: 'right', + content: '第三个 list-item', + }, + ], + }, + listClick(e) { + my.alert({ + title: 'item onTap', + content: e.currentTarget.dataset.info, + }); + }, + setRadius(e) { + this.setData({ + radius: e.detail.value, + }); + }, +}); diff --git a/demo/pages/List/index.json b/demo/pages/List/index.json new file mode 100644 index 000000000..5351af4af --- /dev/null +++ b/demo/pages/List/index.json @@ -0,0 +1,9 @@ +{ + "defaultTitle": "List", + "usingComponents": { + "list": "../../../src/List/index", + "list-item": "../../../src/List/ListItem/index", + "whitespace": "../../components/WhiteSpace/index", + "switch": "../../../src/Switch/index" + } +} diff --git a/demo/pages/Loading/index.acss b/demo/pages/Loading/index.acss new file mode 100644 index 000000000..69f7696ca --- /dev/null +++ b/demo/pages/Loading/index.acss @@ -0,0 +1,6 @@ +page{ + padding: 24rpx; +} +.theme { + background-color: rgba(0, 0, 0, 0.7); +} diff --git a/demo/pages/Loading/index.axml b/demo/pages/Loading/index.axml new file mode 100644 index 000000000..57a0ae6bf --- /dev/null +++ b/demo/pages/Loading/index.axml @@ -0,0 +1,30 @@ +type: mini + + +type: spin + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/demo/pages/Loading/index.js b/demo/pages/Loading/index.js new file mode 100644 index 000000000..7b6c8d658 --- /dev/null +++ b/demo/pages/Loading/index.js @@ -0,0 +1 @@ +Page({ }); diff --git a/demo/pages/Loading/index.json b/demo/pages/Loading/index.json new file mode 100644 index 000000000..c491d9ac3 --- /dev/null +++ b/demo/pages/Loading/index.json @@ -0,0 +1,8 @@ +{ + "defaultTitle": "Loading", + "usingComponents": { + "loading": "../../../src/Loading/index", + "am-icon": "../../../src/Icon/index", + "whitespace": "../../components/WhiteSpace/index" + } +} diff --git a/demo/pages/Mask/index.acss b/demo/pages/Mask/index.acss new file mode 100644 index 000000000..e69de29bb diff --git a/demo/pages/Mask/index.axml b/demo/pages/Mask/index.axml new file mode 100644 index 000000000..92c2eae65 --- /dev/null +++ b/demo/pages/Mask/index.axml @@ -0,0 +1,3 @@ + +营销弹窗蒙层，type="{{type}}" +产品弹窗蒙层，type="{{type}}" \ No newline at end of file diff --git a/demo/pages/Mask/index.js b/demo/pages/Mask/index.js new file mode 100644 index 000000000..68175a235 --- /dev/null +++ b/demo/pages/Mask/index.js @@ -0,0 +1,18 @@ +Page({ + data: { + type: 'market', + maskZindex: 10, + }, + maskClick() { + if (this.data.type === 'market') { + this.setData({ + type: 'product', + }); + } else { + this.setData({ + type: '', + show: false, + }); + } + }, +}); diff --git a/demo/pages/Mask/index.json b/demo/pages/Mask/index.json new file mode 100644 index 000000000..975eddc70 --- /dev/null +++ b/demo/pages/Mask/index.json @@ -0,0 +1,6 @@ +{ + "defaultTitle": "Mask", + "usingComponents": { + "mask": "../../../src/Mask/index" + } +} diff --git a/demo/pages/Modal/index.acss b/demo/pages/Modal/index.acss new file mode 100644 index 000000000..2dc6a01f4 --- /dev/null +++ b/demo/pages/Modal/index.acss @@ -0,0 +1,14 @@ +.deleteBtn { + color: #f93a4a; + font-weight: bolder; +} +.cancelBtn { + color: #ccc; +} +.buttonBold, +.modalButtonBold .am-modal-footer { + font-weight: bold; +} +.space { + margin-top: 10px; +} diff --git a/demo/pages/Modal/index.axml b/demo/pages/Modal/index.axml new file mode 100644 index 000000000..ca0fa0d89 --- /dev/null +++ b/demo/pages/Modal/index.axml @@ -0,0 +1,81 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/demo/pages/Modal/index.js b/demo/pages/Modal/index.js new file mode 100644 index 000000000..98f6807ad --- /dev/null +++ b/demo/pages/Modal/index.js @@ -0,0 +1,62 @@ +Page({ + data: { + isBaseModalShow: false, + isDurationModalShow: false, + isCustomModalShow: false, + isSImgModalShow: false, + isMImgModalShow: false, + isLImgModalShow: false, + url: 'https://gw.alipayobjects.com/zos/rmsportal/yFeFExbGpDxvDYnKHcrs.png', + }, + openBaseModal() { + this.commonShow('isBaseModalShow'); + }, + closeBaseModal() { + this.commonHide('isBaseModalShow'); + }, + openDurationModal() { + this.commonShow('isDurationModalShow'); + }, + closeDurationModal() { + this.commonHide('isDurationModalShow'); + }, + openCustomModal() { + this.commonShow('isCustomModalShow'); + }, + closeCustomModal() { + this.commonHide('isCustomModalShow'); + }, + openSImgModal() { + this.commonShow('isSImgModalShow'); + }, + closeSImgModal() { + this.commonHide('isSImgModalShow'); + }, + openMImgModal() { + this.commonShow('isMImgModalShow'); + }, + closeMImgModal() { + this.commonHide('isMImgModalShow'); + }, + openLImgModal() { + this.commonShow('isLImgModalShow'); + }, + closeLImgModal() { + this.commonHide('isLImgModalShow'); + }, + onButtonTap(type) { + my.alert({ + title: type, + }); + }, + commonShow(prop) { + this.setData({ + [prop]: true, + }); + }, + commonHide(prop) { + this.setData({ + [prop]: false, + }); + }, +}); diff --git a/demo/pages/Modal/index.json b/demo/pages/Modal/index.json new file mode 100644 index 000000000..47de53042 --- /dev/null +++ b/demo/pages/Modal/index.json @@ -0,0 +1,8 @@ +{ + "defaultTitle": "Modal", + "usingComponents": { + "modal": "../../../src/Modal/index", + "button": "../../../src/Button/index", + "amd-icon": "../../../src/Icon/index" + } +} diff --git a/demo/pages/NoticeBar/index.acss b/demo/pages/NoticeBar/index.acss new file mode 100644 index 000000000..b3b568bca --- /dev/null +++ b/demo/pages/NoticeBar/index.acss @@ -0,0 +1,37 @@ +.demo-title { + font-size: 15px; + font-weight: 500; + margin: 24rpx 16rpx; + padding-bottom: 24rpx; + border-bottom: 1px solid #ccc; +} +.radio-group { + display: flex; + flex-wrap: wrap; + padding: 0 24rpx 24rpx; +} +.radio-text { + margin-right: 24rpx; +} +input { + margin: 0 0 16rpx 24rpx; + padding: 8rpx 16rpx; + font-size: 30rpx; + border: 1px solid #eee; +} +.demo-item { + margin-bottom: 24rpx; +} + +.nomore-notice { + color: #999; +} +.itemSize { + width: 30px; + height: 30px; + margin-right: 24rpx; + vertical-align: middle; +} +.space { + height: 24rpx +} \ No newline at end of file diff --git a/demo/pages/NoticeBar/index.axml b/demo/pages/NoticeBar/index.axml new file mode 100644 index 000000000..a9de61c11 --- /dev/null +++ b/demo/pages/NoticeBar/index.axml @@ -0,0 +1,66 @@ + + + 四种类型 + + + default + + + + error + + + + info + + + + primary + + + + 内容过长 + + + + 文本溢出时，开启循环滚动。文字不够继续添加文字凑数。 + + + + + 点击事件 + + + action 数量：1 + + + + action 数量：2 + + \ No newline at end of file diff --git a/demo/pages/NoticeBar/index.js b/demo/pages/NoticeBar/index.js new file mode 100644 index 000000000..8e2bfe12f --- /dev/null +++ b/demo/pages/NoticeBar/index.js @@ -0,0 +1,22 @@ +Page({ + data: { + actionsText1: ['不再提示'], + actionsText2: ['不再提示', '查看详情'], + typeList: ['default', 'error', 'info', 'primary'], + }, + onActionTap(e) { + my.alert({ + title: `当前点击的是 actions 中的第 ${e} 个元素。`, + }); + }, + clickClose() { + my.alert({ + title: '点击了关闭 icon。', + }); + }, + clickPress() { + my.alert({ + title: 'link 类型被点击了。', + }); + }, +}); diff --git a/demo/pages/NoticeBar/index.json b/demo/pages/NoticeBar/index.json new file mode 100644 index 000000000..e632e7535 --- /dev/null +++ b/demo/pages/NoticeBar/index.json @@ -0,0 +1,6 @@ +{ + "defaultTitle": "Notice", + "usingComponents": { + "notice": "../../../src/NoticeBar/index" + } +} diff --git a/demo/pages/Picker/index.acss b/demo/pages/Picker/index.acss new file mode 100644 index 000000000..e3e3fae2c --- /dev/null +++ b/demo/pages/Picker/index.acss @@ -0,0 +1,15 @@ +page { + background-color: #e6e6e6; +} + +.pickerTips { + padding: 24rpx; +} + +.pickerTips text { + color: #1677ff; +} + +.pickerItem { + display: inline-block; +} diff --git a/demo/pages/Picker/index.axml b/demo/pages/Picker/index.axml new file mode 100644 index 000000000..0ead08f52 --- /dev/null +++ b/demo/pages/Picker/index.axml @@ -0,0 +1,16 @@ +当前选择的元素： + + Picker 选择器 + + diff --git a/demo/pages/Picker/index.js b/demo/pages/Picker/index.js new file mode 100644 index 000000000..62dcf71cb --- /dev/null +++ b/demo/pages/Picker/index.js @@ -0,0 +1,28 @@ +Page({ + data: { + value: ['2015', '12', 25], + pickerList: [ + ['2011', '2012', '2013', '2014', '2015', '2016', '2017', '2018', '2019', '2020', '2021', '2022'], + ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12'], + // eslint-disable-next-line max-len + [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31], + ], + }, + cancelPicker() { + my.showToast({ + content: '取消操作，关闭 picker，无回调。', + }); + }, + changePikcer(v) { + // eslint-disable-next-line no-console + console.log('changePikcer', v); + }, + getPikcerValue(v) { + my.showToast({ + content: `点击确定，当前选择的数组 index 为：${v}`, + }); + }, + formatValue(v) { + return v.join('+'); + }, +}); diff --git a/demo/pages/Picker/index.json b/demo/pages/Picker/index.json new file mode 100644 index 000000000..68e37d418 --- /dev/null +++ b/demo/pages/Picker/index.json @@ -0,0 +1,6 @@ +{ + "defaultTitle": "Picker", + "usingComponents": { + "picker": "../../../src/Picker/index" + } +} diff --git a/demo/pages/Popover/index.acss b/demo/pages/Popover/index.acss new file mode 100644 index 000000000..81f95a112 --- /dev/null +++ b/demo/pages/Popover/index.acss @@ -0,0 +1,29 @@ +.demo-popover { + display: flex; + align-items: center; + justify-content: center; + width: 100%; + height: 300px; +} + +.demo-popover-btn-1 { + width: 80px; + height: 40px; + padding: 20px 10px; + text-align: center; + background-color: #fff; + border: 1px solid #dddddd; + border-radius: 4px; +} +.demo-popover-btn-2 { + width: 80px; + height: 40px; + padding: 20px 10px; + text-align: center; + background-color: #fff; + border: 1px solid #dddddd; + border-radius: 4px; +} +page{ + background-color: #f7f7fa; +} diff --git a/demo/pages/Popover/index.axml b/demo/pages/Popover/index.axml new file mode 100644 index 000000000..f714b9d94 --- /dev/null +++ b/demo/pages/Popover/index.axml @@ -0,0 +1,93 @@ + + + + + mode : dark + + + + + 扫一扫 + + + + 付钱/收钱 + + + + 乘车码 + + + + + icon 插槽 + + + + + + + + + + mode : light + + + + + 扫一扫 + + + + 付钱/收钱 + + + + 乘车码 + + + + + icon 插槽 + + + + + diff --git a/demo/pages/Popover/index.js b/demo/pages/Popover/index.js new file mode 100644 index 000000000..555920cfa --- /dev/null +++ b/demo/pages/Popover/index.js @@ -0,0 +1,17 @@ + +Page({ + data: { + show: true, + url: 'https://gw.alipayobjects.com/mdn/rms_ce4c6f/afts/img/A*XMCgSYx3f50AAAAAAAAAAABkARQnAQ', + }, + onVisibleChange(e) { + this.setData({ + show: e, + }); + }, + itemTap(e) { + my.alert({ + content: `点击_${e.currentTarget.dataset.index}`, + }); + }, +}); diff --git a/demo/pages/Popover/index.json b/demo/pages/Popover/index.json new file mode 100644 index 000000000..c38089d09 --- /dev/null +++ b/demo/pages/Popover/index.json @@ -0,0 +1,7 @@ +{ + "defaultTitle": "Popover：结合 PopoverItem 组件", + "usingComponents": { + "popover": "../../../src/Popover/index", + "popover-item": "../../../src/Popover/PopoverItem/index" + } +} diff --git a/demo/pages/PopoverBase/index.acss b/demo/pages/PopoverBase/index.acss new file mode 100644 index 000000000..2e5416364 --- /dev/null +++ b/demo/pages/PopoverBase/index.acss @@ -0,0 +1,26 @@ +.demo-popover { + display: flex; + align-items: center; + justify-content: center; + width: 100%; + height: 450px; +} + +.demo-popover-btn { + width: 80px; + height: 40px; + padding: 20px 10px; + text-align: center; + background-color: #fff; + border: 1px solid #dddddd; + border-radius: 4px; +} + +.demo-btn-container { + display: flex; + justify-content: space-around; +} + +.demo-btn { + width: 45%; +} diff --git a/demo/pages/PopoverBase/index.axml b/demo/pages/PopoverBase/index.axml new file mode 100644 index 000000000..7a0593ee6 --- /dev/null +++ b/demo/pages/PopoverBase/index.axml @@ -0,0 +1,25 @@ + + + + + 点击{{show ? '隐藏' : '显示'}} {{placement}} + + + + tooltip + + + + + + + diff --git a/demo/pages/PopoverBase/index.js b/demo/pages/PopoverBase/index.js new file mode 100644 index 000000000..e41e2f93e --- /dev/null +++ b/demo/pages/PopoverBase/index.js @@ -0,0 +1,20 @@ +const placement = ['top', 'top-right', 'top-left', 'bottom', 'bottom-left', 'bottom-right', 'left', 'left-top', 'left-bottom', 'right', 'right-top', 'right-bottom']; +Page({ + data: { + placement: placement[0], + show: false, + }, + onNextPositionTap() { + let index = placement.indexOf(this.data.placement); + index = index >= placement.length - 1 ? 0 : index + 1; + this.setData({ + show: !this.data.show, + placement: placement[index], + }); + }, + onVisibleChange(e) { + this.setData({ + show: e, + }); + }, +}); diff --git a/demo/pages/PopoverBase/index.json b/demo/pages/PopoverBase/index.json new file mode 100644 index 000000000..159492682 --- /dev/null +++ b/demo/pages/PopoverBase/index.json @@ -0,0 +1,7 @@ +{ + "defaultTitle": "PopoverBase", + "usingComponents": { + "popover": "../../../src/Popover/index", + "popover-item": "../../../src/Popover/PopoverItem/index" + } +} diff --git a/demo/pages/PopoverMask/index.acss b/demo/pages/PopoverMask/index.acss new file mode 100644 index 000000000..2e5416364 --- /dev/null +++ b/demo/pages/PopoverMask/index.acss @@ -0,0 +1,26 @@ +.demo-popover { + display: flex; + align-items: center; + justify-content: center; + width: 100%; + height: 450px; +} + +.demo-popover-btn { + width: 80px; + height: 40px; + padding: 20px 10px; + text-align: center; + background-color: #fff; + border: 1px solid #dddddd; + border-radius: 4px; +} + +.demo-btn-container { + display: flex; + justify-content: space-around; +} + +.demo-btn { + width: 45%; +} diff --git a/demo/pages/PopoverMask/index.axml b/demo/pages/PopoverMask/index.axml new file mode 100644 index 000000000..29b9a52cd --- /dev/null +++ b/demo/pages/PopoverMask/index.axml @@ -0,0 +1,18 @@ + + + + + 点击{{show ? '隐藏' : '显示'}} + + + + tooltip + + + \ No newline at end of file diff --git a/demo/pages/PopoverMask/index.js b/demo/pages/PopoverMask/index.js new file mode 100644 index 000000000..1852935c8 --- /dev/null +++ b/demo/pages/PopoverMask/index.js @@ -0,0 +1,15 @@ +Page({ + data: { + show: false, + }, + onVisibleChange(e) { + this.setData({ + show: e, + }); + }, + onMaskTap(e) { + this.setData({ + show: e, + }); + }, +}); diff --git a/demo/pages/PopoverMask/index.json b/demo/pages/PopoverMask/index.json new file mode 100644 index 000000000..159492682 --- /dev/null +++ b/demo/pages/PopoverMask/index.json @@ -0,0 +1,7 @@ +{ + "defaultTitle": "PopoverBase", + "usingComponents": { + "popover": "../../../src/Popover/index", + "popover-item": "../../../src/Popover/PopoverItem/index" + } +} diff --git a/demo/pages/Popup/index.acss b/demo/pages/Popup/index.acss new file mode 100644 index 000000000..cae05f3eb --- /dev/null +++ b/demo/pages/Popup/index.acss @@ -0,0 +1,42 @@ +.btn-container { + width: 100%; + height: 100vh; + padding-bottom: 50vh; + display: flex; + flex-direction: column; + justify-content: center; +} + + +.box.top, +.box.bottom { + height: 200px; +} + +.box.left, +.box.right { + display: flex; + flex-direction: column; + width: 200px; + height: 100%; +} + +.box { + display: flex; + justify-content: center; + align-items: center; +} + +.box.center { + display: block; + height: 200px; +} + +.centerContent { + width: 60%; + height: 500px; + margin: 24rpx auto; + padding: 24rpx; + background-color: #ccc; + box-sizing: border-box; +} diff --git a/demo/pages/Popup/index.axml b/demo/pages/Popup/index.axml new file mode 100644 index 000000000..7a87c1198 --- /dev/null +++ b/demo/pages/Popup/index.axml @@ -0,0 +1,71 @@ + + + + + + + + + + + + + + + + + 试一下滚动 + + + + + + 试一下滚动 + + + + + + + + + + + + diff --git a/demo/pages/Popup/index.js b/demo/pages/Popup/index.js new file mode 100644 index 000000000..91ef7d6a0 --- /dev/null +++ b/demo/pages/Popup/index.js @@ -0,0 +1,50 @@ +Page({ + data: { + showLeft: false, + showRight: false, + showTop: false, + showBottom: false, + showCenter: false, + showCenterScoll: false, + }, + onTopBtnTap() { + this.setData({ + showTop: true, + }); + }, + onRightBtnTap() { + this.setData({ + showRight: true, + }); + }, + onLeftBtnTap() { + this.setData({ + showLeft: true, + }); + }, + onButtomBtnTap() { + this.setData({ + showBottom: true, + }); + }, + onCenterBtnTap() { + this.setData({ + showCenter: true, + }); + }, + onCenterBtnScrollTap() { + this.setData({ + showCenterScoll: true, + }); + }, + onPopupClose() { + this.setData({ + showLeft: false, + showRight: false, + showTop: false, + showBottom: false, + showCenter: false, + showCenterScoll: false, + }); + }, +}); diff --git a/demo/pages/Popup/index.json b/demo/pages/Popup/index.json new file mode 100644 index 000000000..6a5de782b --- /dev/null +++ b/demo/pages/Popup/index.json @@ -0,0 +1,7 @@ +{ + "defaultTitle": "Popup", + "usingComponents": { + "popup": "../../../src/Popup/index", + "button": "../../../src/Button/index" + } +} diff --git a/demo/pages/RadioGroup/index.acss b/demo/pages/RadioGroup/index.acss new file mode 100644 index 000000000..f86d3e162 --- /dev/null +++ b/demo/pages/RadioGroup/index.acss @@ -0,0 +1,15 @@ +.btns { + display: flex; + padding: 0 24rpx 24rpx; + justify-content: space-between; +} + +.btns button { + flex: 1; + margin-right: 12rpx; +} + +.btns button~button { + margin-right: 0; + margin-left: 12rpx; +} diff --git a/demo/pages/RadioGroup/index.axml b/demo/pages/RadioGroup/index.axml new file mode 100644 index 000000000..3f181409c --- /dev/null +++ b/demo/pages/RadioGroup/index.axml @@ -0,0 +1,19 @@ + + radioGroup demo + 单选框文本内容 + 单选框文本内容 + 单选框文本内容 + 单选框文本内容 + 单选框文本内容 + + + + diff --git a/demo/pages/RadioGroup/index.js b/demo/pages/RadioGroup/index.js new file mode 100644 index 000000000..d37996391 --- /dev/null +++ b/demo/pages/RadioGroup/index.js @@ -0,0 +1,20 @@ +Page({ + data: { + value: 'a1', + disabled: false, + }, + radioGroupChange(v) { + // eslint-disable-next-line no-console + console.log('RadioGroup 的 onChange 回调结果，当前选中的元素为：', v); + }, + disableAll() { + this.setData({ + disabled: true, + }); + }, + enableAll() { + this.setData({ + disabled: false, + }); + }, +}); diff --git a/demo/pages/RadioGroup/index.json b/demo/pages/RadioGroup/index.json new file mode 100644 index 000000000..6fb4c101c --- /dev/null +++ b/demo/pages/RadioGroup/index.json @@ -0,0 +1,7 @@ +{ + "defaultTitle": "RadioGroup", + "usingComponents": { + "radio-group": "../../../src/RadioGroup/index", + "radio-item": "../../../src/RadioGroup/RadioItem/index" + } +} diff --git a/demo/pages/Result/index.acss b/demo/pages/Result/index.acss new file mode 100644 index 000000000..e1f2ce018 --- /dev/null +++ b/demo/pages/Result/index.acss @@ -0,0 +1,13 @@ +.radio-text, +.btnLabel { + margin: 0 20rpx 0 4rpx; +} +.radio-group { + display: flex; + flex-wrap: wrap; +} +.radio, +.showBtn { + display: flex; + align-items: center; +} \ No newline at end of file diff --git a/demo/pages/Result/index.axml b/demo/pages/Result/index.axml new file mode 100644 index 000000000..81793fb85 --- /dev/null +++ b/demo/pages/Result/index.axml @@ -0,0 +1,37 @@ + + + slot image + 这里是通过 slot 插槽加入的内容，加入更多自定义内容。 + + + + + + 标题 + + 描述 +