Improve dark theme

2024-12-26 04:48:51 +00:00 · 2019-11-01 14:17:46 +01:00 · 2019-11-01 14:17:46 +01:00 · 481d718338
commit 481d718338
parent 6a34df6814
8 changed files with 83 additions and 53 deletions
--- a/lib/helpers/preferences_helper.dart
+++ b/lib/helpers/preferences_helper.dart
@ -71,3 +71,10 @@ class PreferencesHelper {
    return v == null ? alternative : v;
  }
 }
+
+PreferencesHelper preferences() {
+  if (PreferencesHelper._instance == null)
+    throw Exception("Try to get preference before their initialization!");
+
+  return PreferencesHelper._instance;
+}
--- a/lib/main.dart
+++ b/lib/main.dart
@ -32,7 +32,7 @@ class ComunicApplication extends StatelessWidget {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: ComunicApplicationHome(),
-      theme: darkMode ? ThemeData.dark() : null,
+      theme: darkMode ? ThemeData.dark() : ThemeData.light(),
    );
  }
 }
--- a/lib/ui/tiles/comment_tile.dart
+++ b/lib/ui/tiles/comment_tile.dart
@ -4,6 +4,7 @@ import 'package:comunic/ui/widgets/account_image_widget.dart';
 import 'package:comunic/ui/widgets/network_image_widget.dart';
 import 'package:comunic/utils/date_utils.dart';
 import 'package:comunic/utils/intl_utils.dart';
+import 'package:comunic/utils/ui_utils.dart';
 import 'package:flutter/material.dart';

 /// Single comment tile
@ -90,7 +91,7 @@ class CommentTile extends StatelessWidget {
          child: comment.hasContent
              ? Text(
                  comment.content,
-                  style: TextStyle(color: Colors.black),
+                  style: TextStyle(color: darkTheme() ? darkAccentColor : Colors.black),
                )
              : null,
        ),
--- a/lib/ui/tiles/conversation_message_tile.dart
+++ b/lib/ui/tiles/conversation_message_tile.dart
@ -5,6 +5,7 @@ import 'package:comunic/ui/widgets/network_image_widget.dart';
 import 'package:comunic/ui/widgets/text_rich_content_widget.dart';
 import 'package:comunic/utils/date_utils.dart';
 import 'package:comunic/utils/intl_utils.dart';
+import 'package:comunic/utils/ui_utils.dart';
 import 'package:flutter/material.dart';

 /// Conversation message tile
@ -50,20 +51,20 @@ class ConversationMessageTile extends StatelessWidget {
          width: 35.0,
        ),
        itemBuilder: (c) => [
-              // Update message content
-              PopupMenuItem(
-                enabled: message.isOwner,
-                value: _MenuChoices.REQUEST_UPDATE_CONTENT,
-                child: Text(tr("Update")),
-              ),
+          // Update message content
+          PopupMenuItem(
+            enabled: message.isOwner,
+            value: _MenuChoices.REQUEST_UPDATE_CONTENT,
+            child: Text(tr("Update")),
+          ),

-              // Delete the message
-              PopupMenuItem(
-                enabled: message.isOwner,
-                value: _MenuChoices.DELETE,
-                child: Text(tr("Delete")),
-              ),
-            ],
+          // Delete the message
+          PopupMenuItem(
+            enabled: message.isOwner,
+            value: _MenuChoices.DELETE,
+            child: Text(tr("Delete")),
+          ),
+        ],
        onSelected: _menuOptionSelected,
      ),
    );
@ -201,12 +202,17 @@ class ConversationMessageTile extends StatelessWidget {
                              child: TextRichContentWidget(
                                message.message,
                                textAlign: TextAlign.justify,
-                                style: TextStyle(color: Colors.black),
+                                style: TextStyle(
+                                    color: darkTheme()
+                                        ? Colors.white
+                                        : Colors.black),
                              ),
                              padding:
                                  EdgeInsets.fromLTRB(15.0, 10.0, 15.0, 10.0),
                              decoration: BoxDecoration(
-                                color: Colors.black12,
+                                color: darkTheme()
+                                    ? Colors.white12
+                                    : Colors.black12,
                                borderRadius: BorderRadius.circular(8.0),
                              ),
                            ),
--- a/lib/ui/tiles/conversation_tile.dart
+++ b/lib/ui/tiles/conversation_tile.dart
@ -3,6 +3,7 @@ import 'package:comunic/lists/users_list.dart';
 import 'package:comunic/models/conversation.dart';
 import 'package:comunic/utils/date_utils.dart';
 import 'package:comunic/utils/intl_utils.dart';
+import 'package:comunic/utils/ui_utils.dart';
 import 'package:flutter/material.dart';

 /// Single conversation tile
@ -67,7 +68,9 @@ class ConversationTile extends StatelessWidget {
      // Leading icon
      leading: Icon(
        conversation.sawLastMessage ? Icons.check_circle : Icons.lens,
-        color: conversation.sawLastMessage ? null : Colors.blue,
+        color: conversation.sawLastMessage
+            ? (darkTheme() ? darkAccentColor : null)
+            : Colors.blue,
      ),

      // Conversation information
@ -94,15 +97,15 @@ class ConversationTile extends StatelessWidget {
      // Trailing information
      trailing: PopupMenuButton<_PopupMenuChoices>(
        itemBuilder: (b) => <PopupMenuEntry<_PopupMenuChoices>>[
-              PopupMenuItem(
-                child: Text(tr("Update")),
-                value: _PopupMenuChoices.UPDATE,
-              ),
-              PopupMenuItem(
-                child: Text(tr("Delete")),
-                value: _PopupMenuChoices.DELETE,
-              )
-            ],
+          PopupMenuItem(
+            child: Text(tr("Update")),
+            value: _PopupMenuChoices.UPDATE,
+          ),
+          PopupMenuItem(
+            child: Text(tr("Delete")),
+            value: _PopupMenuChoices.DELETE,
+          )
+        ],
        onSelected: _conversationMenuCallback,
      ),
    );
