iMessage clone (#1)

* first draft : static views wip * refactor to ChatMessage and ChatMessageHeader * add pedantic * fix lints * remove hardcoded message * appBar title : iMessage * format date * cupertino style and model view * fix display of message based on isReceived or sent * SendMessageInput * refactor to MessagesPage * MissingPluginException * use builtins instead of custom stream builders * handle isReceived * delete channel header * fix layout issues in ChannelPreview * fix formatDate * sticky message input * usage of builtin MessageListCore * remove unused imports and a todo * rename channelsStates to channels * replace file imports /w package:imessage/filename * remove size required ChannelNameText * lint and format * sendMessage * transition animation * stream_chat_flutter_core instead * format Date differently if same week * add padding to bubble * remove iMessage text from header * reverse message order * if same day don't display date * padding chat bubble right * remove unused extension * constraint message width * group messages By dates * unused import * fix bug input + layout+ preview onTap * change updatedAt to createdAt * add filter on channel * handle refresh * handle pagination with core LazyLoadScrollView * preview simple medias * upload bug * fix attachment * visual changes to message input * remove size * clean up * wait 5 sec before displaying image(hack) Co-authored-by: Salvatore Giordano <[email protected]>
2021-02-22 16:28:44 +01:00
parent 8af74183ad
commit 2c2787c419
77 changed files with 2399 additions and 0 deletions
@@ -0,0 +1,151 @@
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:flutter/cupertino.dart';
+import 'package:imessage/cutom_painter.dart';
+import 'package:stream_chat_flutter/stream_chat_flutter.dart' show Message, AttachmentUploadStateBuilder;
+
+class MessageWidget extends StatelessWidget {
+  final Alignment alignment;
+  final Message message;
+  final Color color;
+  final Color messageColor;
+
+  const MessageWidget(
+      {Key key,
+      @required this.alignment,
+      @required this.message,
+      @required this.color,
+      @required this.messageColor})
+      : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    if (message.attachments.isNotEmpty &&
+        message.attachments.first.type == "image") {
+      return MessageImage(
+          color: color, message: message, messageColor: messageColor);
+    } else {
+      return MessageText(
+          alignment: alignment,
+          color: color,
+          message: message,
+          messageColor: messageColor);
+    }
+  }
+}
+
+class MessageImage extends StatelessWidget {
+  const MessageImage({
+    Key key,
+    @required this.color,
+    @required this.message,
+    @required this.messageColor,
+  }) : super(key: key);
+
+  final Color color;
+  final Message message;
+  final Color messageColor;
+
+  @override
+  Widget build(BuildContext context) {
+    if (message.text != null) {
+      return Padding(
+        padding: const EdgeInsets.all(8.0),
+        child: Column(
+          children: [
+            ClipRRect(
+              borderRadius: BorderRadius.circular(20),
+              child: Container(
+                color: color,
+                child: Column(
+                  children: [
+                   
+                    FutureBuilder<String>( //hack:  //AttachmentUploadStateBuilder once https://github.com/GetStream/stream-chat-flutter/pull/276 is merged
+                        future: Future.delayed(
+                            const Duration(seconds: 5),
+                            () =>
+                                message.attachments.first.thumbUrl ??
+                                message.attachments.first.imageUrl ??
+                                message.attachments.first.assetUrl),
+                        builder: (context, snapshot) {
+                          return snapshot.hasData
+                              ? CachedNetworkImage(
+                                  imageUrl: snapshot.data,
+                                )
+                              : CupertinoActivityIndicator();
+                        }),
+                    if (message.attachments.first?.title != null)
+                      Padding(
+                        padding: const EdgeInsets.all(8.0),
+                        child: Text(message.attachments.first.title,
+                            style: TextStyle(color: messageColor)),
+                      ),
+                    message.attachments.first.pretext != null
+                        ? Text(message.attachments.first.pretext)
+                        : Container()
+                  ],
+                ),
+              ),
+            )
+          ],
+        ),
+      );
+    } else {
+      return ClipRRect(
+        borderRadius: BorderRadius.circular(20),
+        child: Container(
+            color: color,
+            child: CachedNetworkImage(
+              imageUrl: message.attachments.first.thumbUrl,
+            )),
+      );
+    }
+  }
+}
+
+class MessageText extends StatelessWidget {
+  const MessageText({
+    Key key,
+    @required this.alignment,
+    @required this.color,
+    @required this.message,
+    @required this.messageColor,
+  }) : super(key: key);
+
+  final Alignment alignment;
+  final Color color;
+  final Message message;
+  final Color messageColor;
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.all(8.0),
+      child: Align(
+        alignment:
+            alignment, //Change this to Alignment.topRight or Alignment.topLeft
+        child: CustomPaint(
+          painter: ChatBubble(color: color, alignment: alignment),
+          child: Container(
+            margin: const EdgeInsets.fromLTRB(16.0, 8.0, 16.0, 8.0),
+            child: Row(
+              mainAxisSize: MainAxisSize.min,
+              children: [
+                Container(
+                  constraints: BoxConstraints(
+                      maxWidth: MediaQuery.of(context).size.width * 0.65),
+                  child: Padding(
+                    padding: const EdgeInsets.all(4.0),
+                    child: Text(
+                      message.text,
+                      style: TextStyle(color: messageColor),
+                    ),
+                  ),
+                ),
+              ],
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}