使用 flutter 在黑暗模式下切换图像

Mas*_*aya 3 dart flutter darkmode

我想知道如何实现暗模式和亮模式切换图像。我不希望在应用程序上切换。只需在 iOS 或 Android 中的设置中切换暗模式即可。

这是灯光模式的示例代码。我想知道如何更改或添加代码以将 logo.png 切换为 darkmode_logo.png。

*darkmode_logo.png 用于深色模式下的徽标。

电压/电流,

import 'package:flutter/material.dart';

class TopPage extends StatefulWidget {
  const TopPage({Key key}) : super(key: key);

  @override
  _TopPageState createState() => _TopPageState();
}

class _TopPageState extends State<TopPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Theme.of(context).backgroundColor,
      drawer: SlideMenu(),
      appBar: AppBar(
        centerTitle: true,
        title: Image.asset(
          'assets/images/header_icn/logo.png',
          fit: BoxFit.cover,
        ),
      ),
      body: Container(),
    );
  }
}
Run Code Online (Sandbox Code Playgroud)

Nir*_*ode 10

Brightness使用主题的属性检查主题模式。

final isDarkMode = Theme.of(context).brightness == Brightness.dark;
Run Code Online (Sandbox Code Playgroud)

然后使用 更改图像isDarkMode

Image.asset(
  isDarkMode
      ? 'assets/images/header_icn/darkmode_logo.png'
      : 'assets/images/header_icn/logo.png',
  fit: BoxFit.cover,
)
Run Code Online (Sandbox Code Playgroud)

  • 模拟器主题没有按应有的方式更改为深色。在真实设备中尝试。 (2认同)