web-dev-qa-db-fra.com

Comment faire une carte extensible?

Je suis nouveau pour flotter et je veux faire une liste de cartes comme celle-ci.

enter image description here

J'ai essayé de comprendre l'original projet mais je ne suis pas capable de comprendre.

Je veux juste faire une carte extensible sans l'effet GIF/vidéo de fond

Merci...

10
Puneet Kumar

essayez d'ajouter un ExpansionTile à l'intérieur d'un Card, cela élargira le Card lorsque vous développez le ExpansionTile

Card(
  child: Padding(
   padding: EdgeInsets.only(
      top: 36.0, left: 6.0, right: 6.0, bottom: 6.0),
      child: ExpansionTile(
      title: Text('Birth of Universe'),
        children: <Widget>[
         Text('Big Bang'),
         Text('Birth of the Sun'),
         Text('Earth is Born'),
      ],
    ),
  ),
)
7
Sami Kanafani

Voici un exemple de ce que j'ai dit dans les commentaires sur votre question:

Il contient une carte avec un conteneur qui contient une hauteur, la hauteur est mise à jour lorsque la carte est exploitée en raison de l'événement Inkwell ONTAP. , l'ONTAP appelle la fonction SetState () Fonction pour mettre à jour les widgets, avec la nouvelle hauteur de la carte.

   class MyApp extends StatefulWidget {
      double oldheight = 100.0;
      double newheight = 200.0;
      double height = 200.0;

      @override
      Widget build(BuildContext context) {
        final title = 'Basic List';

        return MaterialApp(
          title: title,
          home: Scaffold(
            appBar: AppBar(
              title: Text(title),
            ),
            body: ListView(
              children: <Widget>[
                InkWell(
                  onTap: () {
                    setState(() {
                      if (height == oldheight) {
                        height = newheight;
                      }
                      else{
                        height = oldheight;
                      }
                    });
                  },
                  child: Card(
                    child:Container(height: height,),
                  ),
                ),
              ],
            ),
          ),
        );
      }

Ce n'est pas encore testé ...

0
FoxyError