From eeeb83ba99a5ffeec4622931fcc57df60787e1a3 Mon Sep 17 00:00:00 2001 From: Abhinav Date: Sat, 11 Sep 2021 20:31:48 +0530 Subject: [PATCH 1/3] added darktheme --- lib/global.dart | 1 + lib/main.dart | 28 +++++++++ lib/pages/home_page.dart | 108 ++++++++++++++++++++++++++++++---- lib/widgets/radio_button.dart | 6 +- pubspec.lock | 8 +-- 5 files changed, 134 insertions(+), 17 deletions(-) create mode 100644 lib/global.dart diff --git a/lib/global.dart b/lib/global.dart new file mode 100644 index 0000000..fdf2c8a --- /dev/null +++ b/lib/global.dart @@ -0,0 +1 @@ +bool isDark = true; diff --git a/lib/main.dart b/lib/main.dart index 530df2e..d774ad2 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; +import 'global.dart'; import 'pages/home_page.dart'; void main() { @@ -7,12 +8,39 @@ void main() { } class AllSqlApp extends StatelessWidget { + MaterialColor buildMaterialColor(Color color) { + final List strengths = [.05]; + final Map swatch = {}; + final int r = color.red; + final int g = color.green; + final int b = color.blue; + + for (int i = 1; i < 10; i++) { + strengths.add(0.1 * i); + } + for (final strength in strengths) { + final double ds = 0.5 - strength; + swatch[(strength * 1000).round()] = Color.fromRGBO( + r + ((ds < 0 ? r : (255 - r)) * ds).round(), + g + ((ds < 0 ? g : (255 - g)) * ds).round(), + b + ((ds < 0 ? b : (255 - b)) * ds).round(), + 1, + ); + } + return MaterialColor(color.value, swatch); + } + @override Widget build(BuildContext context) { return MaterialApp( title: 'AllSQL', theme: ThemeData( primarySwatch: Colors.teal, + textTheme: TextTheme( + headline6: TextStyle( + color: isDark ? Colors.white : Colors.black, + ), + ), ), home: const HomePage(), ); diff --git a/lib/pages/home_page.dart b/lib/pages/home_page.dart index 91b9422..59c668a 100644 --- a/lib/pages/home_page.dart +++ b/lib/pages/home_page.dart @@ -1,3 +1,4 @@ +import 'package:allsql/global.dart'; import 'package:flutter/material.dart'; import 'package:sqflite_common/sqlite_api.dart' as sqflite; import 'package:sqflite_web/sqflite_web.dart'; @@ -46,9 +47,39 @@ class _HomePageState extends State { @override Widget build(BuildContext context) { return Scaffold( + backgroundColor: isDark ? const Color(0xFF463838) : Colors.white, appBar: AppBar( centerTitle: true, title: const Text('AllSQL'), + actions: [ + Padding( + padding: const EdgeInsets.all(8.0), + child: SizedBox( + width: 250, + child: ListTile( + title: const Text( + 'Dark Theme', + style: TextStyle( + fontSize: 17.0, + color: Colors.white, + fontWeight: FontWeight.normal), + ), + leading: Icon( + Icons.brightness_6, + color: isDark ? Colors.white : Colors.black, + ), + trailing: Switch( + activeColor: Colors.white, + value: isDark, + onChanged: (value) { + setState(() { + isDark = !isDark; + }); + }), + ), + ), + ), + ], ), body: ListView( padding: const EdgeInsets.all(50.0), @@ -57,10 +88,17 @@ class _HomePageState extends State { controller: _commandController, minLines: 4, maxLines: 10, - decoration: const InputDecoration( + style: TextStyle( + fontSize: 18.0, color: isDark ? Colors.white : Colors.black), + decoration: InputDecoration( hintText: 'Enter your SQL command', + hintStyle: TextStyle( + fontSize: 18.0, color: isDark ? Colors.white : Colors.black), border: OutlineInputBorder( - borderRadius: BorderRadius.all( + borderSide: BorderSide( + color: isDark ? const Color(0xff0665B1) : Colors.teal, + ), + borderRadius: const BorderRadius.all( Radius.circular(15.0), ), ), @@ -151,7 +189,13 @@ class _HomePageState extends State { case 'Execute': await db.execute(_commandController.text); setState(() { - _output = const Text('Executed the command'); + _output = Text( + 'Query Excecuted', + style: TextStyle( + fontSize: 18.0, + color: isDark ? Colors.white : Colors.black, + ), + ); }); break; @@ -159,7 +203,13 @@ class _HomePageState extends State { final int lastRow = await db.rawInsert(_commandController.text); setState(() { - _output = Text('ID of last row inserted is $lastRow.'); + _output = Text( + 'ID of last row inserted is $lastRow.', + style: TextStyle( + fontSize: 18.0, + color: isDark ? Colors.white : Colors.black, + ), + ); }); break; @@ -168,19 +218,40 @@ class _HomePageState extends State { await db.rawQuery(_commandController.text); if (queryOutput.isEmpty) { - _output = const Text('No output!'); + _output = Text( + 'No output!', + style: TextStyle( + fontSize: 18.0, + color: isDark ? Colors.white : Colors.black, + ), + ); } else { _output = DataTable( columns: queryOutput.first.keys .map((e) => DataColumn( - label: Text(e), + label: Text( + e, + style: TextStyle( + fontSize: 18.0, + color: isDark + ? Colors.white + : Colors.black, + ), + ), )) .toList(), rows: queryOutput .map((e) => DataRow( cells: queryOutput.first.keys - .map((a) => DataCell( - Text(e[a]?.toString() ?? 'null'))) + .map((a) => DataCell(Text( + e[a]?.toString() ?? 'null', + style: TextStyle( + fontSize: 18.0, + color: isDark + ? Colors.white + : Colors.black, + ), + ))) .toList())) .toList(), ); @@ -194,7 +265,12 @@ class _HomePageState extends State { final int rowsUpdated = await db.rawUpdate(_commandController.text); setState(() { - _output = Text('$rowsUpdated rows deleted!'); + _output = Text( + '$rowsUpdated rows updated!', + style: TextStyle( + color: isDark ? Colors.white : Colors.black, + ), + ); }); break; @@ -202,7 +278,12 @@ class _HomePageState extends State { final int rowsDeleted = await db.rawDelete(_commandController.text); setState(() { - _output = Text('$rowsDeleted rows deleted!'); + _output = Text( + '$rowsDeleted rows deleted!', + style: TextStyle( + color: isDark ? Colors.white : Colors.black, + ), + ); }); break; @@ -236,7 +317,7 @@ class _HomePageState extends State { color: Colors.grey.shade300, borderRadius: BorderRadius.circular(15.0), ), - child: Text( + child: SelectableText( _descriptions[_commandType] ?? 'Error!', style: TextStyle( color: Colors.grey.shade600, @@ -246,7 +327,10 @@ class _HomePageState extends State { const SizedBox(height: 20.0), Text( 'OUTPUT', - style: Theme.of(context).textTheme.headline6, + style: TextStyle( + fontSize: 20.0, + color: isDark ? Colors.white : Colors.black, + ), ), const SizedBox(height: 20.0), _output, diff --git a/lib/widgets/radio_button.dart b/lib/widgets/radio_button.dart index f58c672..15ac2bc 100644 --- a/lib/widgets/radio_button.dart +++ b/lib/widgets/radio_button.dart @@ -1,5 +1,7 @@ import 'package:flutter/material.dart'; +import '../global.dart'; + class RadioButton extends StatelessWidget { final String value; final String groupValue; @@ -27,7 +29,9 @@ class RadioButton extends StatelessWidget { onChanged!(value); } }, - child: Text(value), + child: Text(value, + style: TextStyle( + fontSize: 16, color: isDark ? Colors.white : Colors.black)), ), ], ); diff --git a/pubspec.lock b/pubspec.lock index 814ecd6..4d2dfa1 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -7,7 +7,7 @@ packages: name: async url: "https://pub.dartlang.org" source: hosted - version: "2.6.1" + version: "2.8.1" boolean_selector: dependency: transitive description: @@ -28,7 +28,7 @@ packages: name: charcode url: "https://pub.dartlang.org" source: hosted - version: "1.2.0" + version: "1.3.1" clock: dependency: transitive description: @@ -92,7 +92,7 @@ packages: name: meta url: "https://pub.dartlang.org" source: hosted - version: "1.3.0" + version: "1.7.0" path: dependency: transitive description: @@ -176,7 +176,7 @@ packages: name: test_api url: "https://pub.dartlang.org" source: hosted - version: "0.3.0" + version: "0.4.2" typed_data: dependency: transitive description: From 67cb319fe016585d4a7320ec07910623bda9bf29 Mon Sep 17 00:00:00 2001 From: Abhinav Date: Tue, 14 Sep 2021 16:36:42 +0530 Subject: [PATCH 2/3] darktheme using themedata --- lib/global.dart | 3 ++ lib/main.dart | 32 +++-------------- lib/pages/home_page.dart | 66 +++++++++++++++++++---------------- lib/widgets/radio_button.dart | 10 ++++-- 4 files changed, 51 insertions(+), 60 deletions(-) diff --git a/lib/global.dart b/lib/global.dart index fdf2c8a..7c397ad 100644 --- a/lib/global.dart +++ b/lib/global.dart @@ -1 +1,4 @@ +import 'package:flutter/material.dart'; + bool isDark = true; +ThemeMode themeVariable = ThemeMode.dark; diff --git a/lib/main.dart b/lib/main.dart index d774ad2..01e7f65 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -8,39 +8,17 @@ void main() { } class AllSqlApp extends StatelessWidget { - MaterialColor buildMaterialColor(Color color) { - final List strengths = [.05]; - final Map swatch = {}; - final int r = color.red; - final int g = color.green; - final int b = color.blue; - - for (int i = 1; i < 10; i++) { - strengths.add(0.1 * i); - } - for (final strength in strengths) { - final double ds = 0.5 - strength; - swatch[(strength * 1000).round()] = Color.fromRGBO( - r + ((ds < 0 ? r : (255 - r)) * ds).round(), - g + ((ds < 0 ? g : (255 - g)) * ds).round(), - b + ((ds < 0 ? b : (255 - b)) * ds).round(), - 1, - ); - } - return MaterialColor(color.value, swatch); - } - @override Widget build(BuildContext context) { return MaterialApp( title: 'AllSQL', + darkTheme: ThemeData( + primarySwatch: Colors.teal, + brightness: Brightness.dark, + ), + themeMode: themeVariable, theme: ThemeData( primarySwatch: Colors.teal, - textTheme: TextTheme( - headline6: TextStyle( - color: isDark ? Colors.white : Colors.black, - ), - ), ), home: const HomePage(), ); diff --git a/lib/pages/home_page.dart b/lib/pages/home_page.dart index 59c668a..cd56e21 100644 --- a/lib/pages/home_page.dart +++ b/lib/pages/home_page.dart @@ -1,8 +1,8 @@ -import 'package:allsql/global.dart'; import 'package:flutter/material.dart'; import 'package:sqflite_common/sqlite_api.dart' as sqflite; import 'package:sqflite_web/sqflite_web.dart'; +import '../global.dart'; import '../widgets/radio_button.dart'; class HomePage extends StatefulWidget { @@ -47,7 +47,7 @@ class _HomePageState extends State { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: isDark ? const Color(0xFF463838) : Colors.white, + // backgroundColor: appBar: AppBar( centerTitle: true, title: const Text('AllSQL'), @@ -64,16 +64,18 @@ class _HomePageState extends State { color: Colors.white, fontWeight: FontWeight.normal), ), - leading: Icon( + leading: const Icon( Icons.brightness_6, - color: isDark ? Colors.white : Colors.black, + // color: ), trailing: Switch( - activeColor: Colors.white, - value: isDark, + // activeColor: Colors.white, + value: themeVariable == ThemeMode.dark, onChanged: (value) { setState(() { - isDark = !isDark; + themeVariable = themeVariable == ThemeMode.dark + ? ThemeMode.light + : ThemeMode.dark; }); }), ), @@ -89,15 +91,19 @@ class _HomePageState extends State { minLines: 4, maxLines: 10, style: TextStyle( - fontSize: 18.0, color: isDark ? Colors.white : Colors.black), + fontSize: 18.0, + // color: + ), decoration: InputDecoration( hintText: 'Enter your SQL command', hintStyle: TextStyle( - fontSize: 18.0, color: isDark ? Colors.white : Colors.black), + fontSize: 18.0, + // color: + ), border: OutlineInputBorder( borderSide: BorderSide( - color: isDark ? const Color(0xff0665B1) : Colors.teal, - ), + // color: + ), borderRadius: const BorderRadius.all( Radius.circular(15.0), ), @@ -193,7 +199,7 @@ class _HomePageState extends State { 'Query Excecuted', style: TextStyle( fontSize: 18.0, - color: isDark ? Colors.white : Colors.black, + // color: ), ); }); @@ -207,7 +213,7 @@ class _HomePageState extends State { 'ID of last row inserted is $lastRow.', style: TextStyle( fontSize: 18.0, - color: isDark ? Colors.white : Colors.black, + // color: ), ); }); @@ -222,7 +228,7 @@ class _HomePageState extends State { 'No output!', style: TextStyle( fontSize: 18.0, - color: isDark ? Colors.white : Colors.black, + // color: ), ); } else { @@ -233,9 +239,9 @@ class _HomePageState extends State { e, style: TextStyle( fontSize: 18.0, - color: isDark - ? Colors.white - : Colors.black, + // color: + // ? Colors.white + // : Colors.black, ), ), )) @@ -247,9 +253,9 @@ class _HomePageState extends State { e[a]?.toString() ?? 'null', style: TextStyle( fontSize: 18.0, - color: isDark - ? Colors.white - : Colors.black, + // color: + // ? Colors.white + // : Colors.black, ), ))) .toList())) @@ -267,9 +273,9 @@ class _HomePageState extends State { setState(() { _output = Text( '$rowsUpdated rows updated!', - style: TextStyle( - color: isDark ? Colors.white : Colors.black, - ), + // style: TextStyle( + // color: + // ), ); }); break; @@ -280,9 +286,9 @@ class _HomePageState extends State { setState(() { _output = Text( '$rowsDeleted rows deleted!', - style: TextStyle( - color: isDark ? Colors.white : Colors.black, - ), + // style: TextStyle( + // color: + // ), ); }); break; @@ -327,10 +333,10 @@ class _HomePageState extends State { const SizedBox(height: 20.0), Text( 'OUTPUT', - style: TextStyle( - fontSize: 20.0, - color: isDark ? Colors.white : Colors.black, - ), + // style: TextStyle( + // fontSize: 20.0, + // color: + // ), ), const SizedBox(height: 20.0), _output, diff --git a/lib/widgets/radio_button.dart b/lib/widgets/radio_button.dart index 15ac2bc..898e1f1 100644 --- a/lib/widgets/radio_button.dart +++ b/lib/widgets/radio_button.dart @@ -29,9 +29,13 @@ class RadioButton extends StatelessWidget { onChanged!(value); } }, - child: Text(value, - style: TextStyle( - fontSize: 16, color: isDark ? Colors.white : Colors.black)), + child: Text( + value, + // style: TextStyle( + // fontSize: 16, + // color: isDark ? Colors.white : Colors.black, + // ), + ), ), ], ); From 4e9f32ab3fdac9d449c332228b12f3b3c1a04c91 Mon Sep 17 00:00:00 2001 From: Abhinav Date: Mon, 27 Sep 2021 16:06:57 +0530 Subject: [PATCH 3/3] fixed it --- lib/config.dart | 5 +++++ lib/global.dart | 15 +++++++++++++-- lib/main.dart | 18 ++++++++++++++++-- lib/pages/home_page.dart | 39 ++++++++++----------------------------- 4 files changed, 44 insertions(+), 33 deletions(-) create mode 100644 lib/config.dart diff --git a/lib/config.dart b/lib/config.dart new file mode 100644 index 0000000..0eeeacc --- /dev/null +++ b/lib/config.dart @@ -0,0 +1,5 @@ +library config.globals; + +import 'package:allsql/global.dart'; + +MyTheme currentTheme = MyTheme(); diff --git a/lib/global.dart b/lib/global.dart index 7c397ad..9a848ae 100644 --- a/lib/global.dart +++ b/lib/global.dart @@ -1,4 +1,15 @@ +import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; -bool isDark = true; -ThemeMode themeVariable = ThemeMode.dark; +class MyTheme with ChangeNotifier { + static bool _isDark = true; + + ThemeMode currentTheme() { + return _isDark ? ThemeMode.dark : ThemeMode.light; + } + + void switchTheme() { + _isDark = !_isDark; + notifyListeners(); + } +} diff --git a/lib/main.dart b/lib/main.dart index 01e7f65..078854d 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -1,3 +1,4 @@ +import 'package:allsql/config.dart'; import 'package:flutter/material.dart'; import 'global.dart'; @@ -7,7 +8,20 @@ void main() { runApp(AllSqlApp()); } -class AllSqlApp extends StatelessWidget { +class AllSqlApp extends StatefulWidget { + @override + State createState() => _AllSqlAppState(); +} + +class _AllSqlAppState extends State { + @override + void initState() { + super.initState(); + currentTheme.addListener(() { + setState(() {}); + }); + } + @override Widget build(BuildContext context) { return MaterialApp( @@ -16,7 +30,7 @@ class AllSqlApp extends StatelessWidget { primarySwatch: Colors.teal, brightness: Brightness.dark, ), - themeMode: themeVariable, + themeMode: currentTheme.currentTheme(), theme: ThemeData( primarySwatch: Colors.teal, ), diff --git a/lib/pages/home_page.dart b/lib/pages/home_page.dart index cd56e21..a333d01 100644 --- a/lib/pages/home_page.dart +++ b/lib/pages/home_page.dart @@ -1,3 +1,4 @@ +import 'package:allsql/config.dart'; import 'package:flutter/material.dart'; import 'package:sqflite_common/sqlite_api.dart' as sqflite; import 'package:sqflite_web/sqflite_web.dart'; @@ -56,28 +57,11 @@ class _HomePageState extends State { padding: const EdgeInsets.all(8.0), child: SizedBox( width: 250, - child: ListTile( - title: const Text( - 'Dark Theme', - style: TextStyle( - fontSize: 17.0, - color: Colors.white, - fontWeight: FontWeight.normal), - ), - leading: const Icon( - Icons.brightness_6, - // color: - ), - trailing: Switch( - // activeColor: Colors.white, - value: themeVariable == ThemeMode.dark, - onChanged: (value) { - setState(() { - themeVariable = themeVariable == ThemeMode.dark - ? ThemeMode.light - : ThemeMode.dark; - }); - }), + child: IconButton( + icon: const Icon(Icons.light_mode_outlined), + onPressed: () { + currentTheme.switchTheme(); + }, ), ), ), @@ -90,21 +74,18 @@ class _HomePageState extends State { controller: _commandController, minLines: 4, maxLines: 10, - style: TextStyle( + style: const TextStyle( fontSize: 18.0, // color: ), - decoration: InputDecoration( + decoration: const InputDecoration( hintText: 'Enter your SQL command', hintStyle: TextStyle( fontSize: 18.0, // color: ), border: OutlineInputBorder( - borderSide: BorderSide( - // color: - ), - borderRadius: const BorderRadius.all( + borderRadius: BorderRadius.all( Radius.circular(15.0), ), ), @@ -195,7 +176,7 @@ class _HomePageState extends State { case 'Execute': await db.execute(_commandController.text); setState(() { - _output = Text( + _output = const Text( 'Query Excecuted', style: TextStyle( fontSize: 18.0,