Merge pull request #1512 from richardshiue/fix-flowytextfield-bugs

fix: flowy text field bugs
This commit is contained in:
Nathan.fooo
2022-11-30 20:30:42 +08:00
committed by GitHub
3 changed files with 17 additions and 9 deletions

View File

@ -152,7 +152,7 @@ class _TextFilterEditorState extends State<TextFilterEditor> {
return FlowyTextField( return FlowyTextField(
text: state.filter.content, text: state.filter.content,
hintText: LocaleKeys.grid_settings_typeAValue.tr(), hintText: LocaleKeys.grid_settings_typeAValue.tr(),
autoFucous: false, autoFocus: false,
onSubmitted: (text) { onSubmitted: (text) {
context context
.read<TextFilterEditorBloc>() .read<TextFilterEditorBloc>()

View File

@ -123,8 +123,9 @@ class _OptionNameTextField extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return FlowyTextField( return FlowyTextField(
autoFucous: autoFocus, autoFocus: autoFocus,
text: name, text: name,
maxLength: 30,
onSubmitted: (newName) { onSubmitted: (newName) {
if (name != newName) { if (name != newName) {
context context

View File

@ -1,6 +1,7 @@
import 'package:flowy_infra/size.dart'; import 'package:flowy_infra/size.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/services.dart'; import 'package:flutter/services.dart';
import 'package:textstyle_extensions/textstyle_extensions.dart';
class FlowyTextField extends StatefulWidget { class FlowyTextField extends StatefulWidget {
final String hintText; final String hintText;
@ -8,17 +9,18 @@ class FlowyTextField extends StatefulWidget {
final void Function(String)? onChanged; final void Function(String)? onChanged;
final void Function(String)? onSubmitted; final void Function(String)? onSubmitted;
final void Function()? onCanceled; final void Function()? onCanceled;
final bool autoFucous; final bool autoFocus;
final int? maxLength; final int? maxLength;
final TextEditingController? controller; final TextEditingController? controller;
final bool autoClearWhenDone; final bool autoClearWhenDone;
const FlowyTextField({ const FlowyTextField({
this.hintText = "", this.hintText = "",
this.text = "", this.text = "",
this.onChanged, this.onChanged,
this.onSubmitted, this.onSubmitted,
this.onCanceled, this.onCanceled,
this.autoFucous = true, this.autoFocus = true,
this.maxLength, this.maxLength,
this.controller, this.controller,
this.autoClearWhenDone = false, this.autoClearWhenDone = false,
@ -32,7 +34,6 @@ class FlowyTextField extends StatefulWidget {
class FlowyTextFieldState extends State<FlowyTextField> { class FlowyTextFieldState extends State<FlowyTextField> {
late FocusNode focusNode; late FocusNode focusNode;
late TextEditingController controller; late TextEditingController controller;
var textLength = 0;
@override @override
void initState() { void initState() {
@ -45,7 +46,7 @@ class FlowyTextFieldState extends State<FlowyTextField> {
controller = TextEditingController(); controller = TextEditingController();
controller.text = widget.text; controller.text = widget.text;
} }
if (widget.autoFucous) { if (widget.autoFocus) {
WidgetsBinding.instance.addPostFrameCallback((_) { WidgetsBinding.instance.addPostFrameCallback((_) {
focusNode.requestFocus(); focusNode.requestFocus();
}); });
@ -60,6 +61,7 @@ class FlowyTextFieldState extends State<FlowyTextField> {
focusNode: focusNode, focusNode: focusNode,
onChanged: (text) { onChanged: (text) {
widget.onChanged?.call(text); widget.onChanged?.call(text);
setState(() {});
}, },
onSubmitted: (text) { onSubmitted: (text) {
widget.onSubmitted?.call(text); widget.onSubmitted?.call(text);
@ -71,9 +73,10 @@ class FlowyTextFieldState extends State<FlowyTextField> {
maxLines: 1, maxLines: 1,
maxLength: widget.maxLength, maxLength: widget.maxLength,
maxLengthEnforcement: MaxLengthEnforcement.truncateAfterCompositionEnds, maxLengthEnforcement: MaxLengthEnforcement.truncateAfterCompositionEnds,
style: Theme.of(context).textTheme.bodySmall, style: Theme.of(context).textTheme.bodyMedium,
decoration: InputDecoration( decoration: InputDecoration(
contentPadding: const EdgeInsets.all(10), contentPadding:
const EdgeInsets.symmetric(horizontal: 10, vertical: 13),
enabledBorder: OutlineInputBorder( enabledBorder: OutlineInputBorder(
borderSide: BorderSide( borderSide: BorderSide(
color: Theme.of(context).colorScheme.primary, color: Theme.of(context).colorScheme.primary,
@ -83,6 +86,10 @@ class FlowyTextFieldState extends State<FlowyTextField> {
), ),
isDense: true, isDense: true,
hintText: widget.hintText, hintText: widget.hintText,
hintStyle: Theme.of(context)
.textTheme
.bodySmall!
.textColor(Theme.of(context).hintColor),
suffixText: _suffixText(), suffixText: _suffixText(),
counterText: "", counterText: "",
focusedBorder: OutlineInputBorder( focusedBorder: OutlineInputBorder(
@ -115,7 +122,7 @@ class FlowyTextFieldState extends State<FlowyTextField> {
String? _suffixText() { String? _suffixText() {
if (widget.maxLength != null) { if (widget.maxLength != null) {
return '${textLength.toString()}/${widget.maxLength.toString()}'; return ' ${controller.text.length}/${widget.maxLength}';
} else { } else {
return null; return null;
} }