talksik/stream-chat-flutter
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

rfac: Moved pages to sample app

Browse Source
This commit is contained in:
Deven Joshi
2020-12-21 20:29:12 +05:30
parent 58cc196ecc
commit 0968bff3ae
9 changed files with 99 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files
example/lib/chat_info_screen.dart
+478
View File
@@ -0,0 +1,478 @@
import 'package:emojis/emojis.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:jiffy/jiffy.dart';
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
/// Detail screen for a 1:1 chat correspondence
class ChatInfoScreen extends StatefulWidget {
/// User in consideration
final User user;
const ChatInfoScreen({Key key, this.user}) : super(key: key);
@override
_ChatInfoScreenState createState() => _ChatInfoScreenState();
}
class _ChatInfoScreenState extends State<ChatInfoScreen> {
@override
Widget build(BuildContext context) {
final channel = StreamChannel.of(context).channel;
return Scaffold(
backgroundColor: Color(0xFFe6e6e6),
body: ListView(
children: [
_buildUserHeader(),
SizedBox(
height: 8.0,
),
_buildOptionListTiles(),
SizedBox(
height: 8.0,
),
if ([
'admin',
'owner',
].contains(channel.state.members
.firstWhere((m) => m.userId == channel.client.state.user.id,
orElse: () => null)
?.role))
_buildDeleteListTile(),
],
),
);
}
Widget _buildUserHeader() {
return Material(
color: Colors.white,
child: SafeArea(
child: Stack(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.all(16.0),
child: UserAvatar(
user: widget.user,
constraints: BoxConstraints(
maxWidth: 72.0,
maxHeight: 72.0,
),
borderRadius: BorderRadius.circular(36.0),
showOnlineStatus: false,
),
),
//SizedBox(height: 4.0),
Text(
widget.user.name,
style: TextStyle(fontSize: 16.0, fontWeight: FontWeight.bold),
),
SizedBox(height: 7.0),
_buildConnectedTitleState(),
SizedBox(height: 15.0),
OptionListTile(
title: '@${widget.user.id}',
trailing: Padding(
padding: const EdgeInsets.symmetric(horizontal: 8.0),
child: Text(
widget.user.name,
style: TextStyle(
color: Colors.black.withOpacity(0.5), fontSize: 16.0),
),
),
onTap: () {},
),
],
),
Positioned(
top: 21,
left: 16,
child: InkWell(
child: StreamSvgIcon.left(),
onTap: () {
Navigator.of(context).pop();
},
),
),
],
),
),
);
}
Widget _buildOptionListTiles() {
var channel = StreamChannel.of(context);
return Column(
children: [
// _OptionListTile(
// title: 'Notifications',
// leading: StreamSvgIcon.Icon_notification(
// size: 24.0,
// color: Colors.black.withOpacity(0.5),
// ),
// trailing: CupertinoSwitch(
// value: true,
// onChanged: (val) {},
// ),
// onTap: () {},
// ),
StreamBuilder<bool>(
stream: StreamChannel.of(context).channel.isMutedStream,
builder: (context, snapshot) {
return OptionListTile(
title: 'Mute user',
leading: StreamSvgIcon.mute(
size: 23.0,
color: Colors.black.withOpacity(0.5),
),
trailing: snapshot.data == null
? CircularProgressIndicator()
: CupertinoSwitch(
value: snapshot.data,
onChanged: (val) {
if (snapshot.data) {
channel.channel.unmute();
} else {
channel.channel.mute();
}
},
),
onTap: () {},
);
}),
// _OptionListTile(
// title: 'Block User',
// leading: StreamSvgIcon.Icon_user_delete(
// size: 24.0,
// color: Colors.black.withOpacity(0.5),
// ),
// trailing: CupertinoSwitch(
// value: widget.user.banned,
// onChanged: (val) {
// if (widget.user.banned) {
// channel.channel.shadowBan(widget.user.id, {});
// } else {
// channel.channel.unbanUser(widget.user.id);
// }
// },
// ),
// onTap: () {},
// ),
OptionListTile(
title: 'Photos & Videos',
leading: StreamSvgIcon.pictures(
size: 32.0,
color: Colors.black.withOpacity(0.5),
),
trailing: StreamSvgIcon.right(),
onTap: () {
final channel = StreamChannel.of(context).channel;
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => StreamChannel(
channel: channel,
child: MessageSearchBloc(
child: ChannelMediaDisplayScreen(
sortOptions: [
SortOption(
'created_at',
direction: SortOption.ASC,
),
],
paginationParams: PaginationParams(limit: 20),
),
),
),
),
);
},
),
OptionListTile(
title: 'Files',
leading: StreamSvgIcon.files(
size: 32.0,
color: Colors.black.withOpacity(0.5),
),
trailing: StreamSvgIcon.right(),
onTap: () {
final channel = StreamChannel.of(context).channel;
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => StreamChannel(
channel: channel,
child: MessageSearchBloc(
child: ChannelFileDisplayScreen(
sortOptions: [
SortOption(
'created_at',
direction: SortOption.ASC,
),
],
paginationParams: PaginationParams(limit: 20),
),
),
),
),
);
},
),
OptionListTile(
title: 'Shared groups',
leading: StreamSvgIcon.Icon_group(
size: 24.0,
color: Colors.black.withOpacity(0.5),
),
trailing: StreamSvgIcon.right(),
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => _SharedGroupsScreen(
StreamChat.of(context).user, widget.user)));
},
),
],
);
}
Widget _buildDeleteListTile() {
return OptionListTile(
title: 'Delete',
leading: StreamSvgIcon.delete(
color: Colors.red,
size: 24.0,
),
onTap: () {
_showDeleteDialog();
},
titleColor: Colors.red,
);
}
void _showDeleteDialog() async {
final res = await showConfirmationDialog(
context,
title: 'Delete Conversation',
okText: 'DELETE',
question: 'Are you sure you want to delete this conversation?',
cancelText: 'CANCEL',
icon: StreamSvgIcon.delete(
color: Colors.red,
),
);
var channel = StreamChannel.of(context).channel;
if (res == true) {
await channel.delete().then((value) {
Navigator.pop(context);
});
}
}
Widget _buildConnectedTitleState() {
var alternativeWidget;
final otherMember = widget.user;
if (otherMember != null) {
if (otherMember.online) {
alternativeWidget = Text(
'Online',
style: TextStyle(color: Colors.black.withOpacity(0.5)),
);
} else {
alternativeWidget = Text(
'Last seen ${Jiffy(otherMember.lastActive).fromNow()}',
style: TextStyle(color: Colors.black.withOpacity(0.5)),
);
}
}
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
if (widget.user.online)
Material(
type: MaterialType.circle,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 8.0),
constraints: BoxConstraints.tightFor(
width: 28,
height: 12,
),
child: Material(
shape: CircleBorder(),
color: Color(0xff20E070),
),
),
color: Colors.white,
),
alternativeWidget,
],
);
}
}
class _SharedGroupsScreen extends StatefulWidget {
final User mainUser;
final User otherUser;
_SharedGroupsScreen(this.mainUser, this.otherUser);
@override
__SharedGroupsScreenState createState() => __SharedGroupsScreenState();
}
class __SharedGroupsScreenState extends State<_SharedGroupsScreen> {
@override
Widget build(BuildContext context) {
var chat = StreamChat.of(context);
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(
brightness: Theme.of(context).brightness,
elevation: 1,
centerTitle: true,
title: Text(
'Shared Groups',
style: TextStyle(color: Colors.black, fontSize: 16.0),
),
leading: Center(
child: InkWell(
onTap: () {
Navigator.of(context).pop();
},
child: Container(
child: StreamSvgIcon.left(
color: Colors.black,
size: 24.0,
),
width: 24.0,
height: 24.0,
),
),
),
backgroundColor: StreamChatTheme.of(context).primaryColor,
),
body: StreamBuilder<List<Channel>>(
stream: chat.client.queryChannels(
filter: {
r'$and': [
{
'members': {
r'$in': [widget.otherUser.id],
},
},
{
'members': {
r'$in': [widget.mainUser.id],
},
}
],
},
),
builder: (context, snapshot) {
if (snapshot.data == null) {
return Center(
child: CircularProgressIndicator(),
);
}
return ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (context, position) {
return StreamChannel(
channel: snapshot.data[position],
child: _buildListTile(snapshot.data[position]),
);
},
);
},
),
);
}
Widget _buildListTile(Channel channel) {
var extraData = channel.extraData;
var members = channel.state.members;
var textStyle = TextStyle(fontSize: 14.0, fontWeight: FontWeight.bold);
return Container(
height: 64.0,
child: LayoutBuilder(builder: (context, constraints) {
String title;
if (extraData['name'] == null) {
final otherMembers = members.where(
(member) => member.userId != StreamChat.of(context).user.id);
if (otherMembers.isNotEmpty) {
final maxWidth = constraints.maxWidth;
final maxChars = maxWidth / textStyle.fontSize;
var currentChars = 0;
final currentMembers = <Member>[];
otherMembers.forEach((element) {
final newLength = currentChars + element.user.name.length;
if (newLength < maxChars) {
currentChars = newLength;
currentMembers.add(element);
}
});
final exceedingMembers =
otherMembers.length - currentMembers.length;
title =
'${currentMembers.map((e) => e.user.name).join(', ')} ${exceedingMembers > 0 ? '+ $exceedingMembers' : ''}';
} else {
title = 'No title';
}
} else {
title = extraData['name'];
}
return Column(
children: [
Expanded(
child: Row(
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: ChannelImage(
channel: channel,
constraints:
BoxConstraints(maxWidth: 40.0, maxHeight: 40.0),
),
),
Expanded(
child: Text(
title,
style: textStyle,
)),
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
'${channel.memberCount} members',
style: TextStyle(color: Colors.black.withOpacity(0.5)),
),
)
],
),
),
Container(
height: 1.0,
color: Color(0xffe6e6e6),
),
],
);
}),
);
}
}
example/lib/customize_channel_preview.dart
-1
View File
@@ -84,7 +84,6 @@ class ChannelListPage extends StatelessWidget {
channel: channel,
),
title: ChannelName(
channel: channel,
textStyle:
StreamChatTheme.of(context).channelPreviewTheme.title.copyWith(
color: Colors.black.withOpacity(opacity),
example/lib/group_info_screen.dart
+845
View File
@@ -0,0 +1,845 @@
import 'dart:async';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:jiffy/jiffy.dart';
import 'file:///Users/deven9852/Stream/stream-chat-flutter/example/lib/chat_info_screen.dart';
import 'package:stream_chat_flutter/src/option_list_tile.dart';
import 'package:stream_chat_flutter/src/stream_svg_icon.dart';
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
import 'main.dart';
class GroupInfoScreen extends StatefulWidget {
@override
_GroupInfoScreenState createState() => _GroupInfoScreenState();
}
class _GroupInfoScreenState extends State<GroupInfoScreen> {
Future _memberQueryFuture;
TextEditingController _nameController;
bool _userSearchMode = false;
TextEditingController _searchController;
bool _loading = false;
String _userNameQuery = '';
Timer _debounce;
Function modalSetStateCallback;
final FocusNode _focusNode = FocusNode();
bool namedChanged = false;
String changedName = '';
void _userNameListener() {
if (_debounce?.isActive ?? false) _debounce.cancel();
_debounce = Timer(const Duration(milliseconds: 350), () {
if (mounted && modalSetStateCallback != null) {
modalSetStateCallback(() {
_userNameQuery = _searchController.text;
});
}
});
}
@override
void initState() {
super.initState();
var channel = StreamChannel.of(context);
_memberQueryFuture = channel.channel.queryMembers(
filter: {},
);
_nameController = TextEditingController.fromValue(
TextEditingValue(text: channel.channel.extraData['name'] ?? ''));
_searchController = TextEditingController()..addListener(_userNameListener);
_nameController.addListener(() {
setState(() {});
});
}
@override
Widget build(BuildContext context) {
var channel = StreamChannel.of(context);
return Scaffold(
backgroundColor: Color(0xffdbdbdb),
appBar: AppBar(
elevation: 1.0,
toolbarHeight: 56.0,
backgroundColor: Colors.white,
leading: InkWell(
onTap: () {
Navigator.pop(context);
},
child: Padding(
padding: const EdgeInsets.only(left: 12.0),
child: StreamSvgIcon.left(),
),
),
leadingWidth: 36.0,
title: Column(
children: [
FutureBuilder<QueryMembersResponse>(
future: _memberQueryFuture,
builder: (context, snapshot) {
return Text(
_getChannelName(MediaQuery.of(context).size.width,
members: snapshot.data?.members
?.map((e) => e.user)
?.toList()),
style: TextStyle(color: Colors.black),
maxLines: 1,
overflow: TextOverflow.ellipsis,
);
}),
SizedBox(
height: 3.0,
),
FutureBuilder<QueryMembersResponse>(
future: _memberQueryFuture,
builder: (context, snapshot) {
return Text(
'${channel.channel.memberCount} Members, ${snapshot?.data?.members?.where((e) => e.user.online)?.length ?? 0} Online',
style: TextStyle(
color: Colors.black.withOpacity(0.5), fontSize: 12.0),
);
}),
],
),
centerTitle: true,
actions: [
StreamNeumorphicButton(
child: InkWell(
onTap: () {
_buildAddUserModal(context);
},
child: Padding(
padding: const EdgeInsets.all(8.0),
child: StreamSvgIcon.userAdd(
color: StreamChatTheme.of(context).accentColor),
),
),
),
],
),
body: ListView(
children: [
_buildMembers(),
Container(
height: 8.0,
color: Color(0xffdbdbdb),
),
_buildNameTile(),
_buildOptionListTiles(),
],
),
);
}
Widget _buildMembers() {
var channel = StreamChannel.of(context);
return FutureBuilder<QueryMembersResponse>(
builder: (context, snapshot) {
if (snapshot.data == null) {
return Center(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: CircularProgressIndicator(),
),
);
}
return ListView.builder(
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
itemCount: snapshot.data.members.length,
itemBuilder: (context, position) {
return Material(
child: InkWell(
onTap: () {
var userMember = snapshot.data.members.firstWhere(
(e) => e.user.id == StreamChat.of(context).user.id);
_showUserInfoModal(snapshot.data.members[position].user,
userMember.role == 'owner');
},
child: Container(
height: 65.0,
child: Column(
children: [
Row(
children: [
Padding(
padding: const EdgeInsets.symmetric(
horizontal: 8.0, vertical: 12.0),
child: UserAvatar(
user: snapshot.data.members[position].user,
constraints: BoxConstraints(
maxHeight: 40.0, maxWidth: 40.0),
),
),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
snapshot.data.members[position].user.name,
style: TextStyle(fontWeight: FontWeight.bold),
),
SizedBox(
height: 1.0,
),
Text(
_getLastSeen(
snapshot.data.members[position].user),
style: TextStyle(
color: Colors.black.withOpacity(0.5)),
),
],
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
snapshot.data.members[position].role == 'owner'
? 'Owner'
: '',
style: TextStyle(
color: Colors.black.withOpacity(0.5)),
),
),
],
),
Container(
height: 1.0,
color: Color(0xffdbdbdb),
),
],
),
),
),
color: Colors.white,
);
},
);
},
future: _memberQueryFuture,
);
}
Widget _buildNameTile() {
var channel = StreamChannel.of(context).channel;
var channelName = channel.extraData['name'] ?? '';
return Material(
color: Colors.white,
child: Container(
height: 56.0,
alignment: Alignment.center,
child: Row(
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
'NAME',
style: TextStyle(
color: Colors.black.withOpacity(0.5), fontSize: 12.0),
),
),
SizedBox(
width: 9.0,
),
Expanded(
child: TextField(
focusNode: _focusNode,
controller: _nameController,
cursorColor: Colors.black,
decoration: InputDecoration.collapsed(
hintText: 'Add a group name',
hintStyle: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.black.withOpacity(0.5),
),
),
style: TextStyle(
fontWeight: FontWeight.bold,
),
),
),
if ((channelName == null) ||
(channelName != _nameController.text.trim()))
Row(
mainAxisSize: MainAxisSize.min,
children: [
InkWell(
child: StreamSvgIcon.close_small(),
onTap: () {
setState(() {
_nameController.text =
_getChannelName(MediaQuery.of(context).size.width);
_focusNode.unfocus();
});
},
),
Padding(
padding: const EdgeInsets.only(right: 16.0, left: 8.0),
child: InkWell(
child: StreamSvgIcon.check(
color: StreamChatTheme.of(context).accentColor,
size: 24.0,
),
onTap: () {
StreamChannel.of(context).channel.update({
'name': _nameController.text.trim(),
}).then((value) {
setState(() {
_focusNode.unfocus();
namedChanged = true;
changedName = _nameController.text.trim();
});
}).catchError((err) {
setState(() {
_nameController.text = channelName;
_focusNode.unfocus();
});
});
},
),
),
],
),
],
),
),
);
}
Widget _buildOptionListTiles() {
var channel = StreamChannel.of(context);
return Column(
children: [
// OptionListTile(
// title: 'Notifications',
// leading: StreamSvgIcon.Icon_notification(
// size: 24.0,
// color: Colors.black.withOpacity(0.5),
// ),
// trailing: CupertinoSwitch(
// value: true,
// onChanged: (val) {},
// ),
// onTap: () {},
// ),
StreamBuilder<bool>(
stream: StreamChannel.of(context).channel.isMutedStream,
builder: (context, snapshot) {
return OptionListTile(
title: 'Mute group',
leading: StreamSvgIcon.mute(
size: 23.0,
color: Colors.black.withOpacity(0.5),
),
trailing: snapshot.data == null
? CircularProgressIndicator()
: CupertinoSwitch(
value: snapshot.data,
onChanged: (val) {
if (snapshot.data) {
channel.channel.unmute();
} else {
channel.channel.mute();
}
},
),
onTap: () {},
);
}),
OptionListTile(
title: 'Photos & Videos',
leading: StreamSvgIcon.pictures(
size: 32.0,
color: Colors.black.withOpacity(0.5),
),
trailing: StreamSvgIcon.right(),
onTap: () {
var channel = StreamChannel.of(context).channel;
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => StreamChannel(
channel: channel,
child: MessageSearchBloc(
child: ChannelMediaDisplayScreen(
sortOptions: [
SortOption(
'created_at',
direction: SortOption.ASC,
),
],
paginationParams: PaginationParams(limit: 20),
),
),
),
),
);
},
),
OptionListTile(
title: 'Files',
leading: StreamSvgIcon.files(
size: 32.0,
color: Colors.black.withOpacity(0.5),
),
trailing: StreamSvgIcon.right(),
onTap: () {
var channel = StreamChannel.of(context).channel;
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => StreamChannel(
channel: channel,
child: MessageSearchBloc(
child: ChannelFileDisplayScreen(
sortOptions: [
SortOption(
'created_at',
direction: SortOption.ASC,
),
],
paginationParams: PaginationParams(limit: 20),
),
),
),
),
);
},
),
if (!channel.channel.isDistinct)
OptionListTile(
title: 'Leave Group',
leading: StreamSvgIcon.userRemove(
size: 24.0,
color: Colors.black.withOpacity(0.5),
),
trailing: Container(
height: 24.0,
width: 24.0,
),
onTap: () async {
await channel.channel
.removeMembers([StreamChat.of(context).user.id]);
Navigator.pop(context);
Navigator.pop(context);
},
),
],
);
}
void _buildAddUserModal(context) {
var channel = StreamChannel.of(context).channel;
showDialog(
context: context,
builder: (context) {
return StatefulBuilder(builder: (context, modalSetState) {
modalSetStateCallback = modalSetState;
return Padding(
padding: EdgeInsets.only(top: 16.0, left: 8.0, right: 8.0),
child: Material(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(16.0),
topRight: Radius.circular(16.0),
),
clipBehavior: Clip.antiAlias,
child: Scaffold(
body: UsersBloc(
child: Column(
children: [
_buildTextInputSection(modalSetState),
Expanded(
child: UserListView(
selectedUsers: {},
onUserTap: (user, _) async {
_searchController.clear();
await channel.addMembers([user.id]);
Navigator.pop(context);
_memberQueryFuture = channel.queryMembers(
filter: {},
);
setState(() {});
},
crossAxisCount: 4,
pagination: PaginationParams(
limit: 25,
),
filter: {
if (_searchController.text.isNotEmpty)
'name': {
r'$autocomplete': _userNameQuery,
},
'id': {
r'$ne': StreamChat.of(context).user.id,
},
},
sort: [
SortOption(
'name',
direction: 1,
),
],
emptyBuilder: (_) {
return LayoutBuilder(
builder: (context, viewportConstraints) {
return SingleChildScrollView(
physics: AlwaysScrollableScrollPhysics(),
child: ConstrainedBox(
constraints: BoxConstraints(
minHeight: viewportConstraints.maxHeight,
),
child: Center(
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(24),
child: StreamSvgIcon.search(
size: 96,
color: Colors.grey,
),
),
Text(
'No user matches these keywords...'),
],
),
),
),
);
},
);
},
),
),
],
),
),
),
),
);
});
},
);
}
Widget _buildTextInputSection(modalSetState) {
return Column(
children: [
SizedBox(
height: 16.0,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
SizedBox(
width: 16.0,
),
Expanded(
child: TextField(
controller: _searchController,
cursorColor: Colors.black,
autofocus: true,
decoration: InputDecoration(
isDense: true,
prefixIconConstraints: BoxConstraints.tight(Size(36.0, 44.0)),
prefixIcon: Padding(
padding: const EdgeInsets.symmetric(
vertical: 2.0, horizontal: 6.0),
child: StreamSvgIcon.search(
color: Colors.black,
),
),
hintText: 'Search',
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(32.0),
borderSide:
BorderSide(color: Colors.black.withOpacity(0.08)),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(32.0),
borderSide:
BorderSide(color: Colors.black.withOpacity(0.08)),
),
contentPadding: EdgeInsets.zero,
),
),
),
SizedBox(
width: 8.0,
),
IconButton(
icon: StreamSvgIcon.close_small(
color: Colors.black.withOpacity(0.5),
),
onPressed: () {
Navigator.pop(context);
},
)
],
),
],
);
}
void _showUserInfoModal(User user, bool isUserAdmin) {
var channel = StreamChannel.of(context).channel;
showModalBottomSheet(
context: context,
clipBehavior: Clip.antiAlias,
isScrollControlled: true,
builder: (context) {
return StreamChannel(
channel: channel,
child: Material(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
SizedBox(
height: 24.0,
),
Center(
child: Text(
user.name,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
),
),
),
SizedBox(
height: 5.0,
),
_buildConnectedTitleState(user),
Center(
child: Padding(
padding: const EdgeInsets.all(16.0),
child: UserAvatar(
user: user,
constraints: BoxConstraints(
maxHeight: 64.0,
minHeight: 64.0,
),
borderRadius: BorderRadius.circular(32.0),
),
),
),
if (StreamChat.of(context).user.id != user.id)
_buildModalListTile(
StreamSvgIcon.user(
color: Color(0xff7a7a7a),
size: 24.0,
),
'View info', () async {
var client = StreamChat.of(context).client;
var c = client.channel('messaging', extraData: {
'members': [
user.id,
StreamChat.of(context).user.id,
],
});
await c.watch();
await Navigator.push(
context,
MaterialPageRoute(
builder: (context) => StreamChannel(
channel: c,
child: ChatInfoScreen(
user: user,
),
),
),
);
}),
_buildModalListTile(
StreamSvgIcon.message(
color: Color(0xff7a7a7a),
size: 24.0,
),
'Message', () async {
var client = StreamChat.of(context).client;
var c = client.channel('messaging', extraData: {
'members': [
user.id,
StreamChat.of(context).user.id,
],
});
await c.watch();
await Navigator.push(
context,
MaterialPageRoute(
builder: (context) => StreamChannel(
channel: c,
child: ChannelPage(),
),
),
);
}),
if (!channel.isDistinct &&
StreamChat.of(context).user.id != user.id &&
isUserAdmin)
_buildModalListTile(
StreamSvgIcon.userAdd(
color: Color(0xff7a7a7a),
size: 24.0,
),
'Make Owner', () {
// TODO: I have no clue how to make someone an owner
}),
if (!channel.isDistinct &&
StreamChat.of(context).user.id != user.id &&
isUserAdmin)
_buildModalListTile(
StreamSvgIcon.userRemove(
color: Colors.red,
size: 24.0,
),
'Remove From Group', () async {
await channel.removeMembers([user.id]);
Navigator.pop(context);
_memberQueryFuture = channel.queryMembers(
filter: {},
);
}, color: Colors.red),
_buildModalListTile(
StreamSvgIcon.close_small(
color: Color(0xff7a7a7a),
size: 24.0,
),
'Cancel', () {
Navigator.pop(context);
}),
],
),
),
);
},
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(16.0),
topRight: Radius.circular(16.0),
),
),
);
}
void _showRemoveUserModal(User user) {}
Widget _buildConnectedTitleState(User user) {
var alternativeWidget;
final otherMember = user;
if (otherMember != null) {
if (otherMember.online) {
alternativeWidget = Text(
'Online',
style: TextStyle(color: Colors.black.withOpacity(0.5)),
);
} else {
alternativeWidget = Text(
'Last seen ${Jiffy(otherMember.lastActive).fromNow()}',
style: TextStyle(color: Colors.black.withOpacity(0.5)),
);
}
}
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
if (user.online)
Material(
type: MaterialType.circle,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 8.0),
constraints: BoxConstraints.tightFor(
width: 28,
height: 12,
),
child: Material(
shape: CircleBorder(),
color: Color(0xff20E070),
),
),
color: Colors.white,
),
alternativeWidget,
],
);
}
Widget _buildModalListTile(Widget leading, String title, VoidCallback onTap,
{Color color = Colors.black}) {
return Material(
child: InkWell(
onTap: onTap,
child: Column(
children: [
Container(
height: 1.0,
color: Color(0xffdbdbdb),
),
Container(
height: 64.0,
child: Row(
children: [
Padding(
padding: const EdgeInsets.all(16.0),
child: leading,
),
Expanded(
child: Text(
title,
style: TextStyle(color: color, fontWeight: FontWeight.bold),
))
],
),
),
],
),
));
}
String _getChannelName(double width, {List<User> members}) {
if (namedChanged) {
return changedName;
}
if (StreamChannel.of(context).channel.extraData['name'] == null &&
members != null) {
return '${members[0].name} & ${members.length - 1} others';
}
return StreamChannel.of(context).channel.extraData['name'] ?? '';
}
String _getLastSeen(User user) {
if (user.online) {
return 'Online';
} else {
return 'Last seen ${Jiffy(user.lastActive).fromNow()}';
}
}
}
example/lib/main.dart
+40
View File
@@ -1,6 +1,8 @@
import 'dart:io';
import 'package:example/choose_user_page.dart';
import 'package:example/chat_info_screen.dart';
import 'package:example/group_info_screen.dart';
import 'package:example/new_chat_screen.dart';
import 'package:example/new_group_chat_screen.dart';
import 'package:flutter/cupertino.dart';
@@ -426,6 +428,44 @@ class ChannelPage extends StatelessWidget {
backgroundColor: Color.fromRGBO(252, 252, 252, 1),
appBar: ChannelHeader(
showTypingIndicator: false,
onImageTap: () async {
var channel = StreamChannel.of(context).channel;
if (channel.memberCount == 2 && channel.isDistinct) {
final currentUser = StreamChat.of(context).user;
final otherUser = channel.state.members.firstWhere(
(element) => element.user.id != currentUser.id,
orElse: () => null,
);
if (otherUser != null) {
final pop = await Navigator.push(
context,
MaterialPageRoute(
builder: (context) => StreamChannel(
child: ChatInfoScreen(
user: otherUser.user,
),
channel: channel,
),
),
);
if (pop == true) {
Navigator.pop(context);
}
}
} else {
await Navigator.push(
context,
MaterialPageRoute(
builder: (context) => StreamChannel(
child: GroupInfoScreen(),
channel: channel,
),
),
);
}
},
),
body: Column(
children: <Widget>[
example/lib/routes/app_routes.dart
+16
View File
@@ -7,6 +7,8 @@ import '../main.dart';
import '../group_chat_details_screen.dart';
import '../new_group_chat_screen.dart';
import '../new_chat_screen.dart';
import '../chat_info_screen.dart';
import '../group_info_screen.dart';
class AppRoutes {
/// Add entry for new route here
@@ -59,6 +61,20 @@ class AppRoutes {
selectedUsers: args,
);
});
case Routes.CHAT_INFO_SCREEN:
return MaterialPageRoute(
settings: const RouteSettings(name: Routes.CHAT_INFO_SCREEN),
builder: (_) {
return ChatInfoScreen(
user: args,
);
});
case Routes.GROUP_INFO_SCREEN:
return MaterialPageRoute(
settings: const RouteSettings(name: Routes.GROUP_INFO_SCREEN),
builder: (_) {
return GroupInfoScreen();
});
}
}
}
example/lib/routes/routes.dart
+2
View File
@@ -7,4 +7,6 @@ class Routes {
static const String NEW_CHAT = '/new_chat';
static const String NEW_GROUP_CHAT = '/new_group_chat';
static const String NEW_GROUP_CHAT_DETAILS = '/new_group_chat_details';
static const String CHAT_INFO_SCREEN = '/chat_info_screen';
static const String GROUP_INFO_SCREEN = '/group_info_screen';
}