测试地址:(网页加载比较慢的)
网页演示
1. 创建项目
flutter create example005_fatherson
2. AS打开
3. 添加依赖
修改pubspec.yaml
dependencies:
flutter:
sdk: flutter
# The following adds the Cupertino Icons font to your application.
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^1.0.2
english_words: ^3.1.5
4. 修改mart.dart
import 'package:flutter/material.dart';
import 'package:english_words/english_words.dart';
void main() {
runApp(MyApp());
}
// 重点是 sonKey 变量
GlobalKey<_RandomWordState> sonKey = GlobalKey();
class MyApp extends StatelessWidget {
final wordPair = WordPair.random();
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Hello world!',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home:Center(
// child: Text("Hello world!"),
// child:Text(wordPair.asPascalCase),
child:Container(
alignment: Alignment.center,
padding: EdgeInsets.all(10.0),
child: GestureDetector(
child: RandWords(key:sonKey),
onTap: (){
sonKey.currentState.change();
}
)
),
)
);
}
}
class RandWords extends StatefulWidget
{
RandWords({Key key}) : super(key: key);
@override
_RandomWordState createState() {
return _RandomWordState();
}
}
class _RandomWordState extends State<StatefulWidget>
{
String _wordPair = WordPair.random().asPascalCase;
void change()
{
setState(() {
_wordPair = WordPair.random().asPascalCase;
});
}
@override
Widget build(BuildContext context)
{
// final wordPair = WordPair.random();
return Text(_wordPair);
}
}
5. 调试运行
AS中先打开Android或者iOS模拟器,点运行按钮。
或在命令行中运行:
flutter run
6. 打包web
flutter build web