From 17804075c8d29c2d424ff81d6da87af4d578590b Mon Sep 17 00:00:00 2001 From: denisnadey Date: Fri, 2 Oct 2020 15:41:59 +0300 Subject: [PATCH] themetoggle --- lib/main.dart | 51 +++++++++++++++++++++++++++----------------- lib/theme.dart | 13 +++++++++++ lib/theme_model.dart | 23 ++++++++++++++++++++ pubspec.lock | 22 +++++++++++++++++++ pubspec.yaml | 3 ++- 5 files changed, 92 insertions(+), 20 deletions(-) create mode 100644 lib/theme.dart create mode 100644 lib/theme_model.dart diff --git a/lib/main.dart b/lib/main.dart index 3438442..3e8ca5c 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -1,4 +1,7 @@ +import 'package:auto_size_text/auto_size_text.dart'; +import 'package:cloudtech_calculator/theme_model.dart'; import 'package:flutter/material.dart'; +import 'package:provider/provider.dart'; enum Operation { plus, @@ -57,21 +60,17 @@ extension NumbersExtension on num { } } -void main() { - runApp(MyApp()); -} +void main() => runApp(ChangeNotifierProvider( + create: (BuildContext context) => ThemeModel(), child: MyApp())); class MyApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( - title: 'Calculator', - theme: ThemeData( - primarySwatch: Colors.blue, - visualDensity: VisualDensity.adaptivePlatformDensity, - ), - home: const MyHomePage(title: 'Calculator'), + debugShowCheckedModeBanner: false, + theme: Provider.of(context).currentTheme, + home: const MyHomePage(title: 'Калькулятор'), ); } } @@ -249,10 +248,22 @@ class _MyHomePageState extends State { Widget build(BuildContext context) { return Scaffold( appBar: AppBar( - title: Text(widget.title), + title: Text(widget.title, + style: TextStyle(color: Theme.of(context).accentColor)), + shadowColor: const Color(0x00000000), + actions: [ + IconButton( + icon: const Icon(Icons.settings), + tooltip: 'Show Snackbar', + onPressed: () { + Provider.of(context, listen: false).toggleTheme(); + }, + color: Theme.of(context).accentColor, + ) + ], ), body: Container( - color: const Color(0xFF4b44cf), + color: Theme.of(context).primaryColor, child: Padding( padding: const EdgeInsets.all(8.0), child: Column( @@ -260,12 +271,13 @@ class _MyHomePageState extends State { children: [ Expanded( child: Align( - alignment: Alignment.centerRight, - child: Text( - textResh, - style: const TextStyle(fontSize: 80, color: Colors.white), - ), - ), + alignment: Alignment.centerRight, + child: AutoSizeText( + textResh, + style: TextStyle( + fontSize: 70, color: Theme.of(context).accentColor), + maxLines: 1, + )), ), Row( children: [ @@ -366,13 +378,14 @@ class CallButton extends StatelessWidget { width: 100, decoration: BoxDecoration( borderRadius: BorderRadius.circular(12), - color: const Color(0xE0E0E0E0)), + color: const Color(0x00000000)), child: FlatButton( height: 60, onPressed: () => onPressed(value), child: Text( text, - style: TextStyle(fontSize: 40, color: Colors.blue[900]), + style: + TextStyle(fontSize: 30, color: Theme.of(context).accentColor), ), ), ), diff --git a/lib/theme.dart b/lib/theme.dart new file mode 100644 index 0000000..8b834bc --- /dev/null +++ b/lib/theme.dart @@ -0,0 +1,13 @@ +import 'package:flutter/material.dart'; + +ThemeData darkTheme = ThemeData.dark().copyWith( + primaryColor: const Color(0xff131618), + accentColor: Colors.white, + textTheme: const TextTheme(bodyText2: TextStyle(color: Color(0xffffffff))), +); + +ThemeData lightTheme = ThemeData.light().copyWith( + primaryColor: Colors.white, + accentColor: Colors.green, + textTheme: const TextTheme(bodyText2: TextStyle(color: Colors.green)), +); diff --git a/lib/theme_model.dart b/lib/theme_model.dart new file mode 100644 index 0000000..296aede --- /dev/null +++ b/lib/theme_model.dart @@ -0,0 +1,23 @@ +import 'package:flutter/material.dart'; +import 'theme.dart'; + +enum ThemeType { lightTheme, darkTheme } + +class ThemeModel extends ChangeNotifier { + ThemeData currentTheme = darkTheme; + ThemeType _themeType = ThemeType.darkTheme; + + void toggleTheme() { + if (_themeType == ThemeType.darkTheme) { + currentTheme = lightTheme; + _themeType = ThemeType.lightTheme; + return notifyListeners(); + } + + if (_themeType == ThemeType.lightTheme) { + currentTheme = darkTheme; + _themeType = ThemeType.darkTheme; + return notifyListeners(); + } + } +} diff --git a/pubspec.lock b/pubspec.lock index 55fc951..7723eb8 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -8,6 +8,13 @@ packages: url: "https://pub.dartlang.org" source: hosted version: "2.5.0-nullsafety.1" + auto_size_text: + dependency: "direct main" + description: + name: auto_size_text + url: "https://pub.dartlang.org" + source: hosted + version: "2.1.0" boolean_selector: dependency: transitive description: @@ -88,6 +95,13 @@ packages: url: "https://pub.dartlang.org" source: hosted version: "1.3.0-nullsafety.3" + nested: + dependency: transitive + description: + name: nested + url: "https://pub.dartlang.org" + source: hosted + version: "0.0.4" path: dependency: transitive description: @@ -95,6 +109,13 @@ packages: url: "https://pub.dartlang.org" source: hosted version: "1.8.0-nullsafety.1" + provider: + dependency: "direct main" + description: + name: provider + url: "https://pub.dartlang.org" + source: hosted + version: "4.3.2+2" sky_engine: dependency: transitive description: flutter @@ -158,3 +179,4 @@ packages: version: "2.1.0-nullsafety.3" sdks: dart: ">=2.10.0-110 <2.11.0" + flutter: ">=1.16.0" diff --git a/pubspec.yaml b/pubspec.yaml index 3970678..8182ff9 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -27,7 +27,8 @@ dependencies: # The following adds the Cupertino Icons font to your application. # Use with the CupertinoIcons class for iOS style icons. cupertino_icons: ^1.0.0 - + provider: ^4.3.2+2 + auto_size_text: ^2.1.0 dev_dependencies: flutter_test: