Search code examples
flutterflutter-theme

Why am I getting an error in the build function when changing the theme of the application?


My main file down below;

import 'package:flutter/material.dart';
import 'package:ajanda/screens/mainmenu.dart';
Future<void> main() async{
  runApp(MaterialApp(
      debugShowCheckedModeBanner: false, title: "Takvim", home: MainMenu()));
}

Mainmenu file down below;

import 'package:ajanda/blocs/theme.dart';
import 'package:provider/provider.dart';

//const String testDevice = 'Mobile_id';

class MainMenu extends StatelessWidget {
  MainMenu({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider<ThemeChanger>(
      builder: (_) => ThemeChanger(ThemeData.dark()),
      child: new MaterialAppWithTheme(),
    );
  }
}

class MaterialAppWithTheme extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MainMenuBody(),
    );
  }
}

class MainMenuBody extends StatefulWidget {
  @override
  _MainMenuBodyState createState() => _MainMenuBodyState();
}

class _MainMenuBodyState extends State<MainMenuBody> {

....

}

I'm trying to make a dark theme, but I got 2 errors and I can't solve the reason why I would be glad if you could help. I'm getting an error like this in my build function. The argument type 'Widget Function (BuildContext)' can't be assigned to the parameter type 'Widget Function (BuildContext, Widget)'. The other issue like this error: The return type 'ThemeChanger' isn't a 'Widget', as required by the closure's context.

Theme.dart file down below

import 'package:flutter/material.dart';

class ThemeChanger with ChangeNotifier{

  ThemeData _themeData;

  ThemeChanger(this._themeData);

  getTheme() => _themeData;

  setTheme(ThemeData theme){
    _themeData= theme;

    notifyListeners();
  }

}

Solution

  • you need to follow these steps

    import 'package:flutter/material.dart';
    
    final darkTheme = ThemeData(
     primarySwatch: Colors.grey,
     primaryColor: Colors.black,
     brightness: Brightness.dark,
     backgroundColor: const Color(0xFF212121),
     accentColor: Colors.white,
     accentIconTheme: IconThemeData(color: Colors.black),
     dividerColor: Colors.black12,
    );
        
     
    final lightTheme = ThemeData(
     primarySwatch: Colors.grey,
    primaryColor: Colors.white,
    brightness: Brightness.light,
    backgroundColor: const Color(0xFFE5E5E5),
    accentColor: Colors.black,
    accentIconTheme: IconThemeData(color: Colors.white),
    dividerColor: Colors.white54,
     );
    

    Provider class

    import 'package:flutter/material.dart';
    
    class ThemeNotifier with ChangeNotifier {
      ThemeData _themeData;
    
      ThemeNotifier(this._themeData);
    
      getTheme() => _themeData;
    
      setTheme(ThemeData themeData) async {
        _themeData = themeData;
        notifyListeners();
      }
    }
    
    void main() => runApp(
      ChangeNotifierProvider<ThemeNotifier>(
        builder: (_) => ThemeNotifier(darkTheme),
        child: MyApp(),
      ),
    );
    
    class MyApp extends StatelessWidget {
     @override
     Widget build(BuildContext context) {
     final themeNotifier = Provider.of<ThemeNotifier>(context);
     return MaterialApp(
       title: 'Chitr',
      theme: themeNotifier.getTheme(),
      home: HomePage(),
    );
     }
     }