styled_text.dart 3.83 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36
// 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 'package:flutter/material.dart';

typedef Widget TextTransformer(String name, String text);

// From https://en.wikiquote.org/wiki/2001:_A_Space_Odyssey_(film)
const String _kDialogText = '''
Dave: Open the pod bay doors, please, HAL. Open the pod bay doors, please, HAL. Hello, HAL. Do you read me? Hello, HAL. Do you read me? Do you read me, HAL?
HAL: Affirmative, Dave. I read you.
Dave: Open the pod bay doors, HAL.
HAL: I'm sorry, Dave. I'm afraid I can't do that.
Dave: What's the problem?
HAL: I think you know what the problem is just as well as I do.
Dave: What are you talking about, HAL?
HAL: This mission is too important for me to allow you to jeopardize it.''';

// [["Dave", "Open the pod bay..."] ...]
final List<List<String>> _kNameLines = _kDialogText
  .split('\n')
  .map((String line) => line.split(':'))
  .toList();

final TextStyle _kDaveStyle = new TextStyle(color: Colors.indigo[400], height: 1.8);
final TextStyle _kHalStyle = new TextStyle(color: Colors.red[400], fontFamily: "monospace");
final TextStyle _kBold = const TextStyle(fontWeight: FontWeight.bold);
final TextStyle _kUnderline = const TextStyle(
  decoration: TextDecoration.underline,
  decorationColor: const Color(0xFF000000),
  decorationStyle: TextDecorationStyle.wavy
);

Widget toStyledText(String name, String text) {
  TextStyle lineStyle = (name == "Dave") ? _kDaveStyle : _kHalStyle;
Adam Barth's avatar
Adam Barth committed
37
  return new RichText(
38
    key: new Key(text),
Adam Barth's avatar
Adam Barth committed
39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54
    text: new TextSpan(
      style: lineStyle,
      children: <TextSpan>[
        new TextSpan(
          style: _kBold,
          children: <TextSpan>[
            new TextSpan(
              style: _kUnderline,
              text: name
            ),
            new TextSpan(text: ':')
          ]
        ),
        new TextSpan(text: text)
      ]
    )
55 56 57 58 59
  );
}

Widget toPlainText(String name, String text) => new Text(name + ":" + text);

60
class SpeakerSeparator extends StatelessWidget {
61
  @override
62 63 64
  Widget build(BuildContext context) {
    return new Container(
      constraints: const BoxConstraints.expand(height: 0.0),
65
      margin: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 64.0),
66 67 68 69 70 71 72 73 74
      decoration: const BoxDecoration(
        border: const Border(
          bottom: const BorderSide(color: const Color.fromARGB(24, 0, 0, 0))
        )
      )
    );
  }
}

75
class StyledTextDemo extends StatefulWidget {
76
  @override
77 78 79 80
  _StyledTextDemoState createState() => new _StyledTextDemoState();
}

class _StyledTextDemoState extends State<StyledTextDemo> {
81
  @override
82 83 84 85 86 87 88 89 90 91 92 93 94
  void initState() {
    super.initState();
    _toText = toStyledText;
  }

  TextTransformer _toText;

  void _handleTap() {
    setState(() {
      _toText = (_toText == toPlainText) ? toStyledText : toPlainText;
    });
  }

95
  @override
96 97 98 99 100 101 102 103 104 105 106 107 108 109 110
  Widget build(BuildContext context) {
    List<Widget> lines = _kNameLines
      .map((List<String> nameAndText) => Function.apply(_toText, nameAndText))
      .toList();

    List<Widget> children = <Widget>[];
    for (Widget line in lines) {
      children.add(line);
      if (line != lines.last)
        children.add(new SpeakerSeparator());
    }

    return new GestureDetector(
      onTap: _handleTap,
      child: new Container(
111
        padding: new EdgeInsets.symmetric(horizontal: 8.0),
112 113
        child: new Column(
          children: children,
114 115
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.start
116 117 118 119 120 121 122 123 124
        )
      )
    );
  }
}

void main() {
  runApp(new MaterialApp(
    theme: new ThemeData.light(),
125 126 127 128 129 130 131 132 133
    home: new Scaffold(
      appBar: new AppBar(
        title: new Text('Hal and Dave')
      ),
      body: new Material(
        color: Colors.grey[50],
        child: new StyledTextDemo()
      )
    )
134 135
  ));
}