代码实现了一个字串生成器,可以产生随机字符串,并且可以选择将喜欢的字符串加入到收藏列表中:
上代码:
import ‘package:flutter/material.dart‘; import ‘package:english_words/english_words.dart‘; void main() => runApp(new MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { // final wordPair = new WordPair.random(); return new MaterialApp( title: ‘Startup Name Generator‘, theme: new ThemeData( primaryColor: Colors.white, ), home: new RandomWords(), ); } } class RandomWords extends StatefulWidget { @override State<StatefulWidget> createState() { // TODO: implement createState return new RandomWordsState(); } } class RandomWordsState extends State<RandomWords> { final _suggestions = <WordPair>[]; final _biggerFont = const TextStyle(fontSize: 18); final _saved = new Set<WordPair>(); @override Widget build(BuildContext context) { //final wordPair = new WordPair.random(); //return new Text(wordPair.asPascalCase); return new Scaffold( appBar: new AppBar( title: new Text(‘Startup Name Generator‘), actions: <Widget>[ new IconButton(icon: new Icon(Icons.list), onPressed: _pushSaved), ], ), body: _buildSuggestions(), ); } void _pushSaved(){ Navigator.of(context).push( new MaterialPageRoute(builder: (context){ final tiles = _saved.map((pair){ return new ListTile( title: new Text( pair.asPascalCase, style: _biggerFont, ), ); } ); final divided = ListTile.divideTiles( context: context, tiles: tiles, ).toList(); return new Scaffold( appBar: new AppBar( title: new Text(‘Saved Suggestions‘), ), body: new ListView(children: divided), ); }) ); } Widget _buildSuggestions(){ return new ListView.builder( padding: const EdgeInsets.all(16.0), itemBuilder: (context, i) { if (i.isOdd) return new Divider(); final index = i ~/2; if (index >= _suggestions.length) { _suggestions.addAll(generateWordPairs().take(10)); } return _buildRow(_suggestions[index]); }, ); } Widget _buildRow(WordPair pair) { final alreadySaved = _saved.contains(pair); return new ListTile( title: new Text( pair.asPascalCase, style: _biggerFont, ), trailing: new Icon( alreadySaved ? Icons.favorite : Icons.favorite_border, color: alreadySaved ? Colors.green : null, ), onTap: (){ setState(() { if (alreadySaved) { _saved.remove(pair); } else { _saved.add(pair); } }); }, ); } }
运行效果:
可以生产随机字符串列表:
下滑可以生成更多的随机字符串:
可以选择喜欢的字符串:
可以选择收藏列表,查看收藏的名称:
【Flutter】跟着flutter教程学着写了一个简单的Demo
原文:https://www.cnblogs.com/wuyizuokan/p/11273219.html