我刚刚开始学习 flutter。我正在尝试一个简单的教程,它将显示两个骰子的面。当我点击 float 操作按钮时,它会随机化两个骰子上的数字。我更进一步将 FAB 分离到另一个文件中。当我尝试将 onPressed 事件从主文件传递到我的自定义 FAB 文件时,我的问题就开始了。
在我的 rollDice 方法中,我无法调用 setState,它提示无法从静态方法访问实例成员。不太确定如何从这里继续前进。
主要的飞镖
import 'package:flutter/material.dart';
import 'custom_floatBtn.dart';
import 'dart:math';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
final swatch = const {
50: const Color(0xff661f00),
100: const Color(0xff992e00),
200: const Color(0xffcc3d00),
300: const Color(0xffe64500),
400: const Color(0xffff4d00),
500: const Color(0xffff5e1a),
600: const Color(0xffff824d),
700: const Color(0xffffa680),
800: const Color(0xffffc9b3),
900: const Color(0xffffede6)
};
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: MaterialColor(0xffFF5722, swatch),
//primarySwatch: Colors.green,
),
home: MyHomePage(title: 'Dice Betting'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
static int leftDiceNumber = 1;
static int rightDiceNumber = 1;
static void rollDice() {
Random num = Random();
setState(() {
leftDiceNumber = num.nextInt(6) + 1;
rightDiceNumber = num.nextInt(6) + 1;
});
}
static String param = 'Roll';
static final customFloatBtn = new CustomFloatBtn(
butname: param,
onPressed: rollDice,
);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
backgroundColor: Colors.black38,
body: Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Image.asset('dice$leftDiceNumber.png'),
)),
Expanded(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Image.asset('dice$rightDiceNumber.png'),
)),
],
),
),
floatingActionButton: customFloatBtn
// This trailing comma makes auto-formatting nicer for build
methods.
);
}
}
CustomFloatBtn 类
import 'package:flutter/material.dart';
class CustomFloatBtn extends StatelessWidget {
final String butname;
final GestureTapCallback onPressed;
CustomFloatBtn({this.butname, this.onPressed});
@override
Widget build(BuildContext context) {
return FloatingActionButton(
tooltip: 'Increment',
//child: Icon(Icons.add),
child: Text(butname),
onPressed: onPressed,
);
}
}
最佳答案
我不确定您为什么不使用这样的简单实现。从所有地方删除 static
。
floatingActionButton: CustomFloatBtn(
butname: param,
onPressed: rollDice,
),
更新:
void rollDice() { // remove static from here
Random num = Random();
setState(() {
leftDiceNumber = num.nextInt(6) + 1;
rightDiceNumber = num.nextInt(6) + 1;
});
}
String param = 'Roll'; // remove static from here
@override
Widget build(BuildContext context) {
return Scaffold(
floatingActionButton: CustomFloatBtn( // use CustomFloatBtn here
butname: param,
onPressed: rollDice,
),
...
}
关于flutter - 将 FloatingActionButton 分离到另一个文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56616652/