如何向TextField添加指定的固定值？

Question

我想在TextField中添加固定的不可编辑文本。

例如：当用户输入姓名后，固定文本“[user]”应显示在姓名后面。

the result should be: Alexandra[user]

当用户输入名称时，固定单词[user]必须始终存在！

我希望你理解我的要求，任何相关主题链接都将有所帮助！

我尝试过类似的初始文本，但用户可以编辑，我的应该是固定的。

Controller: TextEditingController(text: "Initial Text here"),

现在我的文本字段：

TextField(
      decoration: InputDecoration(
        labelText: ENTER_NAME,
        labelStyle: GoogleFonts.poppins(
            color: LIGHT_GREY_TEXT,
            fontWeight: FontWeight.w400
        ),
        border: UnderlineInputBorder(),
        focusedBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: LIGHT_GREY_TEXT)
        ),
        errorText: isNameError ? ENTER_NAME : null,
      ),
      style: GoogleFonts.poppins(
          color: BLACK,
          fontWeight: FontWeight.w500
      ),
      onChanged: (val){
        setState(() {
          name = val;
          isNameError = false;
        });
      },
    ),

- AZxBB

---

最接近的是 hintText，它会在用户选择该字段但尚未输入任何内容时显示文本。例如，hintText:“输入搜索词”。 - flutter_bee

@flutter_bee 但是 (a) 当用户开始输入时，hintText会消失 (b) hintText的值不会插入到数据库中。 我需要同时满足这两个选项的内容。 - AZxBB

Answer 1

您可以使用onChanged回调函数来处理用户输入的值。一旦我们拿到了文本字段中的内容，我们就可以在其中进行逻辑处理，并将所需的值设置到textController中。但是，一旦我们以编程方式向textController设置了一个值，光标就会移到零位置；因此，我们也需要更改它。以下是代码片段。

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Postfix Text Controller',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        brightness: Brightness.dark,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final TextEditingController _textController = TextEditingController();
  final String _userPostfix = "[user]";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: const Text("Postfix Text Controller"),
      ),
      body: Center(
        child: Padding(
          padding: const EdgeInsets.all(15.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              TextFormField(
                controller: _textController,
                onChanged: (value) {
                  if (value == _userPostfix) {
                    _textController.text = "";
                    return;
                  }
                  value.endsWith(_userPostfix)
                      ? _textController.text = value
                      : _textController.text = value + _userPostfix;
                  _textController.selection = TextSelection.fromPosition(
                      TextPosition(
                          offset: _textController.text.length -
                              _userPostfix.length));
                },
                decoration: const InputDecoration(
                  labelText: "User",
                  border: OutlineInputBorder(),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

- Arun