Commit 6c2bbff4 authored by Collin Jackson's avatar Collin Jackson

Media query class for querying viewport information

parent af790303
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)
)
);
}
}
......@@ -2,6 +2,9 @@
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import 'dart:ui' as ui;
import 'package:flutter/rendering.dart';
import 'package:flutter/services.dart';
import 'package:flutter/widgets.dart';
......@@ -49,14 +52,19 @@ class _MaterialAppState extends State<MaterialApp> {
GlobalObjectKey _navigator;
Size _size;
void initState() {
super.initState();
_navigator = new GlobalObjectKey(this);
WidgetFlutterBinding.instance.addEventListener(_backHandler);
_size = ui.window.size;
FlutterBinding.instance.addMetricListener(_metricHandler);
}
void dispose() {
WidgetFlutterBinding.instance.removeEventListener(_backHandler);
FlutterBinding.instance.removeMetricListener(_metricHandler);
super.dispose();
}
......@@ -72,19 +80,24 @@ class _MaterialAppState extends State<MaterialApp> {
}
}
void _metricHandler(Size size) => setState(() { _size = size; });
Widget build(BuildContext context) {
return new Theme(
data: config.theme ?? new ThemeData.fallback(),
child: new DefaultTextStyle(
style: _errorTextStyle,
child: new DefaultAssetBundle(
bundle: _defaultBundle,
child: new Title(
title: config.title,
child: new Navigator(
key: _navigator,
routes: config.routes,
onGenerateRoute: config.onGenerateRoute
return new MediaQuery(
data: new MediaQueryData(size: _size),
child: new Theme(
data: config.theme ?? new ThemeData.fallback(),
child: new DefaultTextStyle(
style: _errorTextStyle,
child: new DefaultAssetBundle(
bundle: _defaultBundle,
child: new Title(
title: config.title,
child: new Navigator(
key: _navigator,
routes: config.routes,
onGenerateRoute: config.onGenerateRoute
)
)
)
)
......
// Copyright 2015 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import 'basic.dart';
import 'framework.dart';
enum Orientation { portrait, landscape }
class MediaQueryData {
const MediaQueryData({ this.size });
final Size size;
Orientation get orientation {
return size.width > size.height ? Orientation.landscape : Orientation.portrait;
}
bool operator==(Object other) {
if (other.runtimeType != runtimeType)
return false;
MediaQueryData typedOther = other;
return typedOther.size == size;
}
int get hashCode => size.hashCode;
String toString() => '$runtimeType($size, $orientation)';
}
class MediaQuery extends InheritedWidget {
MediaQuery({
Key key,
this.data,
Widget child
}) : super(key: key, child: child) {
assert(child != null);
assert(data != null);
}
final MediaQueryData data;
static MediaQueryData of(BuildContext context) {
MediaQuery query = context.inheritedWidgetOfType(MediaQuery);
return query == null ? null : query.data;
}
bool updateShouldNotify(MediaQuery old) => data != old.data;
void debugFillDescription(List<String> description) {
super.debugFillDescription(description);
description.add('$data');
}
}
......@@ -18,6 +18,7 @@ export 'src/widgets/gesture_detector.dart';
export 'src/widgets/gridpaper.dart';
export 'src/widgets/heroes.dart';
export 'src/widgets/homogeneous_viewport.dart';
export 'src/widgets/media_query.dart';
export 'src/widgets/mimic.dart';
export 'src/widgets/mixed_viewport.dart';
export 'src/widgets/navigator.dart';
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment