Flutter: Grid Посмотреть элемент силы снизу

Question

Я новичок в трепетании и создаю свое первое приложение. Я использую Staggered Grid View (https://pub.dev/packages/flutter_staggered_grid_view# -readme-tab- ), который должен вести себя как обычный Grid View.

Мои настройки: body: StaggeredGridView.count (crossAxisCount: 4 ... это означает, что я могу расположить 4 элемента рядом друг с другом. Все работает нормально.

Но теперь я хотите поместить один элемент в следующий столбец и поместить его посередине, а не рядом с другими. Как я могу это сделать?

Спасибо за помощь!

   body: StaggeredGridView.count(
    crossAxisCount: 4,
    crossAxisSpacing: 12.0,
    mainAxisSpacing: 12.0,
    padding: EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
    children: <Widget>[
    _buildTile(
        Padding
        (
          padding: const EdgeInsets.all(24.0),
          child: Row
          (
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>
            [
             Material
              (
                child: Padding(
                child: Icon(Icons.store, color: Colors.black54, size: 40.0),
                padding: const EdgeInsets.only(right: 15.0),)
             ),
             Column
              (
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>
                [
                  Text('Test', style: TextStyle(color: Colors.redAccent)),
                  Text('Test', style: TextStyle(color: Colors.black, fontWeight: FontWeight.w700, fontSize: 20.0))
                ],
              ),
            ]
          ),
        ),
        onTap: () => print('Not set yet'),
      ),
      _buildTile(
        Padding
        (
          padding: const EdgeInsets.all(24.0),
          child: Row
          (
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>
            [
             Material
              (
                child: Padding(
                child: Icon(Icons.store, color: Colors.black54, size: 40.0),
                padding: const EdgeInsets.only(right: 15.0),)
             ),
             Column
              (
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>
                [
                  Text('Test', style: TextStyle(color: Colors.redAccent)),
                  Text('Test', style: TextStyle(color: Colors.black, fontWeight: FontWeight.w700, fontSize: 20.0))
                ],
              ),
            ]
          ),
        ),
        onTap: () => print('Not set yet'),
      ),
       _buildTile(
        Padding
        (
          padding: const EdgeInsets.all(24.0),
          child: Row
          (
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>
            [
             Material
              (
                child: Padding(
                child: Icon(Icons.store, color: Colors.black54, size: 40.0),
                padding: const EdgeInsets.only(right: 15.0),)
             ),
             Column
              (
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>
                [
                  Text('test', style: TextStyle(color: Colors.redAccent)),
                  Text('test', style: TextStyle(color: Colors.black, fontWeight: FontWeight.w700, fontSize: 20.0))
                ],
              ),
            ]
          ),
        ),
        onTap: () => print('Not set yet'),
      ),
      _buildTile(
        Padding
        (
          padding: const EdgeInsets.all(24.0),
          child: Column
          (
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            crossAxisAlignment: CrossAxisAlignment.center, 
            children: <Widget>
            [
              Material
              (
                color: Colors.teal,
                shape: CircleBorder(),
                child: Center
                (

                   child: Icon(Icons.settings_applications, color: Colors.white, size: 30.0),

                )
              )
            ]
          ),
        ),
      ),
       _buildTile(
        Padding
        (
          padding: const EdgeInsets.all(24.0),
          child: Column
          (
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            crossAxisAlignment: CrossAxisAlignment.center, 
            children: <Widget>
            [

              Material
              (
                color: Colors.teal,
                shape: CircleBorder(),
                child: Center
                (

                    child: Icon(Icons.settings_applications, color: Colors.white, size: 30.0),

                )
              )
            ]
          ),
        ),
      ),
     //THIS IS THE ELEMENT I WANT TO FORCE TO THE NEXT COLUMN AND CENTER
     _buildTile(QrImage(data: "1234567890", version: QrVersions.auto, size: 200.0,),),
      ], 
    staggeredTiles: [
      StaggeredTile.extent(4, (MediaQuery.of(context).size.height-kToolbarHeight-MediaQuery.of(context).padding.top-(8+12)*2)/6),
      StaggeredTile.extent(4, (MediaQuery.of(context).size.height-kToolbarHeight-MediaQuery.of(context).padding.top-(8+12)*2)/6),
      StaggeredTile.extent(4, (MediaQuery.of(context).size.height-kToolbarHeight-MediaQuery.of(context).padding.top-(8+12)*2)/6),
      StaggeredTile.extent(1, (MediaQuery.of(context).size.height-kToolbarHeight-MediaQuery.of(context).padding.top-(8+12)*2)/6),
      StaggeredTile.extent(1, (MediaQuery.of(context).size.height-kToolbarHeight-MediaQuery.of(context).padding.top-(8+12)*2)/6),      
      StaggeredTile.extent(1, (MediaQuery.of(context).size.height-kToolbarHeight-MediaQuery.of(context).padding.top-(8+12)*2)/6),      
    ],
  ),
);
}

Widget _buildTile(Widget child, {Function() onTap}) {
return Material(
  elevation: 14.0,
  borderRadius: BorderRadius.circular(12.0),
  shadowColor: Color(0x802196F3),
  child: InkWell
  (
    // Do onTap() if it isn't null, otherwise do print()
    onTap: onTap != null ? () => onTap() : () { print('${MediaQuery.of(context).padding.top}'); },
    child: child
  )
);
 }
  }