Flutter按钮新主题copyWith不会改变颜色

Question

我在下面有一小段代码。它应该以蓝色显示“添加图标”。相反，它显示黑色按钮（在 MaterialApp 中作为强调颜色）。 我在“floatingActionButton”中做错了吗？

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    final appName = "Custom Themes";

    return new MaterialApp(
      title: appName,
      theme: new ThemeData(
        brightness: Brightness.dark,
        primaryColor: Colors.red[300],
        accentColor: Colors.black,
      ),
      home: new MyHomePage(
        title: appName
      ),
    );
  }
}

class MyHomePage extends StatelessWidget {
  final String title;

  MyHomePage({Key key, @required this.title}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return new Scaffold(
      appBar: AppBar(
        title: new Text(title),
      ),
      body: new Center(
        child: new Container(
          color: Theme.of(context).primaryColor,
          child: new Text(
            "Text with background color",
            style: Theme.of(context).textTheme.title,
          ),
        ),
      ),
    floatingActionButton: new Theme(
      data: Theme.of(context).copyWith(accentColor: Colors.blue),
      child: new FloatingActionButton(
        onPressed: null,
        child: new Icon(Icons.add),
      ),
    )
    );
  }

}

我看了一个教程（它在 iOS 中很流畅），那里的一切都像魅力一样。 Tut 是从 2019 年 4 月开始的。也许从那时起发生了一些变化？

Answer 1

你可以使用

Theme.of(context).copyWith(
        colorScheme:
        Theme.of(context).colorScheme.copyWith(secondary: Colors.blue),
      )

详细参考https://flutter.dev/docs/cookbook/design/themes#complete-example

完整代码

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    final appName = "Custom Themes";

    return  MaterialApp(
      title: appName,
      theme:  ThemeData(
        brightness: Brightness.dark,
        primaryColor: Colors.red[300],
        accentColor: Colors.black,
      ),
      home:  MyHomePage(
          title: appName
      ),
    );
  }
}

class MyHomePage extends StatelessWidget {
  final String title;

  MyHomePage({Key key, @required this.title}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return  Scaffold(
        appBar: AppBar(
          title:  Text(title),
        ),
        body:  Center(
          child:  Container(
            color: Theme.of(context).primaryColor,
            child:  Text(
              "Text with background color",
              style: Theme.of(context).textTheme.title,
            ),
          ),
        ),
        floatingActionButton:  Theme(
          data: Theme.of(context).copyWith(
            colorScheme:
            Theme.of(context).colorScheme.copyWith(secondary: Colors.blue),
          ),
          child:  FloatingActionButton(
            onPressed: null,
            child:  Icon(Icons.add),
          ),
        )
    );
  }

}