103 lines
2.8 KiB
Dart
103 lines
2.8 KiB
Dart
import 'package:flutter/material.dart';
|
||
|
||
/// 创建人： Created by zhaolong
|
||
/// 创建时间：Created by on 2020/12/25.
|
||
///
|
||
/// 可关注公众号：我的大前端生涯 获取最新技术分享
|
||
/// 可关注网易云课堂：https://study.163.com/instructor/1021406098.htm
|
||
/// 可关注博客：https://blog.csdn.net/zl18603543572
|
||
///
|
||
/// 代码清单
|
||
///代码清单
|
||
///自定义文本输入框
|
||
class TextFieldWidget extends StatelessWidget {
|
||
//占位提示文本
|
||
final String hintText;
|
||
|
||
//输入框前置图标
|
||
final IconData prefixIconData;
|
||
|
||
//输入框后置图标
|
||
final IconData suffixIconData;
|
||
|
||
//是否隐藏文本
|
||
final bool obscureText;
|
||
|
||
//输入实时回调
|
||
final Function(String value) onChanged;
|
||
final TextEditingController controller;
|
||
final FocusNode focusNode;
|
||
final Function(String value) submit;
|
||
final Function() onTap;
|
||
|
||
const TextFieldWidget({
|
||
Key key,
|
||
this.hintText,
|
||
this.submit,
|
||
this.focusNode,
|
||
this.prefixIconData,
|
||
this.suffixIconData,
|
||
this.obscureText,
|
||
this.onChanged,
|
||
this.controller,
|
||
this.onTap,
|
||
}) : super(key: key);
|
||
|
||
@override
|
||
Widget build(BuildContext context) {
|
||
//构建输入框
|
||
return TextField(
|
||
focusNode: focusNode,
|
||
controller: controller,
|
||
//实时输入回调
|
||
onChanged: onChanged,
|
||
onSubmitted: submit,
|
||
//是否隐藏文本
|
||
obscureText: obscureText ?? false,
|
||
//隐藏文本小圆点的颜色
|
||
cursorColor: Theme.of(context).colorScheme.secondary,
|
||
//文本样式
|
||
style: TextStyle(
|
||
color: Theme.of(context).colorScheme.secondary,
|
||
fontSize: 14.0,
|
||
),
|
||
//输入框的边框
|
||
decoration: InputDecoration(
|
||
//提示文本
|
||
labelText: hintText,
|
||
//提示文本的样式
|
||
labelStyle: TextStyle(color: Theme.of(context).colorScheme.secondary),
|
||
//可编辑时的提示文本的颜色
|
||
focusColor: Theme.of(context).colorScheme.secondary,
|
||
//填充
|
||
filled: true,
|
||
//可编辑时 无边框样式
|
||
enabledBorder: const UnderlineInputBorder(
|
||
borderSide: BorderSide.none,
|
||
),
|
||
|
||
//获取输入焦点时的边框样式
|
||
focusedBorder: OutlineInputBorder(
|
||
borderRadius: BorderRadius.circular(10),
|
||
borderSide: BorderSide(color: Theme.of(context).colorScheme.secondary),
|
||
),
|
||
|
||
//文本前置的图标
|
||
prefixIcon: Icon(
|
||
prefixIconData,
|
||
size: 18,
|
||
color: Theme.of(context).colorScheme.secondary,
|
||
),
|
||
//文本后置的图标
|
||
suffixIcon: GestureDetector(
|
||
onTap: onTap,
|
||
child: Icon(
|
||
suffixIconData,
|
||
size: 18,
|
||
color: Theme.of(context).colorScheme.secondary,
|
||
),
|
||
),
|
||
),
|
||
);
|
||
}
|
||
} |