New Feature:

- Send Images!
2025-12-17 00:38:11 +08:00 · 2022-10-20 00:56:24 +08:00 · 2022-10-20 00:56:24 +08:00 · 72a898a8b0
commit 72a898a8b0
parent 542e78729e
7 changed files with 153 additions and 91 deletions
--- a/lib/chat/chat_page.dart
+++ b/lib/chat/chat_page.dart
@ -1,7 +1,7 @@
 /*
 * @Author       : Linloir
 * @Date         : 2022-10-13 14:03:16
- * @LastEditTime : 2022-10-15 10:54:53
+ * @LastEditTime : 2022-10-20 00:48:43
 * @Description  : 
 */

@ -87,6 +87,7 @@ class ChatPage extends StatelessWidget {
                        else {
                          //Return history tile
                          return Padding(
+                            key: ValueKey(state.chatHistory[index].message.contentmd5),
                            padding: const EdgeInsets.symmetric(
                              horizontal: 24,
                              vertical: 8
--- a/lib/chat/cubit/chat_cubit.dart
+++ b/lib/chat/cubit/chat_cubit.dart
@ -1,7 +1,7 @@
 /*
 * @Author       : Linloir
 * @Date         : 2022-10-13 14:03:56
- * @LastEditTime : 2022-10-19 18:00:37
+ * @LastEditTime : 2022-10-20 00:13:18
 * @Description  : 
 */

@ -106,6 +106,9 @@ class ChatCubit extends Cubit<ChatState> {
    );
    var newHistories = [];
    for(var message in fetchedMessages) {
+      if(state.chatHistory.any((element) => element.message.contentmd5 == message.contentmd5)) {
+        continue;
+      }
      var history = ChatHistory(
        message: message,
        type: message.senderID == userID ? ChatHistoryType.income : ChatHistoryType.outcome,
--- 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-14 17:34:12
+ * @LastEditTime : 2022-10-20 00:47:44
 * @Description  : 
 */

@ -22,7 +22,10 @@ class ImageBox extends StatelessWidget {
  Widget build(BuildContext context) {
    return InkWell(
      onTap: (){},
-      child: Image.memory(base64Decode(history.message.contentDecoded))
+      child: Container(
+        constraints: const BoxConstraints(maxWidth: 500, maxHeight: 250),
+        child: Image.memory(base64Decode(history.message.contentDecoded)),
+      ),
    );
  }
 }
--- 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-15 10:24:35
+ * @LastEditTime : 2022-10-19 23:45:16
 * @Description  : 
 */

@ -22,51 +22,67 @@ class InMessageBox extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
-    return AnimatedContainer(
-      key: ValueKey(history.message.contentmd5),
-      duration: const Duration(milliseconds: 375),
-      padding: const EdgeInsets.symmetric(
-        horizontal: 12,
-        vertical: 8
-      ),
-      decoration: BoxDecoration(
-        color: Colors.grey[50],
-        borderRadius: const BorderRadius.only(
-            topLeft: Radius.circular(8.0),
-            topRight: Radius.circular(8.0),
-            bottomLeft: Radius.zero,
-            bottomRight: Radius.circular(8.0)
+    return Column(
+      mainAxisSize: MainAxisSize.min,
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        AnimatedContainer(
+          key: ValueKey(history.message.contentmd5),
+          duration: const Duration(milliseconds: 375),
+          padding: history.message.type == MessageType.image ? 
+            const EdgeInsets.all(0) : 
+            const EdgeInsets.symmetric(horizontal: 12.0, vertical: 8.0),
+          decoration: BoxDecoration(
+            color: Colors.grey[50],
+            borderRadius: const BorderRadius.only(
+                topLeft: Radius.circular(8.0),
+                topRight: Radius.circular(8.0),
+                bottomLeft: Radius.zero,
+                bottomRight: Radius.circular(8.0)
+            ),
+            boxShadow: [BoxShadow(blurRadius: 5.0, color: Colors.grey.withOpacity(0.3))]
+          ),
+          child: ClipRRect(
+            borderRadius: const BorderRadius.only(
+                topLeft: Radius.circular(8.0),
+                topRight: Radius.circular(8.0),
+                bottomLeft: Radius.zero,
+                bottomRight: Radius.circular(8.0)
+            ),
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              mainAxisSize: MainAxisSize.min,
+              children: [
+                if(history.message.type == MessageType.file)
+                  FileBox(history: history),
+                if(history.message.type == MessageType.image)
+                  ImageBox(history: history),
+                if(history.message.type == MessageType.plaintext)
+                  TextBox(history: history),
+                if(history.message.type != MessageType.image)
+                  ...[
+                    const SizedBox(height: 4.0,),
+                    Text(
+                      _getTimeStamp(history.message.timeStamp),
+                      style: TextStyle(
+                        fontSize: 12,
+                        color: Colors.grey[400],
+                      ),
+                    )
+                  ]
+              ],
+            ),
+          )
        ),
-        boxShadow: [BoxShadow(blurRadius: 5.0, color: Colors.grey.withOpacity(0.3))]
-      ),
-      child: ClipRRect(
-        borderRadius: const BorderRadius.only(
-            topLeft: Radius.circular(8.0),
-            topRight: Radius.circular(8.0),
-            bottomLeft: Radius.zero,
-            bottomRight: Radius.circular(8.0)
-        ),
-        child: Column(
-          crossAxisAlignment: CrossAxisAlignment.start,
-          mainAxisSize: MainAxisSize.min,
-          children: [
-            if(history.message.type == MessageType.file)
-              FileBox(history: history),
-            if(history.message.type == MessageType.image)
-              ImageBox(history: history),
-            if(history.message.type == MessageType.plaintext)
-              TextBox(history: history),
-            const SizedBox(height: 4.0,),
-            Text(
-              _getTimeStamp(history.message.timeStamp),
-              style: TextStyle(
-                fontSize: 12,
-                color: Colors.grey[400],
-              ),
-            )
-          ],
-        ),
-      )
+        if(history.message.type == MessageType.image)
+          Text(
+            _getTimeStamp(history.message.timeStamp),
+            style: TextStyle(
+              fontSize: 12,
+              color: Colors.grey[400],
+            ),
+          )
+      ]
    );
  }

--- a/lib/chat/view/input_box/input_box.dart
+++ b/lib/chat/view/input_box/input_box.dart
@ -1,10 +1,12 @@
 /*
 * @Author       : Linloir
 * @Date         : 2022-10-14 17:54:30
- * @LastEditTime : 2022-10-18 15:30:05
+ * @LastEditTime : 2022-10-19 23:33:25
 * @Description  : 
 */

+import 'dart:convert';
+
 import 'package:file_picker/file_picker.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
@ -83,6 +85,24 @@ class InputBox extends StatelessWidget {
              icon: Icon(Icons.attach_file_rounded, color: Colors.grey[700],)
            ),
            const SizedBox(width: 8.0,),
+            IconButton(
+              onPressed: () {
+                var chatCubit = context.read<ChatCubit>();
+                chatCubit.localServiceRepository.pickFile(FileType.image).then((img) async {
+                  if(img != null) {
+                    var newMessage = Message(
+                      userid: (await SharedPreferences.getInstance()).getInt('userid')!,
+                      targetid: chatCubit.userID,
+                      content: base64.encode(await img.readAsBytes()),
+                      contenttype: MessageType.image,
+                    );
+                    chatCubit.addMessage(newMessage);
+                  }
+                });
+              }, 
+              icon: Icon(Icons.photo_rounded, color: Colors.grey[700],)
+            ),
+            const SizedBox(width: 8.0,),
            BlocBuilder<MessageInputCubit, MessageInputState>(
              builder:(context, state) {
                return IconButton(
--- a/lib/chat/view/out_message_box.dart
+++ b/lib/chat/view/out_message_box.dart
@ -1,7 +1,7 @@
 /*
 * @Author       : Linloir
 * @Date         : 2022-10-14 13:49:28
- * @LastEditTime : 2022-10-15 10:23:43
+ * @LastEditTime : 2022-10-19 23:47:20
 * @Description  : 
 */

@ -22,51 +22,70 @@ class OutMessageBox extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
-    return AnimatedContainer(
-      key: ValueKey(history.message.contentmd5),
-      duration: const Duration(milliseconds: 375),
-      padding: const EdgeInsets.symmetric(
-        horizontal: 12,
-        vertical: 8
-      ),
-      decoration: BoxDecoration(
-        color: Colors.blue,
-        borderRadius: const BorderRadius.only(
-            topLeft: Radius.circular(8.0),
-            topRight: Radius.circular(8.0),
-            bottomLeft: Radius.circular(8.0),
-            bottomRight: Radius.zero
+    return Column(
+      mainAxisSize: MainAxisSize.min,
+      crossAxisAlignment: CrossAxisAlignment.end,
+      children: [
+        AnimatedContainer(
+          key: ValueKey(history.message.contentmd5),
+          duration: const Duration(milliseconds: 375),
+          padding: history.message.type == MessageType.image ? 
+            const EdgeInsets.all(0) : 
+            const EdgeInsets.symmetric(horizontal: 12.0, vertical: 8.0),
+          decoration: BoxDecoration(
+            color: Colors.blue,
+            borderRadius: const BorderRadius.only(
+                topLeft: Radius.circular(8.0),
+                topRight: Radius.circular(8.0),
+                bottomLeft: Radius.circular(8.0),
+                bottomRight: Radius.zero
+            ),
+            boxShadow: [BoxShadow(blurRadius: 5.0, color: Colors.grey.withOpacity(0.2))]
+          ),
+          child: ClipRRect(
+            borderRadius: const BorderRadius.only(
+                topLeft: Radius.circular(8.0),
+                topRight: Radius.circular(8.0),
+                bottomLeft: Radius.circular(8.0),
+                bottomRight: Radius.zero
+            ),
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.end,
+              mainAxisSize: MainAxisSize.min,
+              children: [
+                if(history.message.type == MessageType.file)
+                  FileBox(history: history),
+                if(history.message.type == MessageType.image)
+                  ImageBox(history: history),
+                if(history.message.type == MessageType.plaintext)
+                  TextBox(history: history),
+                if(history.message.type != MessageType.image)
+                  ...[
+                    const SizedBox(height: 4.0,),
+                    Text(
+                      _getTimeStamp(history.message.timeStamp),
+                      style: TextStyle(
+                        fontSize: 12,
+                        color: Colors.grey[200],
+                      ),
+                    )
+                  ],
+              ],
+            ),
+          )
        ),
-        boxShadow: [BoxShadow(blurRadius: 5.0, color: Colors.grey.withOpacity(0.2))]
-      ),
-      child: ClipRRect(
-        borderRadius: const BorderRadius.only(
-            topLeft: Radius.circular(8.0),
-            topRight: Radius.circular(8.0),
-            bottomLeft: Radius.circular(8.0),
-            bottomRight: Radius.zero
-        ),
-        child: Column(
-          crossAxisAlignment: CrossAxisAlignment.start,
-          mainAxisSize: MainAxisSize.min,
-          children: [
-            if(history.message.type == MessageType.file)
-              FileBox(history: history),
-            if(history.message.type == MessageType.image)
-              ImageBox(history: history),
-            if(history.message.type == MessageType.plaintext)
-              TextBox(history: history),
+        if(history.message.type == MessageType.image)
+          ...[
            const SizedBox(height: 4.0,),
            Text(
              _getTimeStamp(history.message.timeStamp),
              style: TextStyle(
                fontSize: 12,
-                color: Colors.grey[200],
+                color: Colors.grey[800],
              ),
-            )
-          ],
-        ),
-      )
+            ),
+          ]
+      ]
    );
  }

--- a/lib/home/view/message_page/view/message_tile.dart
+++ b/lib/home/view/message_page/view/message_tile.dart
@ -1,7 +1,7 @@
 /*
 * @Author       : Linloir
 * @Date         : 2022-10-13 13:17:52
- * @LastEditTime : 2022-10-18 11:25:40
+ * @LastEditTime : 2022-10-20 00:52:14
 * @Description  : 
 */

@ -106,7 +106,7 @@ class MessageTile extends StatelessWidget {
                        ),
                        child: IgnorePointer(
                          child: Text(
-                            message?.contentDecoded ?? '',
+                            message?.type == MessageType.image ? '[Image]' : message?.contentDecoded ?? '',
                            maxLines: 1,
                            overflow: TextOverflow.ellipsis,
                            style: const TextStyle(