media_query.dart 2.65 KB
Newer Older
1 2 3 4 5 6
// Copyright 2016 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 'package:flutter/material.dart';

7
class AdaptedListItem extends StatelessWidget {
8
  const AdaptedListItem({ Key key, this.name }) : super(key: key);
9 10 11

  final String name;

12
  @override
13 14 15 16 17 18
  Widget build(BuildContext context) {
    return new Row(
      children: <Widget>[
        new Container(
          width: 32.0,
          height: 32.0,
19
          margin: const EdgeInsets.all(8.0),
20
          color: Colors.lightBlueAccent.shade100,
21 22 23 24 25 26 27
        ),
        new Text(name)
      ]
    );
  }
}

28
class AdaptedGridItem extends StatelessWidget {
29
  const AdaptedGridItem({ Key key, this.name }) : super(key: key);
30 31 32

  final String name;

33
  @override
34 35 36 37
  Widget build(BuildContext context) {
    return new Card(
      child: new Column(
        children: <Widget>[
38
          new Expanded(
39
            child: new Container(
40
              color: Colors.lightBlueAccent.shade100,
41 42 43
            )
          ),
          new Container(
44
            margin: const EdgeInsets.only(left: 8.0),
45 46
            child: new Row(
              children: <Widget>[
47
                new Expanded(
48 49
                  child: new Text(name)
                ),
50
                const IconButton(
51
                  icon: Icon(Icons.more_vert),
52
                  onPressed: null
53 54 55 56 57 58 59 60 61 62 63 64 65 66
                )
              ]
            )
          )
        ]
      )
    );
  }
}

const double _kListItemExtent = 50.0;
const double _kMaxTileWidth = 150.0;
const double _kGridViewBreakpoint = 450.0;

67
class AdaptiveContainer extends StatelessWidget {
68
  const AdaptiveContainer({ Key key, this.names }) : super(key: key);
69 70 71

  final List<String> names;

72
  @override
73 74
  Widget build(BuildContext context) {
    if (MediaQuery.of(context).size.width < _kGridViewBreakpoint) {
75
      return new ListView(
76
        itemExtent: _kListItemExtent,
77
        children: names.map((String name) => new AdaptedListItem(name: name)).toList(),
78 79
      );
    } else {
80
      return new GridView.extent(
81 82
        maxCrossAxisExtent: _kMaxTileWidth,
        children: names.map((String name) => new AdaptedGridItem(name: name)).toList(),
83 84 85 86 87 88
      );
    }
  }
}

List<String> _initNames() {
89
  final List<String> names = <String>[];
90 91 92 93 94 95 96 97 98 99
  for (int i = 0; i < 30; i++)
    names.add('Item $i');
  return names;
}

final List<String> _kNames = _initNames();

void main() {
  runApp(new MaterialApp(
    title: 'Media Query Example',
100 101
    home: new Scaffold(
      appBar: new AppBar(
102
        title: const Text('Media Query Example')
103 104 105
      ),
      body: new Material(child: new AdaptiveContainer(names: _kNames))
    )
106 107
  ));
}