03-Jun-2021
.
Admin
Hi Guys,
In this article i will explain you how to create table in flutter how can used in table with flutter.
Flutter Table widget can be utilized to display items in a table layout.
Flutter Table widget has properties like border, columnWidths, textDirection, etc., that avail us to enhance or modify the look of the table layout.
Here, i will full example of crate table using flutter follow my step you can check code and copy code.
Example
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State
{ double iconSize = 40;
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Flutter Table Example - Nicesnippets.com'),
),
body: Center(
child: Column(children:
[ Container(
margin: EdgeInsets.all(15),
child: Table(
border: TableBorder.all(),
children: [
TableRow( children: [
Column(children:[
Icon(Icons.video_call, size: iconSize,),
Text('Video Call')
]),
Column(children:[
Icon(Icons.photo_album, size: iconSize,),
Text('Albums')
]),
Column(children:[
Icon(Icons.notes, size: iconSize,),
Text('Notes')
]),
]),
TableRow( children: [
Column(children:[
Icon(Icons.privacy_tip, size: iconSize,),
Text('Privacy Tips')
]),
Column(children:[
Icon(Icons.email, size: iconSize,),
Text('Email')
]),
Column(children:[
Icon(Icons.calendar_today, size: iconSize,),
Text('Calendar')
]),
]),
],
),
),
]))),
);
}
}
You can run this code in your android emulator you can show bellow image i mentioned the border for table widget, hence border is displayed.if you don't want to simple you can remove the property to not display the border.
Preview
I Hope It Will Help You...
#Android Studio
#Flutter