如何使用Flutter创建非对称表

时间:2019-08-12 12:07:59

标签: flutter flutter-layout

我正在尝试使用flutter编写一个简单的应用程序。这是我第一个训练的人。

我找不到创建非对称表的解决方案。我尝试使用Table小部件,但无法使行/列与我看到的有所不同。

现在,我做了一个简单的行/列模式,但这仍然不是我想要的。

这是我的实际代码:

Widget TableScore(){
return Expanded(
  child : Row(
    mainAxisAlignment: MainAxisAlignment.spaceAround,
  children: [
  // premiere colonne : 465 + tuts
    Column(
      children: [
        Row(
          children: [
            Container(
              decoration: myBoxDecorationScore(),
              child : Text('Tuts', textAlign: TextAlign.center, style: TextStyle(fontSize: 45, fontWeight: FontWeight.bold),),
            ),
          ],
        ),

        Row(
          children: [
            Container(
            decoration: myBoxDecorationScore(),
              child : Text('Tour 5', textAlign: TextAlign.center),
            ),
          ],
        ),
      ],
    ),

    // Deuxieme Colonne 3 darts + score total tour
    Column(
      children: [
        Row(
          children: [
            Container(
              decoration: myBoxDecorationScore(),
              child : Text('1', textAlign: TextAlign.center,),
            ),
            Container(
              decoration: myBoxDecorationScore(),
              child : Text('2', textAlign: TextAlign.center,),
            ),
            Container(
              decoration: myBoxDecorationScore(),
              child : Text('3', textAlign: TextAlign.center,),
            ),
          ],
        ),
        Row(
          children: [
            Container(
              decoration: myBoxDecorationScore(),
              child : Text('6', textAlign: TextAlign.center),
            ),
          ],
        ),
      ],
    ),

    Column(
      children: [
        Row(
          children: [
            Container(
              decoration: myBoxDecorationScore(),
              child : Text('485', textAlign: TextAlign.center, style: TextStyle(fontSize: 45, fontWeight: FontWeight.bold),),
            ),
          ],
        ),
        Row(
          children: [
            Container(
              decoration: myBoxDecorationScore(),
              child : Text('501', textAlign: TextAlign.center),
            ),
          ],
        ),
      ],
    ),
    ],
   ),
  );
}

我对这段代码有什么看法?

result

我想要什么:

goal

0 个答案:

没有答案