MarianumMobile/Client
5
1
Fork 0
Code Issues 34 Pull Requests 1 Actions Packages Projects 1 Releases Wiki Activity

updated chatTextfield.dart design and added file and gallery picker

Browse Source
This commit is contained in:
Elias Müller
2023-05-06 14:51:11 +02:00
parent cc43a9e081
commit 8d890f1a26
7 changed files with 191 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
lib/screen/pages/talk/chatBubble.dart
View File

@ -15,7 +15,7 @@ class ChatBubble {
color: Color(0xffd4eaf4),
borderWidth: 1,
elevation: 2,
margin: BubbleEdges.only(bottom: 15),
margin: BubbleEdges.only(bottom: 20, top: 10),
alignment: Alignment.center,
);
@ -25,7 +25,7 @@ class ChatBubble {
color: seamless ? Colors.transparent : Colors.white,
borderWidth: seamless ? 0 : 1,
elevation: seamless ? 0 : 1,
margin: const BubbleEdges.only(bottom: 15, left: 10, right: 50),
margin: const BubbleEdges.only(bottom: 10, left: 10, right: 50),
alignment: Alignment.topLeft,
);
}
@ -36,7 +36,7 @@ class ChatBubble {
color: seamless ? Colors.transparent : const Color(0xffd9fdd3),
borderWidth: seamless ? 0 : 1,
elevation: seamless ? 0 : 1,
margin: const BubbleEdges.only(bottom: 15, right: 10, left: 50),
margin: const BubbleEdges.only(bottom: 10, right: 10, left: 50),
alignment: Alignment.topRight,
);
}

13
lib/screen/pages/talk/chatList.dart
View File

@ -5,6 +5,7 @@ import 'package:jiffy/jiffy.dart';
import 'package:marianum_mobile/api/marianumcloud/talk/chat/richObjectStringProcessor.dart';
import 'package:marianum_mobile/api/marianumcloud/talk/room/getRoomResponse.dart';
import 'package:marianum_mobile/data/chatList/chatListProps.dart';
import 'package:persistent_bottom_nav_bar/persistent_tab_view.dart';
import 'package:provider/provider.dart';
import 'package:shared_preferences/shared_preferences.dart';
@ -91,13 +92,11 @@ class _ChatListState extends State<ChatList> {
),
leading: circleAvatar,
onTap: () async {
Navigator.of(context).push(MaterialPageRoute(builder: (context) {
return ChatView(
room: chatRoom,
selfId: username,
avatar: circleAvatar,
);
}));
PersistentNavBarNavigator.pushNewScreen(
context,
screen: ChatView(room: chatRoom, selfId: username, avatar: circleAvatar),
withNavBar: false
);
},
));
}

125
lib/screen/pages/talk/chatTextfield.dart
View File

@ -1,4 +1,7 @@
import 'dart:developer';
import 'package:flutter/material.dart';
import 'package:marianum_mobile/widget/filePick.dart';
import 'package:provider/provider.dart';
import '../../../api/marianumcloud/talk/sendMessage/sendMessage.dart';
@ -19,44 +22,94 @@ class _ChatTextfieldState extends State<ChatTextfield> {
@override
Widget build(BuildContext context) {
return Container(
color: Theme.of(context).dividerColor,
padding: const EdgeInsets.all(10),
child: Row(
children: [
Expanded(
child: TextField(
controller: _textBoxController,
readOnly: sending,
maxLines: null,
decoration: const InputDecoration(
hintText: "Nachricht",
border: OutlineInputBorder(),
labelText: "",
),
return Stack(
children: <Widget>[
Align(
alignment: Alignment.bottomLeft,
child: Container(
padding: const EdgeInsets.only(left: 10, bottom: 10, top: 10),
height: 60,
width: double.infinity,
color: Colors.white,
child: Row(
children: <Widget>[
GestureDetector(
onTap: (){
showDialog(context: context, builder: (context) {
return SimpleDialog(
children: [
ListTile(
leading: const Icon(Icons.file_open),
title: const Text("Aus Dateien auswählen"),
onTap: () {
FilePick.documentPick().then((value) {
log(value ?? "?");
});
Navigator.of(context).pop();
},
),
ListTile(
leading: const Icon(Icons.image),
title: const Text("Aus Gallerie auswählen"),
onTap: () {
FilePick.galleryPick().then((value) {
log(value?.path ?? "?");
});
Navigator.of(context).pop();
},
),
],
);
});
},
child: Container(
height: 30,
width: 30,
decoration: BoxDecoration(
color: Theme.of(context).primaryColor,
borderRadius: BorderRadius.circular(30),
),
child: const Icon(Icons.add, color: Colors.white, size: 20, ),
),
),
const SizedBox(width: 15),
Expanded(
child: TextField(
controller: _textBoxController,
readOnly: sending,
maxLines: 10,
decoration: const InputDecoration(
hintText: "Nachricht schreiben...",
hintStyle: TextStyle(color: Colors.black54),
border: InputBorder.none
),
),
),
const SizedBox(width: 15),
FloatingActionButton(
onPressed: (){
if(_textBoxController.text.isEmpty) return;
setState(() {
sending = true;
});
SendMessage(widget.sendToToken, SendMessageParams(_textBoxController.text)).run().then((value) => {
Provider.of<ChatProps>(context, listen: false).run(),
_textBoxController.text = "",
setState(() {
sending = false;
}),
});
},
backgroundColor: Theme.of(context).primaryColor,
elevation: 0,
child: const Icon(Icons.send, color: Colors.white, size: 18),
),
],
),
),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 15),
child: sending ? const Center(child: CircularProgressIndicator()) : IconButton(
onPressed: () {
if(_textBoxController.text.isEmpty) return;
setState(() {
sending = true;
});
SendMessage(widget.sendToToken, SendMessageParams(_textBoxController.text)).run().then((value) => {
Provider.of<ChatProps>(context, listen: false).run(),
_textBoxController.text = "",
setState(() {
sending = false;
}),
});
},
icon: const Icon(Icons.send)
),
)
],
),
),
],
);
}
}

22
lib/widget/filePick.dart Normal file
View File

@ -0,0 +1,22 @@
import 'dart:developer';
import 'package:file_picker/file_picker.dart';
import 'package:image_picker/image_picker.dart';
class FilePick {
static final _picker = ImagePicker();
static Future<XFile?> galleryPick() async {
final XFile? pickedImage = await _picker.pickImage(source: ImageSource.gallery);
if (pickedImage != null) {
log("Picked ${pickedImage.path} (${pickedImage.mimeType})");
return pickedImage;
}
return null;
}
static Future<String?> documentPick() async {
FilePickerResult? result = await FilePicker.platform.pickFiles();
return result?.files.single.path;
}
}