2017-06-01 73 views
2

我基本上是在創建一個網格動態生成的遊戲。它創建圖塊,將它們添加到列表並將該列表用作children參數的參數。然而,我發現很難將它與固定的小部件結合起來。Flutter - 將動態生成的元素與硬編碼的元素結合起來

讓我們說一切,我想要一個文本元素。我現在遇到的問題是,如果我給你我的動態生成的內容是這樣的:

... 
children: mycontent, 
... 

然後我無處可把我硬編碼小部件。我希望你明白我的意思。到現在爲止,我已經通過創建larget列表,並在複製動態生成的元素,後來加入我的硬編碼小部件解決了這個問題:

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()), 
     ) 
    ), 
    ); 
    } 

它有點兒工作,但一旦非常繁瑣的,因爲我弄清楚我想添加另一個硬編碼的小部件。有關我如何解決此問題的任何建議? 感謝

+0

所有撲翼UI都是「動態」構建的 - 每次調用「構建」方法時,都會從頭開始構建整個UI - 創建新的小部件等等,只保留狀態。因此,以同樣的方式對待「硬編碼」和「動態」小部件。 –

回答

1

我想這是要走的路,但是你可以使用GridView小部件,你可以創建一個TileWidget而不是你buildTile功能。使用GridView應該清理你的代碼,但是你的意思是硬編碼的小部件?

+0

硬編碼我的意思是他們沒有分配給一個變量,並基於條件(比如說for循環)來構建。所以對我來說,硬編碼是如果我將它們直接分配給沒有變量的參數。我擔心GridView,但是這會讓它滾動:/ – OhMad