ensure_visible.dart.old 3.01 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 12

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

Adam Barth's avatar
Adam Barth committed
16
class EnsureVisibleApp extends MaterialApp {
17 18

  static const TextStyle cardLabelStyle =
19
    const TextStyle(color: Colors.white, fontSize: 18.0, fontWeight: bold);
20

21
  static const TextStyle selectedCardLabelStyle =
22
    const TextStyle(color: Colors.white, fontSize: 24.0, fontWeight: bold);
23

24
  List<CardModel> cardModels;
25
  MixedViewportLayoutState layoutState = new MixedViewportLayoutState();
26
  CardModel selectedCardModel;
27 28 29 30 31 32 33 34

  void initState() {
    List<double> cardHeights = <double>[
      48.0, 63.0, 82.0, 146.0, 60.0, 55.0, 84.0, 96.0, 50.0,
      48.0, 63.0, 82.0, 146.0, 60.0, 55.0, 84.0, 96.0, 50.0,
      48.0, 63.0, 82.0, 146.0, 60.0, 55.0, 84.0, 96.0, 50.0
    ];
    cardModels = new List.generate(cardHeights.length, (i) {
35
      Color color = Color.lerp(Colors.red[300], Colors.blue[900], i / cardHeights.length);
36 37 38 39 40 41
      return new CardModel(i, cardHeights[i], color);
    });

    super.initState();
  }

42
  void handleTap(Widget card, CardModel cardModel) {
43 44 45 46
    ensureWidgetIsVisible(card, duration: const Duration(milliseconds: 200))
    .then((_) {
      setState(() { selectedCardModel = cardModel; });
    });
47 48 49 50 51 52
  }

  Widget builder(int index) {
    if (index >= cardModels.length)
      return null;
    CardModel cardModel = cardModels[index];
53
    TextStyle style = (cardModel == selectedCardModel) ? selectedCardLabelStyle : cardLabelStyle;
54 55 56 57 58
    Widget card = new Card(
      color: cardModel.color,
      child: new Container(
        height: cardModel.height,
        padding: const EdgeDims.all(8.0),
59
        child: new Center(child: new Text(cardModel.label, style: style))
60 61
      )
    );
62
    return new GestureDetector(
63
      key: cardModel.key,
64
      onTap: () => handleTap(card, cardModel),
65 66 67 68 69 70 71 72
      child: card
    );
  }

  Widget build() {
    Widget cardCollection = new Container(
      padding: const EdgeDims.symmetric(vertical: 12.0, horizontal: 8.0),
      decoration: new BoxDecoration(backgroundColor: Theme.of(this).primarySwatch[50]),
73
      child: new ScrollableMixedWidgetList(
74 75 76 77 78 79 80 81 82 83 84
        builder: builder,
        token: cardModels.length,
        layoutState: layoutState
      )
    );

    return new IconTheme(
      data: const IconThemeData(color: IconThemeColor.white),
      child: new Theme(
        data: new ThemeData(
          brightness: ThemeBrightness.light,
85 86
          primarySwatch: Colors.blue,
          accentColor: Colors.redAccent[200]
87
        ),
88 89
        child: new Title(
          title: 'Cards',
90
          child: new Scaffold(
Adam Barth's avatar
Adam Barth committed
91
            toolBar: new ToolBar(center: new Text('Tap a Card')),
92 93 94 95 96 97 98 99 100 101 102
            body: cardCollection
          )
        )
      )
    );
  }
}

void main() {
  runApp(new EnsureVisibleApp());
}