# 设置获取验证码

By [TechZone](https://paragraph.com/@techzone) · 2023-01-16

---

找了很久的代码，可以实现获取验证码的样式，

    Container(
                margin: EdgeInsets.only(top: screenAdapter.height(60)),
                padding: EdgeInsets.all(screenAdapter.width(40)),
                child: PinCodeTextField(
                  autoFocus: true, //进入就弹出键盘
                  keyboardType: TextInputType.number, //调用数字键盘
                  length: 6,
                  obscureText: false,
                  animationType: AnimationType.fade,
                  dialogConfig: DialogConfig(
                      //汉化dialog
                      dialogTitle: "黏贴验证码",
                      dialogContent: "确定要黏贴验证码",
                      affirmativeText: "确定",
                      negativeText: "取消"), //配置dialog
                  pinTheme: PinTheme(
                    //样式
                    // 修改边框
                    activeColor: Colors.black12, // 输入文字后边框的颜色
                    selectedColor: Colors.orange, // 选中边框的颜色
                    inactiveColor: Colors.black12, //默认的边框颜色
                    //背景颜色
                    activeFillColor: Colors.white,
                    selectedFillColor: Colors.orange,
                    inactiveFillColor: const Color.fromRGBO(245, 245, 245, 1),
    
                    shape: PinCodeFieldShape.box,
                    borderRadius: BorderRadius.circular(5),
                    fieldHeight: 50,
                    fieldWidth: 40,
                  ),
                  animationDuration: const Duration(milliseconds: 300),
                  enableActiveFill: true,
                  controller: controller.editingController, //TextFiled控制器
                  onCompleted: (v) {
                    print("Completed");
                  },
                  onChanged: (value) {
                    print(value);
                  },
                  beforeTextPaste: (text) {
                    print("Allowing to paste $text");
                    return true;
                  },
                  appContext: context, //注意需要传入context
                ),
              ),
              SizedBox(
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    TextButton(onPressed: () {}, child: Text("重新发送验证码")),
                    TextButton(onPressed: () {}, child: Text("帮助")),
                  ],
                ),
              ),
              PassButton(
                  text: "获取验证码",
                  onPressed: () {
                    print(controller.editingController.text);
                    // 隐藏键盘
                    FocusScope.of(context).requestFocus(FocusNode());
                  }),
    

可以根据不同的需求进行调整代码风格，还有能获取到验证码的

---

*Originally published on [TechZone](https://paragraph.com/@techzone/vOuIzhi0VtKtNsqOQDC0)*