Explorar el Código

完善了键盘的文档

Kevin hace 6 años
padre
commit
45b10b5bc1
Se han modificado 6 ficheros con 127 adiciones y 6 borrados
  1. 4 0
      CHANGELOG.md
  2. 3 2
      README.md
  3. 103 0
      documents/custom_keyboard.md
  4. 0 1
      lib/dialogs/weui_toast.dart
  5. 15 1
      lib/keyboards/keyboard_controller.dart
  6. 2 2
      pubspec.yaml

+ 4 - 0
CHANGELOG.md

@@ -1,3 +1,7 @@
+## [0.1.8] - TODO:完善了键盘的文档
+* 完善了键盘的文档
+* 完善了可发送的TextInputAction的类型
+
 ## [0.1.7] - TODO:添加了自定义键盘
 * TODO:添加了自定义键盘
 * TODO:修改了下文档结构

+ 3 - 2
README.md

@@ -7,7 +7,7 @@ Usage
 Add this to your package's pubspec.yaml file:
 ``` yaml
 dependencies:
-  cool_ui: "^0.1.7"
+  cool_ui: "^0.1.8"
 ```
 
 # 控件
@@ -22,4 +22,5 @@ dependencies:
 
 # 自定义键盘
 
-暂时未编写文档,具体请查看Demo与NumberKeyboard的实现
+- [Get started](#自定义键盘使用方法快速入门)
+- [KeyboardController](#KeyboardController)

+ 103 - 0
documents/custom_keyboard.md

@@ -0,0 +1,103 @@
+# 自定义键盘使用方法快速入门
+
+## Step1
+编写个性化的键盘
+
+```dart
+class NumberKeyboard extends StatelessWidget{
+    static const CKTextInputType inputType = const CKTextInputType(name:'CKNumberKeyboard'); //定义InputType类型
+    static double getHeight(BuildContext ctx){ //编写获取高度的方法
+         ...
+    }
+
+
+  final KeyboardController controller ; //用于控制键盘输出的Controller
+  const NumberKeyboard({this.controller});
+
+   static register(){   //注册键盘的方法
+      CoolKeyboard.addKeyboard(NumberKeyboard.inputType,KeyboardConfig(builder: (context,controller){
+        return NumberKeyboard(controller: controller);
+      },getHeight: NumberKeyboard.getHeight));
+    }
+
+    @override
+    Widget build(BuildContext context) { //键盘的具体内容
+      ...
+      return Container( //例子
+        color: Colors.white,
+        child: GestureDetector(
+           behavior: HitTestBehavior.translucent,
+           child: Center(child: Text('1'),),
+           onTap: (){
+              controller.addText('1'); 往输入框光标位置添加一个1
+           },
+        ),
+      )
+    }
+}
+```
+
+## Step2
+注册键盘
+
+```dart
+void main(){
+  NumberKeyboard.register(); //注册键盘
+  runApp(MyApp());
+}
+```
+
+## Step3
+给需要使用自定义键盘的页面添加以下代码
+
+```dart
+@override
+Widget build(BuildContext context) {
+  return KeyboardMediaQuery(//用于键盘弹出的时候页面可以滚动到输入框的位置
+      child: Builder(builder: (ctx) {
+        CoolKeyboard.init(ctx); //初始化键盘监听并且传递当前页面的context
+        return Page; //返回当前页面
+      })
+  );
+}
+```
+
+
+## Step4
+具体使用
+```dart
+TextField(
+   ...
+   keyboardType: NumberKeyboard.inputType, 像平常一样设置键盘输入类型一样将Step2编写的inputType传递进去
+   ...
+ )
+```
+
+# KeyboardController
+
+
+- [deleteOne](#deleteOne)
+- [addText](#addText)
+- [doneAction](#doneAction)
+- [nextAction](#nextAction)
+- [sendPerformAction](#sendPerformAction)
+
+
+### deleteOne()
+删除一个字符,一般用于键盘的删除键
+
+### addText(String insertText)
+在光标位置添加文字,一般用于键盘输入
+
+### doneAction()
+触发键盘的完成Action
+
+### nextAction()
+触发键盘的下一项Action
+
+### newLineAction()
+触发键盘的换行Action
+
+### sendPerformAction(TextInputAction action)
+///发送其他Action
+

+ 0 - 1
lib/dialogs/weui_toast.dart

@@ -159,7 +159,6 @@ VoidCallback showWeuiToast({
   Alignment alignment = const Alignment(0.0,-0.2),
   RouteTransitionsBuilder transitionBuilder}){
   Completer<VoidCallback> result = Completer<VoidCallback>();
-
   Navigator.of(context,rootNavigator: true).push(
       WeuiToast(
         alignment: alignment,

+ 15 - 1
lib/keyboards/keyboard_controller.dart

@@ -60,7 +60,7 @@ class KeyboardController extends ValueNotifier<TextEditingValue>{
   clearComposing() {
     value = value.copyWith(composing: TextRange.empty);
   }
-
+  ///删除一个字符,一般用于键盘的删除键
   deleteOne(){
     if(selection.baseOffset == 0)
       return;
@@ -101,4 +101,18 @@ class KeyboardController extends ValueNotifier<TextEditingValue>{
     CoolKeyboard.sendPerformAction(TextInputAction.done);
   }
 
+  /// 下一个
+  nextAction(){
+    CoolKeyboard.sendPerformAction(TextInputAction.next);
+  }
+
+  /// 换行
+  newLineAction(){
+    CoolKeyboard.sendPerformAction(TextInputAction.newline);
+  }
+
+  ///发送其他Action
+  sendPerformAction(TextInputAction action){
+    CoolKeyboard.sendPerformAction(action);
+  }
 }

+ 2 - 2
pubspec.yaml

@@ -1,6 +1,6 @@
 name: cool_ui
-description: 用flutter实现一些我认为好看的UI控件,目前暂时只有Popover,Weui,不过有什么觉得好看的可以提Issue
-version: 0.1.7
+description: 用flutter实现一些我认为好看的UI控件,目前暂时只有Popover,Weui,Custom Keyboard,不过有什么觉得好看的可以提Issue
+version: 0.1.8
 author: Kevin <liangkaikevin@gmail.com>
 homepage: https://github.com/Im-Kevin/cool_ui