--- a/lib/ui/tiles/post_tile.dart
+++ b/lib/ui/tiles/post_tile.dart
@ -141,20 +141,20 @@ class _PostTileState extends State<PostTile> {

        PopupMenuButton<_PostActions>(
          itemBuilder: (c) => [
-                // Update post content
-                PopupMenuItem(
-                  child: Text(tr("Update content")),
-                  value: _PostActions.UPDATE_CONTENT,
-                  enabled: widget.post.canUpdate,
-                ),
+            // Update post content
+            PopupMenuItem(
+              child: Text(tr("Update content")),
+              value: _PostActions.UPDATE_CONTENT,
+              enabled: widget.post.canUpdate,
+            ),

-                // Delete post
-                PopupMenuItem(
-                  child: Text(tr("Delete")),
-                  value: _PostActions.DELETE,
-                  enabled: widget.post.canDelete,
-                ),
-              ],
+            // Delete post
+            PopupMenuItem(
+              child: Text(tr("Delete")),
+              value: _PostActions.DELETE,
+              enabled: widget.post.canDelete,
+            ),
+          ],
          onSelected: _selectedPostMenuAction,
        )
      ],
@ -333,19 +333,19 @@ class _PostTileState extends State<PostTile> {
    final comments = List<Widget>.generate(
      widget.post.comments.length,
      (num) => CommentTile(
-            comment: widget.post.comments[num],
-            user: widget.usersInfo.getUser(widget.post.comments[num].userID),
-            onUpdateLike: _updateCommentLike,
-            onUpdateComment: _updateCommentContent,
-            onDeleteComment: _deleteComment,
-          ),
+        comment: widget.post.comments[num],
+        user: widget.usersInfo.getUser(widget.post.comments[num].userID),
+        onUpdateLike: _updateCommentLike,
+        onUpdateComment: _updateCommentContent,
+        onDeleteComment: _deleteComment,
+      ),
    );

    // Add comments form
    comments.add(_buildCommentsForm());

    return Container(
-      color: Colors.grey[300],
+      color: darkTheme() ? Colors.black38 : Colors.grey[300],
      child: Padding(
        padding: const EdgeInsets.only(top: 8.0, bottom: 8.0),
        child: Column(
@ -375,10 +375,15 @@ class _PostTileState extends State<PostTile> {
              controller: _commentController,
              onChanged: (s) => setState(() {}),
              onSubmitted: _canSubmitComment ? (s) => _submitComment() : null,
+
+              style: TextStyle(
+                color: darkTheme() ? Colors.white : null,
+              ),
+
              decoration: InputDecoration(
                hintText: tr("New comment..."),
                hintStyle: TextStyle(color: Colors.grey, fontSize: 12),
-                fillColor: Colors.white,
+                fillColor: darkTheme() ? Colors.black38 : Colors.white,
                filled: true,
                border: OutlineInputBorder(
                    borderSide: BorderSide(width: 0.5, color: Colors.grey),
--- a/lib/ui/widgets/navbar_widget.dart
+++ b/lib/ui/widgets/navbar_widget.dart
@ -1,4 +1,5 @@
 import 'package:comunic/utils/intl_utils.dart';
+import 'package:comunic/utils/ui_utils.dart';
 import 'package:flutter/material.dart';

 /// Navigation bar widget
@ -18,8 +19,8 @@ enum BarCallbackActions {
  ACTION_LOGOUT
 }

-const _PrimaryColor = Colors.blue;
-const _SecondaryColor = Colors.white;
+Color _primaryColor() => darkTheme() ? Colors.black : Colors.blue;
+Color _secondaryColor() => darkTheme() ? darkAccentColor : Colors.white;

 /// Menu item information
 class _MenuItem {
@ -93,7 +94,7 @@ class ComunicAppBar extends StatelessWidget implements PreferredSizeWidget {
  @override
  Widget build(BuildContext context) {
    return Material(
-      color: Colors.blue,
+      color: darkTheme() ? Colors.black : Colors.blue,
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: List.generate(
@ -134,7 +135,7 @@ class _MenuItemWidget extends StatelessWidget {

    return Expanded(
      child: Material(
-        color: isSelected ? _SecondaryColor : _PrimaryColor,
+        color: isSelected ? _secondaryColor() : _primaryColor(),
        child: !item.isMenu
            ? InkWell(
                child: _buildIconContainer(),
@ -151,7 +152,7 @@ class _MenuItemWidget extends StatelessWidget {
      children: <Widget>[
        IconTheme(
          data: IconThemeData(
-              color: isSelected ? _PrimaryColor : _SecondaryColor),
+              color: isSelected ? _primaryColor() : _secondaryColor()),
          child: item.icon,
        )
      ],
--- a/lib/utils/ui_utils.dart
+++ b/lib/utils/ui_utils.dart
@ -1,4 +1,5 @@
 import 'package:cached_network_image/cached_network_image.dart';
+import 'package:comunic/helpers/preferences_helper.dart';
 import 'package:comunic/utils/intl_utils.dart';
 import 'package:flutter/material.dart';
 import 'package:html/parser.dart';
@ -179,3 +180,9 @@ String htmlDecodeCharacters(String input) {

  return parse(input).documentElement.text;
 }
+
+
+const darkAccentColor = Colors.white70;
+
+/// Check out whether dark theme is enabled or not
+bool darkTheme() => preferences().getBool(PreferencesKeyList.ENABLE_DARK_THEME);