import'package:flutter/material.dart';import'package:english_words/english_words.dart';voidmain()=>runApp(newMyApp());classMyAppextendsStatelessWidget{
@override
Widget build(BuildContext context){
final wordPair =newWordPair.random();returnnewMaterialApp(
title:'Welcome to Flutter',
home:newScaffold(
appBar:newAppBar(
title:newText('Welcome to Flutter'),),
body:newCenter(//child: new Text('Hello World'),
child:newText(wordPair.asPascalCase),),),);}}
3.添加一個 有狀態的部件(Stateful widget)
classRandomWordsextendsStatefulWidget{
@override
createState()=>newRandomWordsState();}classRandomWordsStateextendsState<RandomWords>{}classRandomWordsStateextendsState<RandomWords>{
@override
Widget build(BuildContext context){
final wordPair =newWordPair.random();returnnewText(wordPair.asPascalCase);}}classMyAppextendsStatelessWidget{
@override
Widget build(BuildContext context){
final wordPair =newWordPair.random();// 刪除此行returnnewMaterialApp(
title:'Welcome to Flutter',
home:newScaffold(
appBar:newAppBar(
title:newText('Welcome to Flutter'),),
body:newCenter(//child: new Text(wordPair.asPascalCase),
child:newRandomWords(),),),);}}
4. 創建一個無限滾動ListView
import'package:flutter/material.dart';import'package:english_words/english_words.dart';voidmain()=>runApp(MyApp());classMyAppextendsStatelessWidget{// This widget is the root of your application.
@override
Widget build(BuildContext context){// final wordPair = new WordPair.random();returnMaterialApp(
title:'Welcome to Flutter',
home:newRandomWords(),);}}classRandomWordsStateextendsState<RandomWords>{
final _suggestions =<WordPair>[];
final _biggerFont =constTextStyle(fontSize:18.0);
@override
Widget build(BuildContext context){// final wordPair = new WordPair.random();// return new Text(wordPair.asPascalCase);returnnewScaffold(
appBar:newAppBar(
title:newText('Startup Name Generator'),),
body:_buildSuggestions(),);}
Widget _buildSuggestions(){returnnewListView.builder(
padding:const EdgeInsets.all(16.0),
itemBuilder:(context, i){if(i.isOdd)returnnewDivider();
final index = i ~/2;if(index >= _suggestions.length){
_suggestions.addAll(generateWordPairs().take(10));}return_buildRow(_suggestions[index]);},);}
Widget _buildRow(WordPair pair){returnnewListTile(title:newText(
pair.asPascalCase,
style: _biggerFont,),);}}classRandomWordsextendsStatefulWidget{
@override
createState()=>newRandomWordsState();}
5.添加交互
import'package:flutter/material.dart';import'package:english_words/english_words.dart';voidmain()=>runApp(MyApp());classMyAppextendsStatelessWidget{// This widget is the root of your application.
@override
Widget build(BuildContext context){// final wordPair = new WordPair.random();returnMaterialApp(
title:'Welcome to Flutter',
home:newRandomWords(),);}}classRandomWordsStateextendsState<RandomWords>{
final _suggestions =<WordPair>[];
final _saved =newSet<WordPair>();
final _biggerFont =constTextStyle(fontSize:18.0);
@override
Widget build(BuildContext context){// final wordPair = new WordPair.random();// return new Text(wordPair.asPascalCase);returnnewScaffold(
appBar:newAppBar(
title:newText('Startup Name Generator'),),
body:_buildSuggestions(),);}
Widget _buildSuggestions(){returnnewListView.builder(
padding:const EdgeInsets.all(16.0),
itemBuilder:(context, i){if(i.isOdd)returnnewDivider();
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);returnnewListTile(
title:newText(
pair.asPascalCase,
style: _biggerFont,),
trailing:newIcon(
alreadySaved ? Icons.favorite : Icons.favorite_border,
color: alreadySaved ? Colors.red :null,),
onTap:(){setState((){if(alreadySaved){
_saved.remove(pair);}else{
_saved.add(pair);}});});}}classRandomWordsextendsStatefulWidget{
@override
createState()=>newRandomWordsState();}
6.導航到新頁面
import'package:flutter/material.dart';import'package:english_words/english_words.dart';voidmain()=>runApp(MyApp());classMyAppextendsStatelessWidget{// This widget is the root of your application.
@override
Widget build(BuildContext context){// final wordPair = new WordPair.random();returnMaterialApp(
title:'Welcome to Flutter',
home:newRandomWords(),);}}classRandomWordsStateextendsState<RandomWords>{
final _suggestions =<WordPair>[];
final _saved =newSet<WordPair>();
final _biggerFont =constTextStyle(fontSize:18.0);
@override
Widget build(BuildContext context){// final wordPair = new WordPair.random();// return new Text(wordPair.asPascalCase);returnnewScaffold(
appBar:newAppBar(
title:newText('Startup Name Generator'),
actions:<Widget>[newIconButton(icon:newIcon(Icons.list), onPressed: _pushSaved),],),
body:_buildSuggestions(),);}void_pushSaved(){
Navigator.of(context).push(newMaterialPageRoute(
builder:(context){
final tiles = _saved.map((pair){returnnewListTile(title:newText(
pair.asPascalCase,
style: _biggerFont,),);},);
final divided = ListTile.divideTiles(
context: context,
tiles: tiles,).toList();returnnewScaffold(
appBar:newAppBar(
title:newText('Saved Suggestions'),),
body:newListView(children: divided),);},),);}
Widget _buildSuggestions(){returnnewListView.builder(
padding:const EdgeInsets.all(16.0),
itemBuilder:(context, i){if(i.isOdd)returnnewDivider();
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);returnnewListTile(
title:newText(
pair.asPascalCase,
style: _biggerFont,),
trailing:newIcon(
alreadySaved ? Icons.favorite : Icons.favorite_border,
color: alreadySaved ? Colors.red :null,),
onTap:(){setState((){if(alreadySaved){
_saved.remove(pair);}else{
_saved.add(pair);}});});}}classRandomWordsextendsStatefulWidget{
@override
createState()=>newRandomWordsState();}