page_view.dart 4.2 KB
Newer Older
1 2 3 4
// 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.

5
import 'package:flutter/material.dart';
6 7 8 9 10 11

class CardModel {
  CardModel(this.value, this.size, this.color);
  int value;
  Size size;
  Color color;
12
  String get label => 'Card $value';
Hixie's avatar
Hixie committed
13
  Key get key => new ObjectKey(this);
14 15
}

16
class PageViewApp extends StatefulWidget {
17
  @override
18
  PageViewAppState createState() => new PageViewAppState();
19
}
20

21
class PageViewAppState extends State<PageViewApp> {
22
  @override
23 24
  void initState() {
    super.initState();
25 26 27 28 29 30 31
    const List<Size> cardSizes = const <Size>[
      const Size(100.0, 300.0),
      const Size(300.0, 100.0),
      const Size(200.0, 400.0),
      const Size(400.0, 400.0),
      const Size(300.0, 400.0),
    ];
32

Hixie's avatar
Hixie committed
33
    cardModels = new List<CardModel>.generate(cardSizes.length, (int i) {
34
      Color color = Color.lerp(Colors.red[300], Colors.blue[900], i / cardSizes.length);
35 36 37 38
      return new CardModel(i, cardSizes[i], color);
    });
  }

39
  static const TextStyle cardLabelStyle =
40
    const TextStyle(color: Colors.white, fontSize: 18.0, fontWeight: FontWeight.bold);
41 42 43

  List<CardModel> cardModels;
  Size pageSize = new Size(200.0, 200.0);
44
  Axis scrollDirection = Axis.horizontal;
45 46
  bool itemsWrap = false;

47
  Widget buildCard(CardModel cardModel) {
48 49 50 51 52
    Widget card = new Card(
      color: cardModel.color,
      child: new Container(
        width: cardModel.size.width,
        height: cardModel.size.height,
53
        padding: const EdgeInsets.all(8.0),
54 55
        child: new Center(child: new Text(cardModel.label, style: cardLabelStyle)),
      ),
56
    );
57

58
    BoxConstraints constraints = (scrollDirection == Axis.vertical)
59 60 61
      ? new BoxConstraints.tightFor(height: pageSize.height)
      : new BoxConstraints.tightFor(width: pageSize.width);

62 63
    return new Container(
      key: cardModel.key,
64
      constraints: constraints,
65
      child: new Center(child: card),
66 67 68
    );
  }

69
  void switchScrollDirection() {
70
    setState(() {
71 72 73
      scrollDirection = (scrollDirection == Axis.vertical)
        ? Axis.horizontal
        : Axis.vertical;
74
    });
75 76 77 78 79 80
  }

  void toggleItemsWrap() {
    setState(() {
      itemsWrap = !itemsWrap;
    });
81 82
  }

83 84
  Widget _buildDrawer() {
    return new Drawer(
85
      child: new ListView(
86 87 88 89 90 91
        children: <Widget>[
          new DrawerHeader(child: new Center(child: new Text('Options'))),
          new DrawerItem(
            icon: new Icon(Icons.more_horiz),
            selected: scrollDirection == Axis.horizontal,
            child: new Text('Horizontal Layout'),
92
            onPressed: switchScrollDirection,
93 94 95 96 97
          ),
          new DrawerItem(
            icon: new Icon(Icons.more_vert),
            selected: scrollDirection == Axis.vertical,
            child: new Text('Vertical Layout'),
98
            onPressed: switchScrollDirection,
99 100 101 102 103 104 105
          ),
          new DrawerItem(
            onPressed: toggleItemsWrap,
            child: new Row(
              children: <Widget>[
                new Expanded(child: new Text('Scrolling wraps around')),
                // TODO(abarth): Actually make this checkbox change this value.
106 107 108 109 110 111
                new Checkbox(value: itemsWrap, onChanged: null),
              ],
            ),
          ),
        ],
      ),
112 113 114
    );
  }

115 116
  Widget _buildAppBar() {
    return new AppBar(
117
      title: new Text('PageView'),
118
      actions: <Widget>[
119 120
        new Text(scrollDirection == Axis.horizontal ? "horizontal" : "vertical"),
      ],
121 122 123
    );
  }

124
  Widget _buildBody(BuildContext context) {
Adam Barth's avatar
Adam Barth committed
125 126 127
    return new PageView(
      children: cardModels.map(buildCard).toList(),
      // TODO(abarth): itemsWrap: itemsWrap,
128
      scrollDirection: scrollDirection,
129 130
    );
  }
131

132
  @override
133
  Widget build(BuildContext context) {
134
    return new IconTheme(
Adam Barth's avatar
Adam Barth committed
135
      data: const IconThemeData(color: Colors.white),
136
      child: new Scaffold(
137
        appBar: _buildAppBar(),
138
        drawer: _buildDrawer(),
139 140
        body: _buildBody(context),
      ),
141 142 143 144 145
    );
  }
}

void main() {
Adam Barth's avatar
Adam Barth committed
146
  runApp(new MaterialApp(
147
    title: 'PageView',
148
    theme: new ThemeData(
149
      brightness: Brightness.light,
150
      primarySwatch: Colors.blue,
Adam Barth's avatar
Adam Barth committed
151
      accentColor: Colors.redAccent[200],
152
    ),
153
    home: new PageViewApp(),
154
  ));
155
}