healthcare-frontend/lib/chat/chatpage.dart

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:healthcare_user/chat/chatzoomable_image.dart';
import 'package:healthcare_user/common/settings.dart';
import 'package:healthcare_user/pages/index.dart';
import 'package:image_picker/image_picker.dart';
import 'chat_controller.dart';
import 'chatmessage.dart';
import 'package:photo_view/photo_view.dart';

class ChatPage extends StatefulWidget {
  const ChatPage({Key? key});

  @override
  State<ChatPage> createState() => _ChatPageState();
}

class _ChatPageState extends State<ChatPage> {
  final ChatController chatController = Get.put(ChatController());
  final TextEditingController content = TextEditingController();
  final ImagePicker _picker = ImagePicker();
  XFile? _image;
  var id="1";
  bool _sending = false;
  final ScrollController _scrollController = ScrollController();

  @override
  void initState() {
    super.initState();
    _scrollToBottom();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor:Colors.green,
        elevation: 0,
        automaticallyImplyLeading: false,
        flexibleSpace: SafeArea(
          child: Container(
            padding: EdgeInsets.only(right: 16),
            child: Row(
              children: <Widget>[
                IconButton(
                  onPressed: (){
                    Navigator.pop(context);
                  },
                  icon: Icon(Icons.arrow_back,color: Colors.black,),
                ),
                SizedBox(width: 2,),
                CircleAvatar(
                  backgroundImage: NetworkImage(AppSettings.profilePictureUrl),
                  maxRadius: 20,
                ),
                SizedBox(width: 12,),
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      Text(AppSettings.userName,style: TextStyle( fontSize: 16 ,fontWeight: FontWeight.w600),),
                      // SizedBox(height: 6,),
                      // Text("Online",style: TextStyle(color: Colors.grey.shade600, fontSize: 13),),
                    ],
                  ),
                ),
                /*IconButton(
                  onPressed: () {
                    UrlLauncher.launch("tel://8328206298");
                  },
                  icon: Icon(Icons.call, color: Colors.black),
                ),*/
                IconButton(
                  onPressed: () {
                     Navigator.push(
                      context,
                      MaterialPageRoute(
                          builder: (context) => IndexPage()),
                    );
                  },
                  icon: Icon(Icons.videocam, color: Colors.black),
                ),
              ],
            ),
          ),
        ),
      ),
      body: Stack(
        children: [
          Obx(() => ListView.builder(
            itemCount: chatController.messages.length,
            shrinkWrap: true,
            padding: EdgeInsets.only(top: 10, bottom: 80), // Adjust bottom padding to accommodate the input field
            physics: ScrollPhysics(),
            controller: _scrollController,
            itemBuilder: (context, index) {
              final data = chatController.messages[index];
              return Container(
                padding: EdgeInsets.only(
                    left: 14, right: 14, top: 10, bottom: 10),
                child: Align(
                  alignment: (data.messageType != id ? Alignment.topLeft : Alignment.topRight),
                  child: GestureDetector(
                    onTap: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(
                          builder: (context) => ChatZoomableImage(data.messageContent),
                        ),
                      );
                    },
                    child: Container(
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(20),
                        color: (data.messageType != id
                            ? Colors.grey.shade200
                            : Colors.blue[200]),
                      ),
                      padding: EdgeInsets.all(16),
                      child: data.isText
                          ? Text(data.messageContent, style: TextStyle(fontSize: 15))
                          : Image.network(
                        data.messageContent,
                        scale: 3,
                        width: 100,
                        height: 100,
                        fit: BoxFit.cover,
                      ),
                    ),
                  ),

                ),
              );
            },
          )),
          Align(alignment: Alignment.bottomCenter,child: Padding(
            padding: const EdgeInsets.symmetric(horizontal: 8.0),
            child: Container(
              height: 60,
              width: double.infinity,
              color: Colors.white,
              child: Row(
                children: <Widget>[
                  GestureDetector(
                    onTap: getImage,
                    child: Container(
                      height: 30,
                      width: 30,
                      decoration: BoxDecoration(
                        color: Colors.lightBlue,
                        borderRadius: BorderRadius.circular(30),
                      ),
                      child: Icon(Icons.add, color: Colors.white, size: 20),
                    ),
                  ),
                  SizedBox(width: 15),
                  Expanded(
                    child: TextField(
                      controller: content,
                      decoration: InputDecoration(
                        hintText: "Write message...",
                        hintStyle: TextStyle(color: Colors.black54),
                        border: InputBorder.none,
                      ),
                    ),
                  ),
                  SizedBox(width: 15),
                  FloatingActionButton(
                    onPressed: () {
                      sendMessage();
                    },
                    child: Icon(Icons.send, color: Colors.white, size: 18),
                    backgroundColor: Colors.blue,
                    elevation: 0,
                  ),
                ],
              ),
            ),
          ),)
        ],
      ),
    );
  }

  void _scrollToBottom() {
    Future.delayed(Duration(milliseconds: 300), () {
      if (_scrollController.hasClients) {
        _scrollController.animateTo(
          _scrollController.position.maxScrollExtent,
          duration: Duration(milliseconds: 300),
          curve: Curves.easeInOut,
        );
      }
    });
  }

  Future getImage() async {
    final XFile? image =
    await _picker.pickImage(source: ImageSource.gallery);
    if (image != null) {
      setState(() {
        _image = image;
      });
      sendMessage(); // Call sendMessage function to send the selected image immediately
    }
  }

  void sendMessage() async {
    String messageContent = content.text.trim();
    if (messageContent.isNotEmpty || _image != null) {
      setState(() {
        _sending = true;
      });
      try {
        if (_image != null) {
          String imageUrl =
          await chatController.uploadImage(File(_image!.path),'$id');
          chatController.sendMessage(imageUrl, '$id', false);
          _image = null; // Clear the selected image after sending
        }
        if (messageContent.isNotEmpty) {
          chatController.sendMessage(messageContent, '$id', true);
          content.clear();
        }
      } finally {
        setState(() {
          _sending = false;
        });
      }
      _scrollToBottom(); // Scroll to the bottom after sending message
    }
  }
}