web-dev-qa-db-fra.com

Comment fournir une valeur initiale à un champ de texte?

Je voudrais fournir une valeur initiale à un champ de texte et le redessiner avec une valeur vide pour effacer le texte. Quelle est la meilleure approche pour le faire avec les API de Flutter?

dartflutter
30
Seth Ladd

(De la liste de diffusion. Je n'ai pas trouvé cette réponse.)

class _FooState extends State<Foo> {
  TextEditingController _controller;

  @override
  void initState() {
    super.initState();
    _controller = new TextEditingController(text: 'Initial value');
  }

  @override
  Widget build(BuildContext context) {
    return new Column(
      children: <Widget>[
        new TextField(
          // The TextField is first built, the controller has some initial text,
          // which the TextField shows. As the user edits, the text property of
          // the controller is updated.
          controller: _controller,
        ),
        new RaisedButton(
          onPressed: () {
            // You can also use the controller to manipuate what is shown in the
            // text field. For example, the clear() method removes all the text
            // from the text field.
            _controller.clear();
          },
          child: new Text('CLEAR'),
        ),
      ],
    );
  }
}
41
Seth Ladd

Vous pouvez utiliser TextFormField au lieu de TextField et utiliser la propriété initialValue. par exemple

TextFormField(initialValue: "I am smart")
15
Sami Kanafani

Si vous utilisez TextEditingController, définissez le texte comme indiqué ci-dessous.

TextEditingController _controller = new TextEditingController();


_controller.text = 'your initial text';

final your_text_name = TextFormField(
      autofocus: false,
      controller: _controller,
      decoration: InputDecoration(
        hintText: 'Hint Value',
      ),
    );

et si vous n'utilisez pas TextEditingController, vous pouvez directement utiliser initialValue comme ci-dessous

final last_name = TextFormField(
      autofocus: false,
      initialValue: 'your initial text',
      decoration: InputDecoration(
        hintText: 'Last Name',
      ),
    );

Pour plus de référence TextEditingController

8
Nirav Bhavsar

Si vous souhaitez gérer plusieurs TextInput comme demandé par @MRT dans le commentaire de la réponse acceptée, vous pouvez créer une fonction qui prend une valeur initiale et renvoie un TextEditingController comme ceci: 

initialValue(val) {
  return TextEditingController(text: val);
}

Ensuite, définissez cette fonction comme contrôleur pour TextInput et fournissez sa valeur initiale comme suit:

controller: initialValue('Some initial value here....')

Vous pouvez répéter cette opération pour les autres TextInputs.

2
Muaad

en classe intérieure, 

  final usernameController = TextEditingController(text: 'bhanuka');

Champ de texte, 

   child: new TextField(
        controller: usernameController,
    ...
)
0
BloodLoss