CODEWITHSUNDEEP
flutter
ElhamKeshavarz
ElhamKeshavarz

Reputation: 461

Table Alignment in Flutter?

I'm going to use a data table in my application.

In my page I have a background that this data table should be in a specific position (center maybe), but I don't know how to set alignment for that (data table).

Can anyone tell me how to solve this issue?

Upvotes: 14

Views: 24059

Answers (3)

Julius Faubel
Julius Faubel

Reputation: 201

To align your text vertically in a table row you can wrap you Conent with TableCell and set the vertical Alignment parameter:

return TableRow(children: [
    TableCell(
        verticalAlignment: TableCellVerticalAlignment.middle,
        child: Padding(
            padding: const EdgeInsets.all(10),
            child: Text('Hello World'),
        ),
    ),

Upvotes: 20

Vinicius Fernandes
Vinicius Fernandes

Reputation: 140

child: Table(
        children: [
          TableRow(children: [
            Center(child: Text("item 1"),),
            Center(child: Text("item 2"),),
            Center(child: Text("item 3"),),
            Center(child: Text("item 4"),),
            Center(child: Text("Edit"),),
          ]),

Working.

Upvotes: 14

Viren V Varasadiya
Viren V Varasadiya

Reputation: 27137

import 'package:flutter/material.dart';

  void main() => runApp(new Demo());

  class Demo extends StatefulWidget {
    @override
    _DemoState createState() => _DemoState();
  }

  class _DemoState extends State<Demo> with TickerProviderStateMixin {

    @override
    Widget build(BuildContext context) {
      return MaterialApp(
        home: Scaffold(
          appBar: AppBar(
            title: new Text("table demo"),
          ),
          body: new Container(
            child: Center(
              child: new  Table(
                children: const <TableRow>[
                  TableRow(

                    children: <Widget>[
                      Center(child: Text('AAAAAA')), Center(child: Text('B')), Center(child: Text('C')),
                    ],
                  ),
                  TableRow(
                    children: <Widget>[
                      Center(child: Text('BBBB')), Center(child: Text('AAAAAA')), Center(child: Text('vdsvsdvs')),
                    ],
                  ),
                  TableRow(
                    children: <Widget>[
                      Center(child: Text('CCCCCC')), Center(child: Text('F')), Center(child: Text('CG')),
                    ],
                  ),
                ],
              ),
            ),
          )
        )
      );
    }
  }

Upvotes: 0

Related Questions