Question

我尝试使用 onPrimary 和 onSurface 设置 ElevatedButton 的样式，但颜色不适用于我的应用，ElevatedButton 保留我主题的默认颜色此外，例如，当我更改 fontSize 时，它可以完美运行。

这是我的代码示例：

ButtonStyle styleToCome = ElevatedButton.styleFrom(
  onPrimary: Colors.black54,
  onSurface: Colors.white,
  textStyle: const TextStyle(fontSize: 30),
  padding: EdgeInsets.all(20.0),
);
ButtonStyle styleInProgress = ElevatedButton.styleFrom(
  textStyle: const TextStyle(fontSize: 30),
  padding: EdgeInsets.all(20.0),
  onPrimary: Colors.black54,
  onSurface: Colors.pink,
);

ButtonStyle stylePassed = ElevatedButton.styleFrom(
  textStyle: const TextStyle(fontSize: 30),
  padding: EdgeInsets.all(20.0),
  onPrimary: Colors.black54,
  onSurface: Colors.grey,
);

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "App d'amour",
      theme: ThemeData(
        backgroundColor: Colors.white,
        primarySwatch: Colors.indigo,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(title: "App"),
      debugShowCheckedModeBanner: false,
    );
  }
}

class _MyHomePageState extends State<MyHomePage> {

  Map<String, dynamic> resultat;

  Future<void> getResult() async {
    await Firebase.initializeApp();
    var result = await FirebaseFirestore.instance.collection("gift").get();
    result.docs.forEach((res) {
      setState(() {
        resultat = res.data();
      });
    });
  }

  @override
  void initState() {
    super.initState();
    getResult();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
        centerTitle: true,
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Row(mainAxisAlignment: MainAxisAlignment.center, children: [
              MyContent(resultat, "A", context),
              MyContent(resultat, "B", context),
              MyContent(resultat, "C", context),
              MyContent(resultat, "D", context),
            ]),
            Row(mainAxisAlignment: MainAxisAlignment.center, children: [
              MyContent(resultat, "E", context),
              MyContent(resultat, "F", context),
              MyContent(resultat, "G", context),
              MyContent(resultat, "H", context),
            ]),
            Row(mainAxisAlignment: MainAxisAlignment.center, children: [
              MyContent(resultat, "I", context),
              MyContent(resultat, "J", context),
              MyContent(resultat, "K", context),
              MyContent(resultat, "L", context),
            ]),
            Row(mainAxisAlignment: MainAxisAlignment.center, children: [
              MyContent(resultat, "M", context),
              MyContent(resultat, "N", context),
              MyContent(resultat, "O", context),
              MyContent(resultat, "P", context),
            ]),
            Row(mainAxisAlignment: MainAxisAlignment.center, children: [
              MyContent(resultat, "Q", context),
              MyContent(resultat, "R", context),
              MyContent(resultat, "S", context),
              MyContent(resultat, "T", context),
            ]),
            Row(mainAxisAlignment: MainAxisAlignment.center, children: [
              MyContent(resultat, "U", context),
              MyContent(resultat, "V", context),
              MyContent(resultat, "W", context),
              MyContent(resultat, "X", context),
            ]),
            Row(mainAxisAlignment: MainAxisAlignment.center, children: [
              MyContent(resultat, "Y", context),
              MyContent(resultat, "Z", context),
            ])
          ],
        ),
      ),
    );
  }
}

Widget MyContent(
    Map<String, dynamic> result, String letter, BuildContext context) {
  if (result[letter][0] == "&") {
    return Padding(
      padding: const EdgeInsets.all(4.0),
      child: ElevatedButton(
        style: styleToCome,
        onPressed: () {},
          );
        },
        child: Text(letter),
      ),
    );
  } else if (result[letter][0] == "<") {
    return Padding(
      padding: const EdgeInsets.all(4.0),
      child: ElevatedButton(
          style: stylePassed,
          child: Text(letter),
          onPressed: () {},
            );
          }),
    );
  } else {
    return Padding(
      padding: const EdgeInsets.all(4.0),
      child: ElevatedButton(
          style: styleInProgress,
          child: Text(letter),
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(builder: (context) => Gift(result[letter])),
            );
          }),
    );
  }
}

我不明白他为什么要这样做，我为网络开发了这个小应用程序。

Answer 1

使用 primary 而不是 onPrimary。

颜色不适用于 ElevatedButton.styleFrom()

1 个答案: