flutter - 从深色主题切换到浅色主题的按钮

Question

此代码负责从浅色主题切换到深色主题。最后一行代码负责从深色主题切换到浅色主题的选项:白色按钮和滑动黄色。

请告诉我如何在浅色背景下实现此按钮为黑色并伴有黄色伴奏的幻灯片。

如果你告诉我如何使这个按钮的宽度与上面两个相同，我将不胜感激。

class ChangeThemeButtonWidget extends StatelessWidget {
  const ChangeThemeButtonWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final themeProvider = Provider.of<ThemeProvider>(context);

    return Switch.adaptive(
      value: themeProvider.isDarkMode,
      onChanged: (value) async {
        SharedPreferences prefs = await SharedPreferences.getInstance();
        await prefs.setBool('isDarkMode', value);
        final provider = Provider.of<ThemeProvider>(context, listen: false);
        provider.toggleTheme(value);
      },
      activeColor: themeProvider.isDarkMode ? Colors.white : Colors.yellow,
    );
  }
}

Answer 1

我认为问题在于您希望左侧位置和右侧位置都处于事件状态。

但是开关的工作方式是，左侧位置是 inactive 位置，右侧位置是 active 位置。

您需要将 inactiveThumbColor 设置为黑色以用于浅色模式。

  activeColor: themeProvider.isDarkMode ? Colors.white : Colors.yellow,
  inactiveThumbColor: themeProvider.isDarkMode ? Colors.yellow : Colors.black,