Question

我只是在颤抖。我正在尝试一个简单的教程，该教程将显示两个骰子的面孔。当我单击浮动动作按钮时，它将使两个骰子上的数字随机化。我进一步将FAB分离到另一个文件中。当我尝试将onPressed事件从主文件传递到自定义FAB文件时，我的问题开始了。

在我的rollDice方法中，我无法调用setState，它抱怨无法从静态方法访问实例成员。不太确定如何从这里继续前进。

Main.dart

HAL_Init();

CustomFloatBtn类

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.
    );
    }
    }

Answer 1

我不确定您为什么不使用这样的简单实现。从各处删除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,
    ),
    ...
}

Answer 2

使所有内容均为非静态。您所有的变量和函数都只是类级别的，并且您将不会在类之外访问它们。

因此，从Main.dart文件中的所有位置删除静态文件，然后简单地执行CopsOnRoad在其答案中所做的事情。

这是修改后的代码

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> {
int leftDiceNumber = 1;
int rightDiceNumber = 1;

void rollDice() {
Random num = Random();

setState(() {
  leftDiceNumber = num.nextInt(6) + 1;
  rightDiceNumber = num.nextInt(6) + 1;
});
}

String param = 'Roll';

@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(
                               butname: param,
                               onPressed: rollDice,
                        );
    );
    }
    }

将FloatingActionButton分离到另一个文件

2 个答案: