blob: a54fd8592850a455b534aa6e8ebf9b486570d9ae [file] [log] [blame]
import 'package:flutter/material.dart';
void main() {
runApp(
new MaterialApp(
title: "Media Query Example",
routes: <String, RouteBuilder>{
'/': (RouteArguments args) => new MediaQueryExample()
}
)
);
}
class AdaptiveItem {
AdaptiveItem(this.name);
String name;
Widget toListItem() {
return new Row(
<Widget>[
new Container(
width: 32.0,
height: 32.0,
margin: const EdgeDims.all(8.0),
decoration: new BoxDecoration(
backgroundColor: Colors.lightBlueAccent[100]
)
),
new Text(name)
]
);
}
Widget toCard() {
return new Card(
child: new Column(
<Widget>[
new Flexible(
child: new Container(
decoration: new BoxDecoration(
backgroundColor: Colors.lightBlueAccent[100]
)
)
),
new Container(
margin: const EdgeDims.only(left: 8.0),
child: new Row(
<Widget>[
new Flexible(
child: new Text(name)
),
new IconButton(
icon: "navigation/more_vert"
)
]
)
)
]
)
);
}
}
class MediaQueryExample extends StatelessComponent {
static const double _maxChildExtent = 150.0;
static const double _gridViewBreakpoint = 450.0;
Widget _buildBody(BuildContext context) {
List<AdaptiveItem> items = <AdaptiveItem>[];
for (int i = 0; i < 30; i++)
items.add(new AdaptiveItem("Item $i"));
if (MediaQuery.of(context).size.width < _gridViewBreakpoint) {
return new Block(
items.map((AdaptiveItem item) => item.toListItem()).toList()
);
} else {
return new Block(
<Widget>[
new Grid(
items.map((AdaptiveItem item) => item.toCard()).toList(),
maxChildExtent: _maxChildExtent
)
]
);
}
}
Widget build(BuildContext context) {
return new Scaffold(
toolBar: new ToolBar(
center: new Text("Media Query Example")
),
body: new Material(
child: _buildBody(context)
)
);
}
}