Champ de texte déroulant Flutter

Question

Je suis encore nouveau à Flutter. Existe-t-il un exemple de champ de texte de liste déroulante de matériaux? J'ai vu l'exemple sur Material Text Field mais je n'ai trouvé nulle part dans la documentation comment l'implémenter. Merci pour votre aide.

Answer 1

'Dropdown' n'est peut-être pas le mot correct que vous utilisez pour décrire la conception du champ de texte référencé dans votre exemple de conception de matériau.

Voici comment l'implémenter dans Flutter:

import 'package:flutter/material.Dart';

void main() {
  runApp(TextFieldExample());
}

class TextFieldExample extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Text Field Example',
      home: HomePage(),
      theme: ThemeData(
        primaryColor: Colors.deepPurple,
        accentColor: Colors.white,
      ),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Text Field Example'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          children: <Widget>[
            //Material example
            TextField(
              decoration: InputDecoration(
                  filled: true,
                  hintText: 'Enter text',
                  labelText: 'Default text field'),
              controller: new TextEditingController(),
            ),
            SizedBox(
              height: 16.0,
            ),
            //Alternate
            TextField(
              decoration: InputDecoration(
                  border: OutlineInputBorder(),
                  hintText: 'Enter text',
                  labelText: 'Text field alternate'),
              controller: new TextEditingController(),
            ),
          ],
        ),
      ),
    );
  }
}

Cet exemple d'application contient deux exemples différents de conception de champs de texte qui réduisent et développent l'étiquette associée.

Gif d'exemple d'application - cliquez ici