The "col" and "row" in Flutter are similar to Bootstrap.
You can simply use new Row(children:..);
and put whatever you want inside it.
One thing to note is that if you put too many things inside without using a ListView, it will cause an error due to screen overflow.
Demo code:
import 'package:flutter/material.dart';
class AppBar extends StatelessWidget{
@override
Widget build(BuildContext context) {
// TODO: implement build
return new Container(
// margin: const EdgeInsets.fromLTRB(0.0, 24.0, 0.0, 0.0),
color: Colors.purple.shade300,
child: new Row(
children: <Widget>[
new IconButton(
icon: new Icon(Icons.menu),
tooltip: 'menu',
onPressed: null,
),
new Expanded(
child: new Text('Title'),
),
new IconButton(
icon: new Icon(Icons.search),
tooltip: 'search',
onPressed: null,
)
],
),
);
}
}
class PageContent extends StatelessWidget{
const PageContent({this.color});
final Color color;
@override
Widget build(BuildContext context) {
//
return new Material(
child: new Column(
children: <Widget>[
new Row(
children: <Widget>[
new Expanded(
child: new Container(
height: 50.0,
color: Colors.orange,
child: new Text('test'),
)
),
new Expanded(
child: new Container(
height: 50.0,
color: Colors.blue,
child: new Text('test'),
)
),
new Expanded(
child: new Container(
height: 50.0,
color: Colors.teal,
child: new Text('test'),
)
),
],
),
new Image.network('https://i0.hdslb.com/bfs/archive/36f639d8cedc57840aff48361a7a1e8389040077.jpg'),
new Image.network('https://i0.hdslb.com/bfs/archive/36f639d8cedc57840aff48361a7a1e8389040077.jpg'),
new Container(
margin: const EdgeInsets.fromLTRB(0.0, 10.0, 0.0, 0.0),
child: new Text('VioletEverGarden',
style: new TextStyle(
color: color,
fontSize: 36.0
)
),
)
],
)
);
}
}
class HomePage extends StatelessWidget{
const HomePage({this.color});
final Color color;
@override
Widget build(BuildContext context) {
// TODO: implement build
return new Material(
child: new Column(
children: <Widget>[
new Container(
color: this.color,
height: 24.0,
),
new AppBar(),
new PageContent(color: color,)
],
),
);
}
}
void main()=>runApp(new MaterialApp(
title: 'title',
home: new HomePage(color:const Color.fromRGBO(138,43,226, 1.0)),
));