diff --git a/README.md b/README.md index 6d9c20a..0a7ccd3 100644 --- a/README.md +++ b/README.md @@ -4,6 +4,8 @@ # Slide to confirm [ ![Download](https://api.bintray.com/packages/chinalwb/slidetoconfirm/slidetoconfirm/images/download.svg?version=1.0.1) ](https://bintray.com/chinalwb/slidetoconfirm/slidetoconfirm/1.0.1/link) + +### [中文说明](./README_ch.md) ### What's this? - It is a component that requires user slide to confirm for some proceeding actions - Works on Android diff --git a/README_ch.md b/README_ch.md new file mode 100644 index 0000000..1642167 --- /dev/null +++ b/README_ch.md @@ -0,0 +1,99 @@ + +

+ +

+ + +# 滑动确认组件 [ ![Download](https://api.bintray.com/packages/chinalwb/slidetoconfirm/slidetoconfirm/images/download.svg?version=1.0.1) ](https://bintray.com/chinalwb/slidetoconfirm/slidetoconfirm/1.0.1/link) +### 这是什么? +- 当你的 App 需要用户滑动来确认某些信息的时候,可以使用这个滑动确认组件 +- 适用 Android 平台 + +### 长什么样? +![直角边框](https://user-images.githubusercontent.com/1758864/78349273-efce9b00-75d5-11ea-9a10-8022db9ade5a.png) + +![圆角边框](https://user-images.githubusercontent.com/1758864/78349279-f230f500-75d5-11ea-9679-d3f400cd7135.png) + +![圆形边框](https://user-images.githubusercontent.com/1758864/78349282-f52be580-75d5-11ea-8ca7-26531129b171.png) + +![UI_4](https://user-images.githubusercontent.com/1758864/78350196-5dc79200-75d7-11ea-9971-6f0a0799d21b.png) + +![UI_5](https://user-images.githubusercontent.com/1758864/78350204-6029ec00-75d7-11ea-8f1c-4da0558f5337.png) + +### 内部怎么实现的? +- 继承自 Android `RelativeLayout` +- 在运行时根据需要添加必要的子控件 +- 监听用户的拖动操作 +- 当监听到用户拖动到最右端的时候,可根据配置来震动提醒 +- 如果用户松手的时候滑块没有在最右端,自动滑动到最左端 + +### 有什么好的地方? +- 非常简单易用,一行代码搞定所有配置 +- 不做无用操作,性能高效 +- 合理处理跟外层 view 垂直方向的滑动冲突 +- 滑块 UI 自定义,可以使用图片或 Lottie / 边框圆角半径 / 背景色 / 动画时间 / 震动提醒 等 + +### 如何使用? +- 简单两步: +1. 在 build.gradle 中加依赖 `implementation 'com.github.chinalwb:slidetoconfirm:1.0.1'` +2. 然后在需要的地方引用 `com.chinalwb.slidetoconfirmlib.SlideToConfirm`, 比如: +``` + + + +``` + +### 有哪些可配置的选项? +| 配置名称 | 描述 | 示例参数值 | +| ---- | ---- | ---- | +| border_radius | 整个控件边框的圆角半径 | 0dp / 2dp / xx dp | +| border_width | 边框的厚度 | 1dp | +| slider_background_color | 整个控件的背景色 | 任何色值 | +| slider_color | 滑块的颜色 | 任何色值 | +| slider_lottie | Lottie 资源文件名称 | 比如 lottie_x.json -- 需要放到 `assets` 目录下 | +| slider_image | 如果不用 Lottie, 可以使用图片, 如果这个属性和 `slider_lottie` 都设置了,这个属性生效,lottie 失效 | 图片的引用 | +| slider_width | 滑块的宽度 | 100dp | +| slider_reset_duration | 拖动滑块松手时,如果滑块没有在最右端,恢复动画的时间,单位是 `ms` | 300 | +| slider_vibration_duration | 拖动滑块时,如果拖动到最右端松手时震动时长,单位是 `ms` | 100 | +| slider_threshold | 检测是否滑动到最右端的偏差值, 比如 0dp 意味着必须滑动到最右端才算有效 | 1dp | +| engage_text | 滑动组件的提示文字 `滑动以解锁` | 任何字符串,比如 `滑动以解锁` | +| engage_text_size | 滑动组件的提示文字的字体大小 | 17sp | +| engage_text_color | 滑动组件的提示文字的字体颜色 | 任何色值 | +| engaged_text_font | 滑动组件的提示文字的字体样式, 需要放到 `res/font` 目录下 | 比如 @font/你的字体资源文件 | +| completed_text | 滑动成功之后的提示文字. 比如: `解锁成功!` | 任何字符串 | +| completed_text_size | 滑动成功之后的提示文字的字体大小 | 17sp | +| completed_text_color | 滑动成功之后的提示文字的字体颜色 | 任何色值 | +| completed_text_font | 滑动成功之后的提示文字的字体样式, 需要放到 `res/font` 目录下 | @font/你的字体资源文件 | + + +------ +License: MIT + +