『Flutter』警告修复 & 常用组件 TextField

1.前言

在上一篇文章中，给大家介绍有无状态组件的时候代码中出现了一些警告，那么这些警告是什么意思呢？我们该如何修复呢？

2.正文

2.1.警告信息

Constructors for public widgets should have a named 'key' parameter.

这个警告的意思是：公共组件的构造函数应该有一个命名的key参数。该如何修复呢？我们只需要在组件的构造函数中添加一个key参数即可。

可以利用 Android Studio 来修复，将鼠标放在警告上面，然后点击Add key to constructor即可。

Use 'const' with the constructor to improve performance.

这个警告的意思是：使用const关键字来修饰构造函数可以提高性能，因为是不会发生变化的。该如何修复呢？我们只需要在组件的构造函数前面添加const关键字即可。

可以利用 Android Studio 来修复，将鼠标放在警告上面，然后点击Add const modifier即可。

Unnecessary 'this.' qualifier.

这个警告的意思是：不必要的this.限定符。该如何修复呢？我们只需要将this.删除即可。

This class (or a class that this class inherits from) is marked as '@immutable', but one or more of its instance fields aren't final: MyHomeTwo.isCheck

这个警告的意思是：这个类（或者这个类继承的类）被标记为@immutable，但是它的一个或多个实例字段不是final的。该如何修复呢？我们只需要将final关键字添加到isCheck字段即可。

『Flutter』常用组件 TextField

1.前言

经过上一篇文章的介绍，给大家讲述了 Flutter 中的有无状态组件，以及有状态组件的使用方法，本文将继续围绕着 Flutter 中常用的组件来讲述一下，因为这些组件在开发中使用的频率非常高，所以大家一定要掌握好。

本次要讲述的组件有：

• TextField

2.TextField

2.1.介绍

Flutter 的 TextField 组件是一个用于文本输入的基础组件，它提供了用户输入文本的界面。TextField 允许用户输入文本，并且可以通过各种属性来定制其外观和行为。

2.2.常用属性

1. controller：类型为 TextEditingController，用于控制文本的内容。
2. decoration：类型为 InputDecoration，用于定制 TextField 的外观，如提示文本、标签、边框等。
3. keyboardType：用于指定键盘类型，例如数字键盘、邮箱键盘等。
4. obscureText：一个布尔值，用于控制是否隐藏输入内容，常用于密码输入。
5. onChanged：当文本发生变化时触发的回调函数。
6. onSubmitted：用户在键盘上按下完成按钮时触发的回调函数。
7. enabled：一个布尔值，用于控制 TextField 是否启用。

2.3.示例代码

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('TextField Example'),
        ),
        body: Center(
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: TextField(
              decoration: InputDecoration(
                border: OutlineInputBorder(),
                labelText: 'Enter Text',
              ),
              onChanged: (text) {
                print("Text changed: $text");
              },
              onSubmitted: (text) {
                print("Text submitted: $text");
              },
            ),
          ),
        ),
      ),
    );
  }
}

2.4.效果

在这个例子中，创建了一个基础的 TextField，它包含一个外边框和一个标签，并且还添加了对文本变化和提交的监听。

如上只是一个简单的例子，很多属性大家自行到时候用到查一下相关资料即可。

3.参考资料

• https://api.flutter.dev/flutter/material/TextField-class.html

End

• 🐤如果您对本文有任何疑问或想法，请在评论区留言，我将很乐意与您交流。
• 🐰您的每一条评论对我都至关重要，我会尽快给予回复。
• 🎈如果您觉得这篇文章对您有所启发或帮助，请不吝赞赏、收藏或分享。
• 🎁您的每一个动作都是对我创作的最大鼓励和支持。
• 👍谢谢您的阅读和陪伴！

我正在参与2024腾讯技术创作特训营第五期有奖征文，快来和我瓜分大奖！