GitLab
/
fluffychat
mirror of https://gitlab.com/famedly/fluffychat.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

design: Floating input bar

This commit is contained in:
Krille Fear 2021-11-06 11:18:32 +01:00
parent 0fe32596de
commit 66cae6cc85
1 changed files with 248 additions and 232 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
lib/pages/views/chat_view.dart
View File

@ -1,5 +1,6 @@
import 'dart:ui'; import 'dart:ui';
import 'package:fluffychat/config/themes.dart';
import 'package:flutter/foundation.dart'; import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/services.dart'; import 'package:flutter/services.dart';
@ -505,14 +506,21 @@ class ChatView extends StatelessWidget {
), ),
), ),
), ),
const Divider(height: 1), if (controller.showScrollDownButton)
const Divider(
height: 1,
),
if (controller.room.canSendDefaultMessages && if (controller.room.canSendDefaultMessages &&
controller.room.membership == Membership.join && controller.room.membership == Membership.join &&
!controller.showEmojiPicker) !controller.showEmojiPicker)
Container( Padding(
decoration: BoxDecoration( padding: EdgeInsets.all(
FluffyThemes.isColumnMode(context) ? 16.0 : 8.0),
child: Material(
borderRadius:
BorderRadius.circular(AppConfig.borderRadius),
elevation: 4,
color: Theme.of(context).scaffoldBackgroundColor, color: Theme.of(context).scaffoldBackgroundColor,
),
child: Row( child: Row(
crossAxisAlignment: CrossAxisAlignment.end, crossAxisAlignment: CrossAxisAlignment.end,
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
@ -521,7 +529,8 @@ class ChatView extends StatelessWidget {
SizedBox( SizedBox(
height: 56, height: 56,
child: TextButton( child: TextButton(
onPressed: controller.forwardEventsAction, onPressed:
controller.forwardEventsAction,
child: Row( child: Row(
children: <Widget>[ children: <Widget>[
const Icon(Icons const Icon(Icons
@ -544,8 +553,8 @@ class ChatView extends StatelessWidget {
controller.replyAction, controller.replyAction,
child: Row( child: Row(
children: <Widget>[ children: <Widget>[
Text( Text(L10n.of(context)
L10n.of(context).reply), .reply),
const Icon(Icons const Icon(Icons
.keyboard_arrow_right), .keyboard_arrow_right),
], ],
@ -555,8 +564,8 @@ class ChatView extends StatelessWidget {
: SizedBox( : SizedBox(
height: 56, height: 56,
child: TextButton( child: TextButton(
onPressed: onPressed: controller
controller.sendAgainAction, .sendAgainAction,
child: Row( child: Row(
children: <Widget>[ children: <Widget>[
Text(L10n.of(context) Text(L10n.of(context)
@ -573,7 +582,8 @@ class ChatView extends StatelessWidget {
] ]
: <Widget>[ : <Widget>[
AnimatedContainer( AnimatedContainer(
duration: const Duration(milliseconds: 200), duration:
const Duration(milliseconds: 200),
height: 56, height: 56,
width: width:
controller.inputText.isEmpty ? 56 : 0, controller.inputText.isEmpty ? 56 : 0,
@ -595,8 +605,8 @@ class ChatView extends StatelessWidget {
child: Icon( child: Icon(
Icons.attachment_outlined), Icons.attachment_outlined),
), ),
title: title: Text(
Text(L10n.of(context).sendFile), L10n.of(context).sendFile),
contentPadding: contentPadding:
const EdgeInsets.all(0), const EdgeInsets.all(0),
), ),
@ -607,7 +617,8 @@ class ChatView extends StatelessWidget {
leading: const CircleAvatar( leading: const CircleAvatar(
backgroundColor: Colors.blue, backgroundColor: Colors.blue,
foregroundColor: Colors.white, foregroundColor: Colors.white,
child: Icon(Icons.image_outlined), child:
Icon(Icons.image_outlined),
), ),
title: Text( title: Text(
L10n.of(context).sendImage), L10n.of(context).sendImage),
@ -620,13 +631,14 @@ class ChatView extends StatelessWidget {
value: 'camera', value: 'camera',
child: ListTile( child: ListTile(
leading: const CircleAvatar( leading: const CircleAvatar(
backgroundColor: Colors.purple, backgroundColor:
Colors.purple,
foregroundColor: Colors.white, foregroundColor: Colors.white,
child: Icon( child: Icon(Icons
Icons.camera_alt_outlined), .camera_alt_outlined),
), ),
title: Text( title: Text(L10n.of(context)
L10n.of(context).openCamera), .openCamera),
contentPadding: contentPadding:
const EdgeInsets.all(0), const EdgeInsets.all(0),
), ),
@ -639,13 +651,14 @@ class ChatView extends StatelessWidget {
value: 'sticker', value: 'sticker',
child: ListTile( child: ListTile(
leading: const CircleAvatar( leading: const CircleAvatar(
backgroundColor: Colors.orange, backgroundColor:
Colors.orange,
foregroundColor: Colors.white, foregroundColor: Colors.white,
child: Icon(Icons child: Icon(Icons
.emoji_emotions_outlined), .emoji_emotions_outlined),
), ),
title: Text( title: Text(L10n.of(context)
L10n.of(context).sendSticker), .sendSticker),
contentPadding: contentPadding:
const EdgeInsets.all(0), const EdgeInsets.all(0),
), ),
@ -724,7 +737,8 @@ class ChatView extends StatelessWidget {
enabledBorder: InputBorder.none, enabledBorder: InputBorder.none,
filled: false, filled: false,
), ),
onChanged: controller.onInputBarChanged, onChanged:
controller.onInputBarChanged,
), ),
), ),
), ),
@ -734,9 +748,10 @@ class ChatView extends StatelessWidget {
height: 56, height: 56,
alignment: Alignment.center, alignment: Alignment.center,
child: IconButton( child: IconButton(
tooltip: L10n.of(context).voiceMessage, tooltip:
icon: L10n.of(context).voiceMessage,
const Icon(Icons.mic_none_outlined), icon: const Icon(
Icons.mic_none_outlined),
onPressed: onPressed:
controller.voiceMessageAction, controller.voiceMessageAction,
), ),
@ -755,6 +770,7 @@ class ChatView extends StatelessWidget {
], ],
), ),
), ),
),
AnimatedContainer( AnimatedContainer(
duration: const Duration(milliseconds: 300), duration: const Duration(milliseconds: 300),
height: controller.showEmojiPicker height: controller.showEmojiPicker