Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make a multi column Flutter DataTable widget span the full width?

I have a 2 column flutter DataTable and the lines don't span the screen width leaving lots of white space. I found this issue

https://github.com/flutter/flutter/issues/12775

That recommended wrapping the DataTable in a SizedBox.expand widget but that does not work produces RenderBox was not laid out:

SizedBox.expand(
                    child: DataTable(columns:_columns, rows:_rows),
            ),

enter image description here

Full widget

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body:
      SingleChildScrollView(
      child: Column(
        children: [Container(Text('My Text')),
        Container(
          alignment: Alignment.topLeft,
          child: SingleChildScrollView(scrollDirection: Axis.horizontal,
            child: SizedBox.expand(
                        child: DataTable(columns:_columns, rows:_rows),
                ),
          ),
        ),
      ]))
    );
  }
like image 619
user1961 Avatar asked Jun 17 '19 05:06

user1961


1 Answers

You can add the crossAxisAlignment for your Column to strech

crossAxisAlignment: CrossAxisAlignment.stretch
like image 106
diegoveloper Avatar answered Oct 14 '22 13:10

diegoveloper