From 01f39f0ca8812f73f91fffa8196c8da014678e93 Mon Sep 17 00:00:00 2001
From: Linloir <3145078758@qq.com>
Date: Thu, 20 Oct 2022 14:12:57 +0800
Subject: [PATCH] Improvements - InkWell effect on avatar and image messages

---
 lib/chat/view/common/image_box.dart | 24 ++++++++++++++++++------
 lib/chat/view/in_message_box.dart   | 17 ++++++++++-------
 lib/common/avatar/avatar.dart       | 21 +++++++++++++--------
 pubspec.lock                        |  7 +++++++
 pubspec.yaml                        |  1 +
 5 files changed, 49 insertions(+), 21 deletions(-)

diff --git a/lib/chat/view/common/image_box.dart b/lib/chat/view/common/image_box.dart
index 40c09e7..7ff9618 100644
--- a/lib/chat/view/common/image_box.dart
+++ b/lib/chat/view/common/image_box.dart
@@ -1,7 +1,7 @@
 /*
  * @Author       : Linloir
  * @Date         : 2022-10-14 17:04:20
- * @LastEditTime : 2022-10-20 11:05:37
+ * @LastEditTime : 2022-10-20 13:47:29
  * @Description  : 
  */
 
@@ -20,11 +20,23 @@ class ImageBox extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return InkWell(
-      onTap: (){},
-      child: Container(
-        constraints: const BoxConstraints(maxWidth: 500, maxHeight: 250),
-        child: history.preCachedImage ?? Image.memory(base64Decode(history.message.contentDecoded)),
+    return IntrinsicWidth(
+      child: IntrinsicHeight(
+        child: Stack(
+          children: [
+            Container(
+              constraints: const BoxConstraints(maxWidth: 500, maxHeight: 200),
+              child: history.preCachedImage ?? Image.memory(base64Decode(history.message.contentDecoded)),
+            ),
+            Material(
+                color: Colors.transparent,
+                child: InkWell(
+                  splashColor: Colors.white.withOpacity(0.1),
+                  onTap: (){},
+                )
+              ),
+          ]
+        ),
       ),
     );
   }
diff --git a/lib/chat/view/in_message_box.dart b/lib/chat/view/in_message_box.dart
index 5917503..334b936 100644
--- a/lib/chat/view/in_message_box.dart
+++ b/lib/chat/view/in_message_box.dart
@@ -1,7 +1,7 @@
 /*
  * @Author       : Linloir
  * @Date         : 2022-10-14 13:49:47
- * @LastEditTime : 2022-10-19 23:45:16
+ * @LastEditTime : 2022-10-20 13:56:20
  * @Description  : 
  */
 
@@ -75,13 +75,16 @@ class InMessageBox extends StatelessWidget {
           )
         ),
         if(history.message.type == MessageType.image)
-          Text(
-            _getTimeStamp(history.message.timeStamp),
-            style: TextStyle(
-              fontSize: 12,
-              color: Colors.grey[400],
+          ...[
+            const SizedBox(height: 4.0,),
+            Text(
+              _getTimeStamp(history.message.timeStamp),
+              style: TextStyle(
+                fontSize: 12,
+                color: Colors.grey[600],
+              ),
             ),
-          )
+          ]
       ]
     );
   }
diff --git a/lib/common/avatar/avatar.dart b/lib/common/avatar/avatar.dart
index d1ccbf6..d77762c 100644
--- a/lib/common/avatar/avatar.dart
+++ b/lib/common/avatar/avatar.dart
@@ -1,7 +1,7 @@
 /*
  * @Author       : Linloir
  * @Date         : 2022-10-13 21:49:53
- * @LastEditTime : 2022-10-20 11:52:12
+ * @LastEditTime : 2022-10-20 13:46:16
  * @Description  : 
  */
 
@@ -75,18 +75,23 @@ class UserAvatar extends StatelessWidget {
             ),
             child: ClipRRect(
               borderRadius: BorderRadius.circular(5.0),
-              child: Material(
-                color: Colors.transparent,
-                child: InkWell(
-                  onTap: onTap,
-                  child: OverflowBox(
+              child: Stack(
+                fit: StackFit.passthrough,
+                children: [
+                  OverflowBox(
                     alignment: Alignment.center,
                     child: FittedBox(
                       fit: BoxFit.cover,
                       child: Image.memory(base64.decode(state.userInfo.avatarEncoded!)),
                     ),
-                  )
-                ),
+                  ),
+                  Material(
+                    color: Colors.transparent,
+                    child: InkWell(
+                      onTap: onTap,
+                    ),
+                  ),
+                ],
               ),
             ),
           );
diff --git a/pubspec.lock b/pubspec.lock
index 271dbe9..29f91e3 100644
--- a/pubspec.lock
+++ b/pubspec.lock
@@ -78,6 +78,13 @@ packages:
       url: "https://pub.flutter-io.cn"
     source: hosted
     version: "2.0.2+1"
+  easy_image_viewer:
+    dependency: "direct main"
+    description:
+      name: easy_image_viewer
+      url: "https://pub.flutter-io.cn"
+    source: hosted
+    version: "1.1.0"
   equatable:
     dependency: "direct main"
     description:
diff --git a/pubspec.yaml b/pubspec.yaml
index c849e4d..bc659cb 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -57,6 +57,7 @@ dependencies:
   easy_debounce: ^2.0.2+1
   path: ^1.8.2
   window_manager: ^0.2.7
+  easy_image_viewer: ^1.1.0
 
   # The following adds the Cupertino Icons font to your application.
   # Use with the CupertinoIcons class for iOS style icons.