A widget that displays its children in a horizontal array.
Use Row widget to Layout a list of child widgets in the horizontal direction:
The default constructor creates a horizontal array of children.
Row(
// <Widget> is the type of items in the list.
children: <Widget>[
// add one or more widgets here
],
);
It contains many input parameters which can be configured to change its behavior and appearance.
The children
, parameter is to add the array of child widgets.
The following code snippet shows how to configure Row
widget.
Row(
children: <Widget>[
Expanded(
child: Text('Deliver features faster', textAlign: TextAlign.center),
),
Expanded(
child: Text('Craft beautiful UIs', textAlign: TextAlign.center),
),
Expanded(
child: FittedBox(
fit: BoxFit.contain, // otherwise the logo will be tiny
child: const FlutterLogo(),
),
),
],
);
This example divides the available space into three (horizontally), and places text centered in the first two cells and the Flutter logo centered in the third.
import 'package:flutter/material.dart';
class RowDemo extends StatelessWidget {
Widget build(BuildContext context) {
// Return Material widget
return Material(
child: Row(
children: <Widget>[
Expanded(
child: Text('Deliver features faster', textAlign: TextAlign.center),
),
Expanded(
child: Text('Craft beautiful UIs', textAlign: TextAlign.center),
),
Expanded(
child: FittedBox(
fit: BoxFit.contain, // otherwise the logo will be tiny
child: const FlutterLogo(),
),
),
],
),
);
}
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
Widget build(BuildContext context) {
// MaterialApp Widget
return MaterialApp(
title: 'Row Demo',
home: RowDemo(),
);
}
}
void main() => runApp(MyApp());