Ian Hickson | 449f4a6 | 2019-11-27 15:04:02 -0800 | [diff] [blame] | 1 | // Copyright 2014 The Flutter Authors. All rights reserved. |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 2 | // Use of this source code is governed by a BSD-style license that can be |
| 3 | // found in the LICENSE file. |
| 4 | |
| 5 | import 'package:flutter/material.dart'; |
| 6 | |
Adam Barth | 95fc5ae | 2016-03-12 12:13:16 -0800 | [diff] [blame] | 7 | class AdaptedListItem extends StatelessWidget { |
Michael Goderbauer | 91bcf42 | 2022-03-29 12:53:08 -0700 | [diff] [blame] | 8 | const AdaptedListItem({ super.key, required this.name }); |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 9 | |
| 10 | final String name; |
| 11 | |
Hixie | 797e27e | 2016-03-14 13:31:43 -0700 | [diff] [blame] | 12 | @override |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 13 | Widget build(BuildContext context) { |
Alexandre Ardhuin | d927c93 | 2018-09-12 08:29:29 +0200 | [diff] [blame] | 14 | return Row( |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 15 | children: <Widget>[ |
Alexandre Ardhuin | d927c93 | 2018-09-12 08:29:29 +0200 | [diff] [blame] | 16 | Container( |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 17 | width: 32.0, |
| 18 | height: 32.0, |
Adam Barth | e71bd77 | 2016-03-12 11:43:18 -0800 | [diff] [blame] | 19 | margin: const EdgeInsets.all(8.0), |
Ian Hickson | 36052e6 | 2017-04-27 14:19:01 -0700 | [diff] [blame] | 20 | color: Colors.lightBlueAccent.shade100, |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 21 | ), |
Alexandre Ardhuin | 387f885 | 2019-03-01 08:17:55 +0100 | [diff] [blame] | 22 | Text(name), |
| 23 | ], |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 24 | ); |
| 25 | } |
| 26 | } |
| 27 | |
Adam Barth | 95fc5ae | 2016-03-12 12:13:16 -0800 | [diff] [blame] | 28 | class AdaptedGridItem extends StatelessWidget { |
Michael Goderbauer | 91bcf42 | 2022-03-29 12:53:08 -0700 | [diff] [blame] | 29 | const AdaptedGridItem({ super.key, required this.name }); |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 30 | |
| 31 | final String name; |
| 32 | |
Hixie | 797e27e | 2016-03-14 13:31:43 -0700 | [diff] [blame] | 33 | @override |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 34 | Widget build(BuildContext context) { |
Alexandre Ardhuin | d927c93 | 2018-09-12 08:29:29 +0200 | [diff] [blame] | 35 | return Card( |
| 36 | child: Column( |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 37 | children: <Widget>[ |
Alexandre Ardhuin | d927c93 | 2018-09-12 08:29:29 +0200 | [diff] [blame] | 38 | Expanded( |
| 39 | child: Container( |
Ian Hickson | 36052e6 | 2017-04-27 14:19:01 -0700 | [diff] [blame] | 40 | color: Colors.lightBlueAccent.shade100, |
Alexandre Ardhuin | 387f885 | 2019-03-01 08:17:55 +0100 | [diff] [blame] | 41 | ), |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 42 | ), |
Alexandre Ardhuin | d927c93 | 2018-09-12 08:29:29 +0200 | [diff] [blame] | 43 | Container( |
Adam Barth | e71bd77 | 2016-03-12 11:43:18 -0800 | [diff] [blame] | 44 | margin: const EdgeInsets.only(left: 8.0), |
Alexandre Ardhuin | d927c93 | 2018-09-12 08:29:29 +0200 | [diff] [blame] | 45 | child: Row( |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 46 | children: <Widget>[ |
Alexandre Ardhuin | d927c93 | 2018-09-12 08:29:29 +0200 | [diff] [blame] | 47 | Expanded( |
Alexandre Ardhuin | 387f885 | 2019-03-01 08:17:55 +0100 | [diff] [blame] | 48 | child: Text(name), |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 49 | ), |
Ian Hickson | 3eb8783 | 2017-04-07 12:24:32 -0700 | [diff] [blame] | 50 | const IconButton( |
Alexandre Ardhuin | eda03e2 | 2018-08-02 12:02:32 +0200 | [diff] [blame] | 51 | icon: Icon(Icons.more_vert), |
Alexandre Ardhuin | 387f885 | 2019-03-01 08:17:55 +0100 | [diff] [blame] | 52 | onPressed: null, |
| 53 | ), |
| 54 | ], |
| 55 | ), |
| 56 | ), |
| 57 | ], |
| 58 | ), |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 59 | ); |
| 60 | } |
| 61 | } |
| 62 | |
| 63 | const double _kListItemExtent = 50.0; |
| 64 | const double _kMaxTileWidth = 150.0; |
| 65 | const double _kGridViewBreakpoint = 450.0; |
| 66 | |
Adam Barth | 95fc5ae | 2016-03-12 12:13:16 -0800 | [diff] [blame] | 67 | class AdaptiveContainer extends StatelessWidget { |
Michael Goderbauer | 91bcf42 | 2022-03-29 12:53:08 -0700 | [diff] [blame] | 68 | const AdaptiveContainer({ super.key, required this.names }); |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 69 | |
| 70 | final List<String> names; |
| 71 | |
Hixie | 797e27e | 2016-03-14 13:31:43 -0700 | [diff] [blame] | 72 | @override |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 73 | Widget build(BuildContext context) { |
Greg Spencer | 5528932 | 2020-10-28 07:56:41 -0700 | [diff] [blame] | 74 | if (MediaQuery.of(context).size.width < _kGridViewBreakpoint) { |
Alexandre Ardhuin | d927c93 | 2018-09-12 08:29:29 +0200 | [diff] [blame] | 75 | return ListView( |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 76 | itemExtent: _kListItemExtent, |
Alexandre Ardhuin | f62afdc | 2018-10-01 21:29:08 +0200 | [diff] [blame] | 77 | children: names.map<Widget>((String name) => AdaptedListItem(name: name)).toList(), |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 78 | ); |
| 79 | } else { |
Alexandre Ardhuin | d927c93 | 2018-09-12 08:29:29 +0200 | [diff] [blame] | 80 | return GridView.extent( |
Adam Barth | fe01c71 | 2017-02-01 11:01:02 -0800 | [diff] [blame] | 81 | maxCrossAxisExtent: _kMaxTileWidth, |
Alexandre Ardhuin | f62afdc | 2018-10-01 21:29:08 +0200 | [diff] [blame] | 82 | children: names.map<Widget>((String name) => AdaptedGridItem(name: name)).toList(), |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 83 | ); |
| 84 | } |
| 85 | } |
| 86 | } |
| 87 | |
Alexandre Ardhuin | df4bf45 | 2019-09-17 16:23:44 +0200 | [diff] [blame] | 88 | List<String> _initNames() => List<String>.generate(30, (int i) => 'Item $i'); |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 89 | |
| 90 | final List<String> _kNames = _initNames(); |
| 91 | |
| 92 | void main() { |
Alexandre Ardhuin | d927c93 | 2018-09-12 08:29:29 +0200 | [diff] [blame] | 93 | runApp(MaterialApp( |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 94 | title: 'Media Query Example', |
Alexandre Ardhuin | d927c93 | 2018-09-12 08:29:29 +0200 | [diff] [blame] | 95 | home: Scaffold( |
| 96 | appBar: AppBar( |
Alexandre Ardhuin | 387f885 | 2019-03-01 08:17:55 +0100 | [diff] [blame] | 97 | title: const Text('Media Query Example'), |
Ian Hickson | 1b9476c | 2016-04-20 09:33:28 -0700 | [diff] [blame] | 98 | ), |
Alexandre Ardhuin | 387f885 | 2019-03-01 08:17:55 +0100 | [diff] [blame] | 99 | body: Material(child: AdaptiveContainer(names: _kNames)), |
| 100 | ), |
Adam Barth | 948ae15 | 2016-02-13 00:52:56 -0800 | [diff] [blame] | 101 | )); |
| 102 | } |