Flattern - Kombiniere dynamisch generierte Elemente mit fest codierten Elementen

Question

Ich erstelle im Grunde ein Spiel, in dem ein Raster dynamisch generiert wird. Er erstellt die Kacheln, fügt sie zu einer Liste hinzu und verwendet diese Liste als Argument für den Parameter children. Was ich jedoch schwierig finde, ist die Kombination mit festen Widgets.

Sagen wir oben zu allem, ich möchte ein Textelement. Das Problem, das ich jetzt begegnen, ist, dass, wenn ich meine dynamisch generierte Inhalte wie folgt vergeben:

... 
children: mycontent, 
... 

dann habe ich nirgends meine hart codiert Widgets zu setzen. Ich hoffe du weißt was ich meine. Bis jetzt habe ich es durch die Schaffung einer larget Liste und das Kopieren der dynamisch generierten Elemente über gelöst, und danach meine hartcodierte Widgets hinzufügen:

Widget buildTile(int counter) { 
    return new GestureDetector(
     onTap:(){ 
     setState((){ 
      toggleColor(counter); 
     }); 
     }, 
     child: new Container(
     color: colors[counter], 
     foregroundDecoration: new BoxDecoration(
      border: new Border(), 
     ), 
     width: 75.0, 
     height: 75.0, 
     margin: new EdgeInsets.all(2.0), 
    ) 
    ); 
    } 

    List<Widget> buildGrid(){ 
    Map dimensions = {"width" : 4, "height" : 6}; 
    List<Widget> grid = new List<Widget>(dimensions["height"]); 
    List<Widget> tiles = []; 

    int counter = 0; 

    for (int i = 0; i < dimensions["height"]; i++){ 
     tiles = []; 
     for (int j = 0; j < dimensions["width"]; j++){ 
     tiles.add(buildTile(counter)); 
     counter++; 
     } 
     grid[i] = new Row(
     mainAxisAlignment: MainAxisAlignment.center, 
     children: tiles, 
    ); 
    } 
    return grid; 
    } 

    List<Widget> copyElements(List<Widget> from){ 
    List<Widget> to = []; 
    for (int i = 0; i < from.length; i++){ 
     to.add(from[i]); 
    } 
    return to; 
    } 

    List<Widget> buildPlayground(List<Widget> grid){ 
    List<Widget> playground = []; 

    playground = copyElements(grid); 

    playground.add(new Padding(
     padding: new EdgeInsets.all(20.0), 
     child: new RaisedButton(
     color: Colors.purple, 
     child: new Container(
      width: 100.0, 
      child: new Center(
      child: new Text("Done", style: new TextStyle(fontSize: 20.0)), 
     ), 
     ), 
     onPressed:(){ 

     } 
    ), 
    )); 
    return playground; 
    } 

    @override 
    build(BuildContext context){ 
    return new Scaffold(
     appBar: new AppBar(
     title: new Text("Game"), 
    ), 
     body: new Container(
     child: new Column(
      mainAxisAlignment: MainAxisAlignment.center, 
      children: buildPlayground(buildGrid()), 
     ) 
    ), 
    ); 
    } 

Es funktioniert irgendwie, aber es ist sehr mühsam, sobald ich heraus dass ich ein weiteres hart codiertes Widget hinzufügen möchte. Irgendwelche Vorschläge, wie ich dieses Problem angehen kann? Dank

Answer 1

Ich denke, dies ist der Weg zu gehen, aber könnten Sie den GridView-Widget verwenden, und Sie könnten ein TileWidget anstelle von Ihnen buildTile Funktion erstellen. Mit GridView sollten Sie Ihren Code reinigen, aber was meinen Sie mit hartcodierten Widgets?