时间戳

首页 > 解决方案 > 在 LIGHT 和 DARK 主题之间切换 (flutter_neumorphic: ^2.0.0)

flutter - 在 LIGHT 和 DARK 主题之间切换 (flutter_neumorphic: ^2.0.0)

问题描述

我使用 flutter_neumorphic: ^2.0.0 包给我的应用程序一个很酷的外观，我喜欢添加一个切换来在 LIGHT 和 DARK 之间切换。不幸的是，我是编码新手，我不能自己做这个切换按钮，请你帮帮我。

谢谢

import 'package:babysoundtrips/screens/sound_screen.dart';
import 'package:flutter/material.dart';
import 'package:flutter_neumorphic/flutter_neumorphic.dart';

void main() => runApp(BabySoundTrips());

class BabySoundTrips extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: NeumorphicTheme(
        usedTheme: UsedTheme.LIGHT,
        theme: NeumorphicThemeData(
          baseColor: Color(0xFFFFFFFF),
          lightSource: LightSource.topLeft,
          depth: 10,
        ),
        darkTheme: NeumorphicThemeData(
          baseColor: Color(0xFF3E3E3E),
          lightSource: LightSource.topLeft,
          depth: 6,
        ),
        child: SoundScreen(),
      ),
      initialRoute: SoundScreen.id,
      routes: {
        SoundScreen.id: (context) => SoundScreen(),
      },
    );
  }
}

标签： flutterthemes

解决方案

这是切换按钮的示例

FlatButton(
  child: Row(
    children: <Widget>[
      Expanded(child: Text("Change theme")),
      Switch(
          value: true,
          onChanged: null),
    ],
  ),
  onPressed: () {
    // handle change value here
  },
);

此片段代码需要嵌入到有状态小部件中，并将您要更改的值传递给 Switch 值，并通过我的评论“//在此处处理更改值”更新此值。

推荐阅读