diff --git a/example/ios/Podfile.lock b/example/ios/Podfile.lock index 131e8aec..29b026b2 100644 --- a/example/ios/Podfile.lock +++ b/example/ios/Podfile.lock @@ -284,4 +284,4 @@ SPEC CHECKSUMS: PODFILE CHECKSUM: eb001256612a59f8f9e4d083ad8b9671e69dd184 -COCOAPODS: 1.10.0.rc.1 +COCOAPODS: 1.10.0 diff --git a/example/lib/advanced_options_page.dart b/example/lib/advanced_options_page.dart index c84ef58e..212a15a8 100644 --- a/example/lib/advanced_options_page.dart +++ b/example/lib/advanced_options_page.dart @@ -44,8 +44,7 @@ class _AdvancedOptionsPageState extends State { ), ), leading: IconButton( - icon: Icon( - StreamIcons.left, + icon: StreamSvgIcon.left( color: Colors.black, ), onPressed: () { diff --git a/example/lib/chips_input_text_field.dart b/example/lib/chips_input_text_field.dart index 857782fe..26f2d2b5 100644 --- a/example/lib/chips_input_text_field.dart +++ b/example/lib/chips_input_text_field.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import 'package:stream_chat_flutter/src/stream_icons.dart'; +import 'package:stream_chat_flutter/stream_chat_flutter.dart'; typedef ChipBuilder = Widget Function(BuildContext context, T chip); typedef OnChipAdded = void Function(T chip); @@ -124,13 +124,15 @@ class ChipInputTextFieldState extends State> { Align( alignment: Alignment.bottomCenter, child: IconButton( - icon: Icon( - _chips.isEmpty - ? StreamIcons.user - : StreamIcons.user_add, - color: Colors.black.withOpacity(0.5), - size: 24, - ), + icon: _chips.isEmpty + ? StreamSvgIcon.user( + color: Colors.black.withOpacity(0.5), + size: 24, + ) + : StreamSvgIcon.userAdd( + color: Colors.black.withOpacity(0.5), + size: 24, + ), onPressed: !_pauseItemAddition ? null : resumeItemAddition, alignment: Alignment.topRight, diff --git a/example/lib/choose_user_page.dart b/example/lib/choose_user_page.dart index 4583a2a6..f1a53773 100644 --- a/example/lib/choose_user_page.dart +++ b/example/lib/choose_user_page.dart @@ -196,8 +196,7 @@ class ChooseUserPage extends StatelessWidget { ); }, leading: CircleAvatar( - child: Icon( - StreamIcons.settings, + child: StreamSvgIcon.settings( color: Colors.black, ), backgroundColor: diff --git a/example/lib/group_chat_details_screen.dart b/example/lib/group_chat_details_screen.dart index 0aba4578..050ea993 100644 --- a/example/lib/group_chat_details_screen.dart +++ b/example/lib/group_chat_details_screen.dart @@ -3,7 +3,6 @@ import 'package:stream_chat_flutter/stream_chat_flutter.dart'; import 'package:uuid/uuid.dart'; import 'main.dart'; -import 'neumorphic_button.dart'; class GroupChatDetailsScreen extends StatefulWidget { final List selectedUsers; @@ -53,173 +52,169 @@ class _GroupChatDetailsScreenState extends State { @override Widget build(BuildContext context) { - return WillPopScope( - onWillPop: () async { - Navigator.pop(context, _selectedUsers); - return false; - }, - child: Scaffold( - backgroundColor: Color.fromRGBO(252, 252, 252, 1), - appBar: AppBar( - elevation: 1, - backgroundColor: Colors.white, - leading: const StreamBackButton(), - title: Text( - 'Name of Group Chat', - style: TextStyle( - color: Colors.black, - fontSize: 16, - ), + return Scaffold( + backgroundColor: Color.fromRGBO(252, 252, 252, 1), + appBar: AppBar( + elevation: 1, + backgroundColor: Colors.white, + leading: const StreamBackButton(), + title: Text( + 'Name of Group Chat', + style: TextStyle( + color: Colors.black, + fontSize: 16, ), - centerTitle: true, - bottom: PreferredSize( - preferredSize: Size.fromHeight(kToolbarHeight), - child: Padding( - padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 16), - child: Row( - children: [ - Text( - 'NAME', - style: TextStyle( - fontSize: 12, - color: Colors.black.withOpacity(0.5), - ), - ), - SizedBox(width: 16), - Expanded( - child: TextField( - controller: _groupNameController, - decoration: InputDecoration( - isDense: true, - border: InputBorder.none, - focusedBorder: InputBorder.none, - enabledBorder: InputBorder.none, - errorBorder: InputBorder.none, - disabledBorder: InputBorder.none, - contentPadding: const EdgeInsets.all(0), - hintText: 'Choose a group chat name', - hintStyle: TextStyle( - fontSize: 14, color: Colors.black.withOpacity(.5)), - ), - ), - ), - ], - ), - ), - ), - actions: [ - NeumorphicButton( - child: IconButton( - padding: const EdgeInsets.all(0), - icon: Icon(StreamIcons.check), - color: Color(0xFF006CFF), - onPressed: _isGroupNameEmpty - ? null - : () async { - final groupName = _groupNameController.text; - final client = StreamChat.of(context).client; - final channel = client - .channel('messaging', id: Uuid().v4(), extraData: { - 'members': [ - client.state.user.id, - ..._selectedUsers.map((e) => e.id), - ], - 'name': groupName, - }); - await channel.watch(); - Navigator.of(context) - ..pop() - ..pushReplacement( - MaterialPageRoute( - builder: (context) { - return StreamChannel( - child: ChannelPage(), - channel: channel, - ); - }, - ), - ); - }, - ), - ), - ], ), - body: Column( - children: [ - Container( - width: double.maxFinite, - color: Colors.grey.shade50, - child: Padding( - padding: const EdgeInsets.symmetric( - vertical: 8, - horizontal: 8, - ), - child: Text( - '$_totalUsers ${_totalUsers > 1 ? 'Members' : 'Member'}', + centerTitle: true, + bottom: PreferredSize( + preferredSize: Size.fromHeight(kToolbarHeight), + child: Padding( + padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 16), + child: Row( + children: [ + Text( + 'NAME', style: TextStyle( - fontWeight: FontWeight.w500, + fontSize: 12, + color: Colors.black.withOpacity(0.5), ), ), + SizedBox(width: 16), + Expanded( + child: TextField( + controller: _groupNameController, + decoration: InputDecoration( + isDense: true, + border: InputBorder.none, + focusedBorder: InputBorder.none, + enabledBorder: InputBorder.none, + errorBorder: InputBorder.none, + disabledBorder: InputBorder.none, + contentPadding: const EdgeInsets.all(0), + hintText: 'Choose a group chat name', + hintStyle: TextStyle( + fontSize: 14, color: Colors.black.withOpacity(.5)), + ), + ), + ), + ], + ), + ), + ), + actions: [ + NeumorphicButton( + child: IconButton( + padding: const EdgeInsets.all(0), + icon: StreamSvgIcon.check( + size: 24, + color: _isGroupNameEmpty ? Colors.grey : Color(0xFF006CFF), ), + onPressed: _isGroupNameEmpty + ? null + : () async { + final groupName = _groupNameController.text; + final client = StreamChat.of(context).client; + final channel = client + .channel('messaging', id: Uuid().v4(), extraData: { + 'members': [ + client.state.user.id, + ..._selectedUsers.map((e) => e.id), + ], + 'name': groupName, + }); + await channel.watch(); + Navigator.of(context) + ..pop() + ..pushReplacement( + MaterialPageRoute( + builder: (context) { + return StreamChannel( + child: ChannelPage(), + channel: channel, + ); + }, + ), + ); + }, ), - Expanded( - child: ListView.separated( - itemCount: _selectedUsers.length + 1, - separatorBuilder: (_, __) => Container( - height: 1, - color: Theme.of(context).brightness == Brightness.dark - ? Colors.white.withOpacity(0.1) - : Colors.black.withOpacity(0.1), + ), + ], + ), + body: Column( + children: [ + Container( + width: double.maxFinite, + color: Colors.grey.shade50, + child: Padding( + padding: const EdgeInsets.symmetric( + vertical: 8, + horizontal: 8, + ), + child: Text( + '$_totalUsers ${_totalUsers > 1 ? 'Members' : 'Member'}', + style: TextStyle( + fontWeight: FontWeight.w500, ), - itemBuilder: (_, index) { - if (index == _selectedUsers.length) { - return Container( - height: 1, - color: Theme.of(context).brightness == Brightness.dark - ? Colors.white.withOpacity(0.1) - : Colors.black.withOpacity(0.1), - ); - } - final user = _selectedUsers[index]; - return ListTile( - key: ObjectKey(user), - leading: UserAvatar( - user: user, - constraints: BoxConstraints.tightFor( - width: 40, - height: 40, - ), - ), - title: Text( - user.name, - style: TextStyle(fontWeight: FontWeight.bold), - ), - contentPadding: const EdgeInsets.symmetric( - horizontal: 12, - vertical: 8, - ), - trailing: IconButton( - icon: Icon( - Icons.clear_rounded, - color: Colors.black, - ), - padding: const EdgeInsets.all(0), - splashRadius: 24, - onPressed: () { - setState(() { - _selectedUsers.remove(user); - }); - if (_selectedUsers.isEmpty) { - Navigator.pop(context, _selectedUsers); - } - }, - ), - ); - }, ), ), - ], - ), + ), + Expanded( + child: ListView.separated( + itemCount: _selectedUsers.length + 1, + separatorBuilder: (_, __) => Container( + height: 1, + color: Theme.of(context).brightness == Brightness.dark + ? Colors.white.withOpacity(0.1) + : Colors.black.withOpacity(0.1), + ), + itemBuilder: (_, index) { + if (index == _selectedUsers.length) { + return Container( + height: 1, + color: Theme.of(context).brightness == Brightness.dark + ? Colors.white.withOpacity(0.1) + : Colors.black.withOpacity(0.1), + ); + } + final user = _selectedUsers[index]; + return ListTile( + key: ObjectKey(user), + leading: UserAvatar( + user: user, + constraints: BoxConstraints.tightFor( + width: 40, + height: 40, + ), + ), + title: Text( + user.name, + style: TextStyle(fontWeight: FontWeight.bold), + ), + contentPadding: const EdgeInsets.symmetric( + horizontal: 12, + vertical: 8, + ), + trailing: IconButton( + icon: Icon( + Icons.clear_rounded, + color: Colors.black, + ), + padding: const EdgeInsets.all(0), + splashRadius: 24, + onPressed: () { + setState(() { + _selectedUsers.remove(user); + }); + if (_selectedUsers.isEmpty) { + Navigator.pop(context); + } + }, + ), + ); + }, + ), + ), + ], ), ); } diff --git a/example/lib/main.dart b/example/lib/main.dart index a7d5e473..d2be225a 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -69,12 +69,14 @@ class ChannelListPage extends StatelessWidget { Widget build(BuildContext context) { final user = StreamChat.of(context).user; return Scaffold( - appBar: AppBar( - backgroundColor: Colors.white, - title: Text( - 'Stream Chat', - style: TextStyle(color: Colors.black), - ), + appBar: ChannelListHeader( + onNewChatButtonTap: () { + Navigator.of(context).push( + MaterialPageRoute( + builder: (context) => NewChatScreen(), + ), + ); + }, ), drawer: _buildDrawer(context, user), drawerEdgeDragWidth: 50, @@ -141,7 +143,9 @@ class ChannelListPage extends StatelessWidget { ), ), ListTile( - leading: Icon(StreamIcons.edit), + leading: StreamSvgIcon.penWrite( + color: Colors.black.withOpacity(.5), + ), onTap: () { Navigator.of(context) ..pop() @@ -157,7 +161,9 @@ class ChannelListPage extends StatelessWidget { ), ), ListTile( - leading: Icon(StreamIcons.group), + leading: StreamSvgIcon.contacts( + color: Colors.black.withOpacity(.5), + ), onTap: () { Navigator.of(context) ..pop() @@ -189,7 +195,9 @@ class ChannelListPage extends StatelessWidget { ), ); }, - leading: Icon(StreamIcons.user), + leading: StreamSvgIcon.user( + color: Colors.black.withOpacity(.5), + ), title: Text( 'Sign out', style: TextStyle( diff --git a/example/lib/new_chat_screen.dart b/example/lib/new_chat_screen.dart index 9ec2ca7e..690e831f 100644 --- a/example/lib/new_chat_screen.dart +++ b/example/lib/new_chat_screen.dart @@ -5,7 +5,6 @@ import 'package:stream_chat_flutter/stream_chat_flutter.dart'; import 'chips_input_text_field.dart'; import 'main.dart'; -import 'neumorphic_button.dart'; import 'new_group_chat_screen.dart'; class NewChatScreen extends StatefulWidget { @@ -164,8 +163,7 @@ class _NewChatScreenState extends State { ), ), Positioned( - child: Icon( - StreamIcons.close, + child: StreamSvgIcon.close( color: Colors.white, ), ), @@ -193,10 +191,12 @@ class _NewChatScreenState extends State { padding: const EdgeInsets.symmetric(vertical: 8), child: Row( children: [ - NeumorphicButton( - child: Icon( - StreamIcons.group, - color: Color(0xFF006CFF), + StreamNeumorphicButton( + child: Center( + child: StreamSvgIcon.contacts( + color: Color(0xFF006CFF), + size: 24, + ), ), ), SizedBox(width: 8), @@ -289,8 +289,7 @@ class _NewChatScreenState extends State { children: [ Padding( padding: const EdgeInsets.all(24), - child: Icon( - StreamIcons.search, + child: StreamSvgIcon.search( size: 96, color: Colors.grey, ), diff --git a/example/lib/new_group_chat_screen.dart b/example/lib/new_group_chat_screen.dart index f9cf1cba..003aa431 100644 --- a/example/lib/new_group_chat_screen.dart +++ b/example/lib/new_group_chat_screen.dart @@ -47,10 +47,12 @@ class _NewGroupChatScreenState extends State { super.dispose(); } + @override Widget build(BuildContext context) { return SafeArea( child: UsersBloc( child: Scaffold( + backgroundColor: Color.fromRGBO(252, 252, 252, 1), body: NestedScrollView( floatHeaderSlivers: true, headerSliverBuilder: @@ -74,8 +76,7 @@ class _NewGroupChatScreenState extends State { actions: [ if (_selectedUsers.isNotEmpty) IconButton( - icon: Icon( - StreamIcons.arrow_right, + icon: StreamSvgIcon.right( color: Color(0xFF006CFF), ), onPressed: () async { @@ -116,8 +117,7 @@ class _NewGroupChatScreenState extends State { child: TextField( controller: _controller, decoration: InputDecoration( - prefixIcon: Icon( - StreamIcons.search, + prefixIcon: StreamSvgIcon.search( color: Colors.black, size: 24, ), @@ -181,8 +181,8 @@ class _NewGroupChatScreenState extends State { ), child: Padding( padding: const EdgeInsets.all(0.0), - child: Icon( - StreamIcons.close, + child: StreamSvgIcon.close( + color: Colors.black, size: 24, ), ), @@ -288,8 +288,7 @@ class _NewGroupChatScreenState extends State { children: [ Padding( padding: const EdgeInsets.all(24), - child: Icon( - StreamIcons.search, + child: StreamSvgIcon.search( size: 96, color: Colors.grey, ), diff --git a/example/pubspec.yaml b/example/pubspec.yaml index e5daa043..43eb867e 100644 --- a/example/pubspec.yaml +++ b/example/pubspec.yaml @@ -1,6 +1,6 @@ name: example description: A new Flutter project. -version: 1.0.66+68 +version: 1.0.72+74 environment: sdk: ">=2.2.2 <3.0.0" diff --git a/fonts/stream-icons.ttf b/fonts/stream-icons.ttf deleted file mode 100644 index 80660da4..00000000 Binary files a/fonts/stream-icons.ttf and /dev/null differ diff --git a/images/placeholder.png b/images/placeholder.png new file mode 100644 index 00000000..deca8474 Binary files /dev/null and b/images/placeholder.png differ diff --git a/lib/src/back_button.dart b/lib/src/back_button.dart index 303ad8a9..10b177d2 100644 --- a/lib/src/back_button.dart +++ b/lib/src/back_button.dart @@ -1,18 +1,15 @@ import 'package:flutter/material.dart'; -import 'package:stream_chat_flutter/src/stream_icons.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; import 'package:stream_chat_flutter/src/unread_indicator.dart'; -import 'package:stream_chat_flutter/stream_chat_flutter.dart'; class StreamBackButton extends StatelessWidget { const StreamBackButton({ Key key, this.onPressed, - this.icon = Icons.arrow_back_ios_outlined, this.showUnreads = false, }) : super(key: key); final VoidCallback onPressed; - final IconData icon; final bool showUnreads; @override @@ -36,8 +33,7 @@ class StreamBackButton extends StatelessWidget { Navigator.maybePop(context); } }, - child: Icon( - icon ?? StreamIcons.left, + child: StreamSvgIcon.left( size: 24, color: Theme.of(context).brightness == Brightness.dark ? Colors.white diff --git a/lib/src/channel_bottom_sheet.dart b/lib/src/channel_bottom_sheet.dart index 187fc6a9..c0e32509 100644 --- a/lib/src/channel_bottom_sheet.dart +++ b/lib/src/channel_bottom_sheet.dart @@ -1,7 +1,6 @@ -import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:stream_chat/stream_chat.dart'; -import 'package:stream_chat_flutter/src/stream_icons.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; import 'package:stream_chat_flutter/src/utils.dart'; import 'channel_info.dart'; @@ -73,8 +72,7 @@ class ChannelBottomSheet extends StatelessWidget { initialData: channel.isMuted, builder: (context, snapshot) { return ListTile( - leading: Icon( - StreamIcons.mute, + leading: StreamSvgIcon.mute( size: 22, color: StreamChatTheme.of(context).primaryIconTheme.color, ), @@ -94,8 +92,7 @@ class ChannelBottomSheet extends StatelessWidget { Divider(), if (channel.isGroup && !channel.isDistinct) ListTile( - leading: Icon( - StreamIcons.user_minus, + leading: StreamSvgIcon.userRemove( size: 22, color: Colors.black, ), diff --git a/lib/src/channel_list_header.dart b/lib/src/channel_list_header.dart new file mode 100644 index 00000000..0a01733b --- /dev/null +++ b/lib/src/channel_list_header.dart @@ -0,0 +1,223 @@ +import 'dart:ui'; + +import 'package:flutter/material.dart'; +import 'package:flutter_svg/flutter_svg.dart'; +import 'package:stream_chat/stream_chat.dart'; +import 'package:stream_chat_flutter/src/stream_neumorphic_button.dart'; +import 'package:stream_chat_flutter/stream_chat_flutter.dart'; + +import 'stream_chat.dart'; + +typedef _TitleBuilder = Widget Function( + BuildContext context, + ConnectionStatus status, + Client client, +); + +/// +/// It shows the current [Client] status. +/// +/// ```dart +/// class MyApp extends StatelessWidget { +/// final Client client; +/// +/// MyApp(this.client); +/// +/// @override +/// Widget build(BuildContext context) { +/// return MaterialApp( +/// home: StreamChat( +/// client: client, +/// child: Scaffold( +/// appBar: ChannelListHeader(), +/// ), +/// ), +/// ); +/// } +/// } +/// ``` +/// +/// Usually you would use this widget as an [AppBar] inside a [Scaffold]. +/// However you can also use it as a normal widget. +/// +/// The widget by default uses the inherited [Client] to fetch information about the status. +/// However you can also pass your own [Client] if you don't have it in the widget tree. +/// +/// The widget components render the ui based on the first ancestor of type [StreamChatTheme] and on its [ChannelTheme.channelHeaderTheme] property. +/// Modify it to change the widget appearance. +class ChannelListHeader extends StatelessWidget implements PreferredSizeWidget { + /// Instantiates a ChannelListHeader + const ChannelListHeader({ + Key key, + this.client, + this.titleBuilder, + this.onUserAvatarTap, + this.onNewChatButtonTap, + }) : super(key: key); + + /// Pass this if you don't have a [Client] in your widget tree. + final Client client; + + /// Use this to build your own title as per different [ConnectionStatus] + final _TitleBuilder titleBuilder; + + /// Callback to call when pressing the user avatar button. + /// By default it calls Scaffold.of(context).openDrawer() + final Function(User) onUserAvatarTap; + + /// Callback to call when pressing the new chat button. + final VoidCallback onNewChatButtonTap; + + @override + Widget build(BuildContext context) { + final _client = client ?? StreamChat.of(context).client; + final user = _client.state.user; + return AppBar( + brightness: Theme.of(context).brightness, + elevation: 1, + backgroundColor: + StreamChatTheme.of(context).channelTheme.channelHeaderTheme.color, + centerTitle: true, + leading: Center( + child: UserAvatar( + user: user, + showOnlineStatus: false, + onTap: onUserAvatarTap ?? (_) => Scaffold.of(context).openDrawer(), + borderRadius: BorderRadius.circular(20), + constraints: BoxConstraints.tightFor( + height: 40, + width: 40, + ), + ), + ), + actions: [ + StreamNeumorphicButton( + child: IconButton( + icon: ValueListenableBuilder( + valueListenable: _client.wsConnectionStatus, + builder: (context, status, child) { + var color; + switch (status) { + case ConnectionStatus.connected: + color = Color(0xFF006CFF); + break; + case ConnectionStatus.connecting: + color = Colors.grey; + break; + case ConnectionStatus.disconnected: + color = Colors.grey; + break; + } + return SvgPicture.asset( + 'svgs/icon_pen_write.svg', + package: 'stream_chat_flutter', + width: 24.0, + height: 24.0, + color: color, + ); + }, + ), + onPressed: onNewChatButtonTap, + ), + ) + ], + title: ValueListenableBuilder( + valueListenable: _client.wsConnectionStatus, + builder: (context, status, child) { + if (titleBuilder != null) { + return titleBuilder(context, status, _client); + } + switch (status) { + case ConnectionStatus.connected: + return _buildConnectedTitleState(context); + case ConnectionStatus.connecting: + return _buildConnectingTitleState(context); + case ConnectionStatus.disconnected: + return _buildDisconnectedTitleState(context, _client); + default: + return Offstage(); + } + }, + ), + ); + } + + Widget _buildConnectedTitleState(BuildContext context) => Text( + 'Stream Chat', + style: StreamChatTheme.of(context) + .channelTheme + .channelHeaderTheme + .title + .copyWith( + fontSize: 16, + fontWeight: FontWeight.bold, + ), + ); + + Widget _buildConnectingTitleState(BuildContext context) { + return Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Container( + height: 16, + width: 16, + child: Center( + child: CircularProgressIndicator(), + ), + ), + SizedBox(width: 10), + Text( + 'Searching for Network', + style: StreamChatTheme.of(context) + .channelTheme + .channelHeaderTheme + .title + .copyWith( + fontSize: 16, + fontWeight: FontWeight.bold, + ), + ), + ], + ); + } + + Widget _buildDisconnectedTitleState(BuildContext context, Client client) { + return Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Text( + 'Offline...', + style: StreamChatTheme.of(context) + .channelTheme + .channelHeaderTheme + .title + .copyWith( + fontSize: 16, + fontWeight: FontWeight.bold, + ), + ), + TextButton( + onPressed: () async { + await client.disconnect(); + return client.connect(); + }, + child: Text( + 'Try Again', + style: StreamChatTheme.of(context) + .channelTheme + .channelHeaderTheme + .title + .copyWith( + fontSize: 16, + fontWeight: FontWeight.bold, + color: Color(0xFF006CFF), + ), + ), + ), + ], + ); + } + + @override + Size get preferredSize => Size.fromHeight(kToolbarHeight); +} diff --git a/lib/src/channel_list_view.dart b/lib/src/channel_list_view.dart index 9dae4213..bfd8e477 100644 --- a/lib/src/channel_list_view.dart +++ b/lib/src/channel_list_view.dart @@ -7,6 +7,7 @@ import 'package:flutter_slidable/flutter_slidable.dart'; import 'package:shimmer/shimmer.dart'; import 'package:stream_chat/stream_chat.dart'; import 'package:stream_chat_flutter/src/channels_bloc.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; import 'package:stream_chat_flutter/src/utils.dart'; import '../stream_chat_flutter.dart'; @@ -200,8 +201,7 @@ class _ChannelListViewState extends State children: [ Padding( padding: const EdgeInsets.all(8.0), - child: Icon( - StreamIcons.message, + child: StreamSvgIcon.message( size: 136, color: Color(0xffDBDBDB), ), @@ -517,7 +517,7 @@ class _ChannelListViewState extends State ), IconSlideAction( color: backgroundColor, - icon: StreamIcons.mute, + iconWidget: StreamSvgIcon.mute(), onTap: () async { if (!channel.isMuted) { await channel.mute(); @@ -529,7 +529,7 @@ class _ChannelListViewState extends State if (channel.isGroup && !channel.isDistinct) IconSlideAction( color: backgroundColor, - icon: StreamIcons.user_minus, + iconWidget: StreamSvgIcon.userRemove(), onTap: () async { final confirm = await showConfirmationDialog( context, diff --git a/lib/src/channel_preview.dart b/lib/src/channel_preview.dart index ba3090c2..3c9eeace 100644 --- a/lib/src/channel_preview.dart +++ b/lib/src/channel_preview.dart @@ -2,6 +2,7 @@ import 'package:flutter/material.dart'; import 'package:flutter/widgets.dart'; import 'package:jiffy/jiffy.dart'; import 'package:stream_chat/stream_chat.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; import '../stream_chat_flutter.dart'; import 'channel_name.dart'; @@ -152,8 +153,7 @@ class ChannelPreview extends StatelessWidget { return Row( crossAxisAlignment: CrossAxisAlignment.end, children: [ - Icon( - StreamIcons.mute, + StreamSvgIcon.mute( size: 16, ), Text( diff --git a/lib/src/giphy_attachment.dart b/lib/src/giphy_attachment.dart index df4708c5..7abf7057 100644 --- a/lib/src/giphy_attachment.dart +++ b/lib/src/giphy_attachment.dart @@ -1,6 +1,7 @@ import 'package:cached_network_image/cached_network_image.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; import '../stream_chat_flutter.dart'; import 'attachment_error.dart'; @@ -111,8 +112,7 @@ class GiphyAttachment extends StatelessWidget { ), child: Row( children: [ - Icon( - StreamIcons.lightning, + StreamSvgIcon.lightning( color: StreamChatTheme.of(context).accentColor, size: 16.0, ), @@ -144,8 +144,7 @@ class GiphyAttachment extends StatelessWidget { child: IconButton( padding: const EdgeInsets.all(0), constraints: BoxConstraints.tight(Size(32, 32)), - icon: Icon( - StreamIcons.left, + icon: StreamSvgIcon.left( size: 24.0, ), splashRadius: 16, @@ -172,8 +171,7 @@ class GiphyAttachment extends StatelessWidget { child: IconButton( padding: const EdgeInsets.all(0), constraints: BoxConstraints.tight(Size(32, 32)), - icon: Icon( - StreamIcons.right, + icon: StreamSvgIcon.right( size: 24.0, ), splashRadius: 16, @@ -253,8 +251,7 @@ class GiphyAttachment extends StatelessWidget { child: Row( mainAxisSize: MainAxisSize.min, children: [ - Icon( - StreamIcons.eye, + StreamSvgIcon.eye( color: Colors.black.withOpacity(0.5), size: 16.0, ), @@ -326,8 +323,7 @@ class GiphyAttachment extends StatelessWidget { ), child: Row( children: [ - Icon( - StreamIcons.lightning, + StreamSvgIcon.lightning( color: Colors.white, size: 16, ), diff --git a/lib/src/media_list_view.dart b/lib/src/media_list_view.dart index cd414fa9..e8735d69 100644 --- a/lib/src/media_list_view.dart +++ b/lib/src/media_list_view.dart @@ -1,8 +1,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:media_gallery/media_gallery.dart'; -import 'package:stream_chat_flutter/src/stream_icons.dart'; -import 'package:transparent_image/transparent_image.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; class MediaListView extends StatefulWidget { final List selectedIds; @@ -26,8 +25,10 @@ class _MediaListViewState extends State { return GridView.builder( itemCount: _media.length, controller: _scrollController, - gridDelegate: - SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 3), + gridDelegate: SliverGridDelegateWithFixedCrossAxisCount( + crossAxisCount: 3, + ), + cacheExtent: 1000, itemBuilder: ( context, position, @@ -42,7 +43,10 @@ class _MediaListViewState extends State { aspectRatio: 1.0, child: FadeInImage( fadeInDuration: Duration(milliseconds: 300), - placeholder: MemoryImage(kTransparentImage), + placeholder: AssetImage( + 'images/placeholder.png', + package: 'stream_chat_flutter', + ), image: MediaThumbnailProvider( media: media, highQuality: true, @@ -67,8 +71,7 @@ class _MediaListViewState extends State { child: CircleAvatar( radius: 12, backgroundColor: Colors.white, - child: Icon( - StreamIcons.check, + child: StreamSvgIcon.check( size: 24, color: Colors.black, ), diff --git a/lib/src/message_actions_modal.dart b/lib/src/message_actions_modal.dart index 16c48e25..1967cd2b 100644 --- a/lib/src/message_actions_modal.dart +++ b/lib/src/message_actions_modal.dart @@ -6,7 +6,7 @@ import 'package:flutter/services.dart'; import 'package:stream_chat/stream_chat.dart'; import 'package:stream_chat_flutter/src/reaction_picker.dart'; import 'package:stream_chat_flutter/src/stream_channel.dart'; -import 'package:stream_chat_flutter/src/stream_icons.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; import 'message_input.dart'; import 'message_widget.dart'; @@ -95,59 +95,82 @@ class MessageActionsModal extends StatelessWidget { messageTheme: messageTheme, ), ), - IgnorePointer( - child: MessageWidget( - key: Key('MessageWidget'), - reverse: reverse, - message: message.copyWith( - text: message.text.length > 200 - ? '${message.text.substring(0, 200)}...' - : message.text, - ), - messageTheme: messageTheme, - showReactions: false, - showUsername: false, - showReplyIndicator: false, - showUserAvatar: showUserAvatar, - showTimestamp: false, - translateUserAvatar: false, - showReactionPickerIndicator: true, - showSendingIndicator: DisplayWidget.gone, - shape: messageShape, - ), - ), + TweenAnimationBuilder( + tween: Tween(begin: 0.0, end: 1.0), + duration: Duration(milliseconds: 300), + builder: (context, val, snapshot) { + return Transform.scale( + scale: val, + child: IgnorePointer( + child: MessageWidget( + key: Key('MessageWidget'), + reverse: reverse, + message: message.copyWith( + text: message.text.length > 200 + ? '${message.text.substring(0, 200)}...' + : message.text, + ), + messageTheme: messageTheme, + showReactions: false, + showUsername: false, + showReplyIndicator: false, + showUserAvatar: showUserAvatar, + showTimestamp: false, + translateUserAvatar: false, + showReactionPickerIndicator: true, + showSendingIndicator: DisplayWidget.gone, + shape: messageShape, + ), + ), + ); + }), SizedBox( height: 8, ), - Padding( - padding: const EdgeInsets.symmetric( - horizontal: 48.0, - ), - child: Material( - clipBehavior: Clip.hardEdge, - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(16), - ), - child: Column( - crossAxisAlignment: CrossAxisAlignment.stretch, - children: ListTile.divideTiles( - context: context, - tiles: [ - if (showReply && - (message.status == - MessageSendingStatus.SENT || - message.status == null) && - message.parentId == null) - _buildReplyButton(context), - if (showEditMessage) _buildEditMessage(context), - if (showDeleteMessage) - _buildDeleteButton(context), - if (showCopyMessage) _buildCopyButton(context), - ], - ).toList(), - ), - ), - ) + TweenAnimationBuilder( + tween: Tween(begin: 0.0, end: 1.0), + duration: Duration(milliseconds: 300), + curve: Curves.easeInOut, + builder: (context, val, wid) { + return Transform( + transform: Matrix4.identity() + ..scale(val) + ..rotateZ(-1.0 + val), + alignment: Alignment.topRight, + child: Padding( + padding: const EdgeInsets.symmetric( + horizontal: 48.0, + ), + child: Material( + clipBehavior: Clip.hardEdge, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(16), + ), + child: Column( + crossAxisAlignment: + CrossAxisAlignment.stretch, + children: ListTile.divideTiles( + context: context, + tiles: [ + if (showReply && + (message.status == + MessageSendingStatus.SENT || + message.status == null) && + message.parentId == null) + _buildReplyButton(context), + if (showEditMessage) + _buildEditMessage(context), + if (showDeleteMessage) + _buildDeleteButton(context), + if (showCopyMessage) + _buildCopyButton(context), + ], + ).toList(), + ), + ), + ), + ); + }) ], ), ), @@ -165,8 +188,7 @@ class MessageActionsModal extends StatelessWidget { style: Theme.of(context).textTheme.headline6.copyWith(color: Colors.red), ), - leading: Icon( - StreamIcons.delete, + leading: StreamSvgIcon.delete( color: Colors.red, ), onTap: () { @@ -185,8 +207,7 @@ class MessageActionsModal extends StatelessWidget { 'Copy message', style: Theme.of(context).textTheme.headline6, ), - leading: Icon( - StreamIcons.copy, + leading: StreamSvgIcon.copy( color: StreamChatTheme.of(context).primaryIconTheme.color, ), onTap: () async { @@ -202,8 +223,7 @@ class MessageActionsModal extends StatelessWidget { 'Edit message', style: Theme.of(context).textTheme.headline6, ), - leading: Icon( - StreamIcons.edit, + leading: StreamSvgIcon.edit( color: StreamChatTheme.of(context).primaryIconTheme.color, ), onTap: () async { @@ -244,8 +264,7 @@ class MessageActionsModal extends StatelessWidget { mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ IconButton( - icon: Icon( - StreamIcons.edit, + icon: StreamSvgIcon.edit( size: 22, color: StreamChatTheme.of(context).primaryIconTheme.color, @@ -300,8 +319,7 @@ class MessageActionsModal extends StatelessWidget { 'Thread reply', style: Theme.of(context).textTheme.headline6, ), - leading: Icon( - StreamIcons.sorting_up, + leading: StreamSvgIcon.thread( color: StreamChatTheme.of(context).primaryIconTheme.color, ), onTap: () { diff --git a/lib/src/message_input.dart b/lib/src/message_input.dart index 6845d1a4..b4c79033 100644 --- a/lib/src/message_input.dart +++ b/lib/src/message_input.dart @@ -1,6 +1,5 @@ import 'dart:async'; import 'dart:io'; -import 'dart:math'; import 'package:emojis/emoji.dart'; import 'package:file_picker/file_picker.dart'; @@ -18,6 +17,7 @@ import 'package:stream_chat/stream_chat.dart'; import 'package:stream_chat_flutter/src/media_list_view.dart'; import 'package:stream_chat_flutter/src/message_list_view.dart'; import 'package:stream_chat_flutter/src/stream_chat_theme.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; import 'package:stream_chat_flutter/src/user_avatar.dart'; import 'package:stream_chat_flutter/src/video_thumbnail.dart'; import 'package:substring_highlight/substring_highlight.dart'; @@ -201,6 +201,11 @@ class MessageInputState extends State { onPanUpdate: (details) { if (details.delta.dy > 0) { _focusNode.unfocus(); + if (_openFilePickerSection) { + setState(() { + _openFilePickerSection = false; + }); + } } }, child: Column( @@ -279,8 +284,7 @@ class MessageInputState extends State { crossFadeState: _sendAsDm ? CrossFadeState.showFirst : CrossFadeState.showSecond, - firstChild: Icon( - StreamIcons.check, + firstChild: StreamSvgIcon.check( size: 16.0, color: Colors.white, ), @@ -325,8 +329,7 @@ class MessageInputState extends State { _actionsShrunk = false; }); }, - icon: Icon( - StreamIcons.circle_left, + icon: StreamSvgIcon.emptyCircleLeft( color: StreamChatTheme.of(context).accentColor, ), ), @@ -398,8 +401,7 @@ class MessageInputState extends State { _chosenCommand?.name ?? "", style: TextStyle(color: Colors.white), ), - avatar: Icon( - StreamIcons.lightning, + avatar: StreamSvgIcon.lightning( color: Colors.white, ), ), @@ -426,26 +428,36 @@ class MessageInputState extends State { ); } + Timer _debounce; void _onChanged(BuildContext context, String s) { - StreamChannel.of(context).channel.keyStroke().catchError((e) {}); + if (_debounce?.isActive == true) _debounce.cancel(); + _debounce = Timer( + const Duration(milliseconds: 350), + () { + if (!mounted) { + return; + } + StreamChannel.of(context).channel.keyStroke().catchError((e) {}); - setState(() { - _messageIsPresent = s.trim().isNotEmpty; - _actionsShrunk = s.trim().isNotEmpty; - }); + setState(() { + _messageIsPresent = s.trim().isNotEmpty; + _actionsShrunk = s.trim().isNotEmpty; + }); - _commandsOverlay?.remove(); - _commandsOverlay = null; - _mentionsOverlay?.remove(); - _mentionsOverlay = null; - _emojiOverlay?.remove(); - _emojiOverlay = null; + _commandsOverlay?.remove(); + _commandsOverlay = null; + _mentionsOverlay?.remove(); + _mentionsOverlay = null; + _emojiOverlay?.remove(); + _emojiOverlay = null; - _checkCommands(s.trim(), context); + _checkCommands(s.trim(), context); - _checkMentions(s, context); + _checkMentions(s, context); - _checkEmoji(s, context); + _checkEmoji(s, context); + }, + ); } String _getHint() { @@ -540,86 +552,100 @@ class MessageInputState extends State { bottom: size.height + MediaQuery.of(context).viewInsets.bottom, left: 0, right: 0, - child: Padding( - padding: const EdgeInsets.all(8.0), - child: Card( - elevation: 2.0, - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(8.0), - ), - color: StreamChatTheme.of(context).primaryColor, - clipBehavior: Clip.antiAlias, - child: Container( - constraints: BoxConstraints.loose(Size.fromHeight(400)), - decoration: BoxDecoration( - color: StreamChatTheme.of(context).primaryColor, - borderRadius: BorderRadius.circular(8.0)), - child: ListView( - padding: const EdgeInsets.all(0), - shrinkWrap: true, - children: [ - if (commands.isNotEmpty) - Padding( - padding: const EdgeInsets.only(left: 8.0, top: 8.0), - child: Row( + child: TweenAnimationBuilder( + tween: Tween(begin: 0.0, end: 1.0), + duration: Duration(milliseconds: 300), + curve: Curves.easeInOutExpo, + builder: (context, val, wid) { + return Transform.scale( + alignment: Alignment.center, + scale: val, + child: Padding( + padding: const EdgeInsets.all(8.0), + child: Card( + elevation: 2.0, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(8.0), + ), + color: StreamChatTheme.of(context).primaryColor, + clipBehavior: Clip.antiAlias, + child: Container( + constraints: BoxConstraints.loose(Size.fromHeight(400)), + decoration: BoxDecoration( + color: StreamChatTheme.of(context).primaryColor, + borderRadius: BorderRadius.circular(8.0)), + child: ListView( + padding: const EdgeInsets.all(0), + shrinkWrap: true, children: [ - Padding( - padding: - const EdgeInsets.symmetric(horizontal: 8.0), - child: Icon( - StreamIcons.lightning, - color: StreamChatTheme.of(context).accentColor, + if (commands.isNotEmpty) + Padding( + padding: + const EdgeInsets.only(left: 8.0, top: 8.0), + child: Row( + children: [ + Padding( + padding: const EdgeInsets.symmetric( + horizontal: 8.0, + ), + child: StreamSvgIcon.lightning( + color: StreamChatTheme.of(context) + .accentColor, + ), + ), + Text( + 'Instant Commands', + style: TextStyle( + color: Colors.black.withOpacity(.5), + ), + ) + ], + ), ), - ), - Text( - 'Instant Commands', - style: TextStyle( - color: Colors.black.withOpacity(.5), - ), - ) + ...commands + .map( + (c) => ListTile( + leading: c.name == 'giphy' + ? _buildGiphyIcon() + : null, + title: Text.rich( + TextSpan( + text: '${c.name.capitalize()}', + style: TextStyle( + fontWeight: FontWeight.bold), + children: [ + TextSpan( + text: ' /${c.name} ${c.args}', + style: TextStyle( + fontWeight: FontWeight.w300, + ), + ), + ], + ), + ), + trailing: CircleAvatar( + backgroundColor: + StreamChatTheme.of(context).accentColor, + child: StreamSvgIcon.lightning( + color: Colors.white, + size: 12.5, + ), + maxRadius: 12, + ), + //subtitle: Text(c.description), + onTap: () { + _setCommand(c); + }, + ), + ) + .toList(), ], ), ), - ...commands - .map( - (c) => ListTile( - leading: c.name == 'giphy' ? _buildGiphyIcon() : null, - title: Text.rich( - TextSpan( - text: '${c.name.capitalize()}', - style: TextStyle(fontWeight: FontWeight.bold), - children: [ - TextSpan( - text: ' /${c.name} ${c.args}', - style: TextStyle( - fontWeight: FontWeight.w300, - ), - ), - ], - ), - ), - trailing: CircleAvatar( - backgroundColor: - StreamChatTheme.of(context).accentColor, - child: Icon( - StreamIcons.lightning, - color: Colors.white, - size: 12.5, - ), - maxRadius: 12, - ), - //subtitle: Text(c.description), - onTap: () { - _setCommand(c); - }, - ), - ) - .toList(), - ], - ), - ), - ), - ), + ), + ), + ); + }), ); }); } @@ -636,8 +662,7 @@ class MessageInputState extends State { mainAxisAlignment: MainAxisAlignment.start, children: [ IconButton( - icon: Icon( - StreamIcons.picture, + icon: StreamSvgIcon.pictures( size: 24, color: _filePickerIndex == 0 ? StreamChatTheme.of(context).accentColor @@ -650,8 +675,7 @@ class MessageInputState extends State { }, ), IconButton( - icon: Icon( - StreamIcons.folder, + icon: StreamSvgIcon.files( size: 24, color: _filePickerIndex == 1 ? StreamChatTheme.of(context).accentColor @@ -662,11 +686,8 @@ class MessageInputState extends State { }, ), IconButton( - icon: SvgPicture.asset( - 'svgs/icon_camera.svg', - package: 'stream_chat_flutter', - height: 24, - width: 24, + icon: StreamSvgIcon.camera( + size: 24, color: _filePickerIndex == 2 ? StreamChatTheme.of(context).accentColor : Colors.black.withOpacity(0.5), @@ -676,10 +697,9 @@ class MessageInputState extends State { }, ), IconButton( - icon: Icon( - StreamIcons.record, + icon: StreamSvgIcon.record( size: 24, - color: _filePickerIndex == 2 + color: _filePickerIndex == 3 ? StreamChatTheme.of(context).accentColor : Colors.black.withOpacity(0.5), ), @@ -929,71 +949,83 @@ class MessageInputState extends State { bottom: size.height + MediaQuery.of(context).viewInsets.bottom, left: 0, right: 0, - child: Card( - margin: EdgeInsets.all(8.0), - elevation: 2.0, - color: StreamChatTheme.of(context).primaryColor, - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(8.0), - ), - clipBehavior: Clip.antiAlias, - child: Container( - constraints: BoxConstraints.loose(Size.fromHeight(400)), - decoration: BoxDecoration( - color: StreamChatTheme.of(context).primaryColor, - ), - child: FutureBuilder>( - future: queryMembers ?? Future.value(members), - initialData: members, - builder: (context, snapshot) { - return ListView( - padding: const EdgeInsets.all(0), - shrinkWrap: true, - children: snapshot.data - .map((m) => ListTile( - leading: UserAvatar( - constraints: BoxConstraints.tight( - Size( - 40, - 40, - ), - ), - user: m.user, - ), - title: Text( - '${m.user.name}', - style: TextStyle(fontWeight: FontWeight.bold), - ), - subtitle: Text('@${m.userId}'), - trailing: Icon( - StreamIcons.at_mention, - color: StreamChatTheme.of(context).accentColor, - ), - onTap: () { - _mentionedUsers.add(m.user); + child: TweenAnimationBuilder( + tween: Tween(begin: 0.0, end: 1.0), + duration: Duration(milliseconds: 300), + curve: Curves.easeInOutExpo, + builder: (context, val, wid) { + return Transform.scale( + scale: val, + child: Card( + margin: EdgeInsets.all(8.0), + elevation: 2.0, + color: StreamChatTheme.of(context).primaryColor, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(8.0), + ), + clipBehavior: Clip.antiAlias, + child: Container( + constraints: BoxConstraints.loose(Size.fromHeight(400)), + decoration: BoxDecoration( + color: StreamChatTheme.of(context).primaryColor, + ), + child: FutureBuilder>( + future: queryMembers ?? Future.value(members), + initialData: members, + builder: (context, snapshot) { + return ListView( + padding: const EdgeInsets.all(0), + shrinkWrap: true, + children: snapshot.data + .map((m) => ListTile( + leading: UserAvatar( + constraints: BoxConstraints.tight( + Size( + 40, + 40, + ), + ), + user: m.user, + ), + title: Text( + '${m.user.name}', + style: TextStyle( + fontWeight: FontWeight.bold), + ), + subtitle: Text('@${m.userId}'), + trailing: StreamSvgIcon.mentions( + color: StreamChatTheme.of(context) + .accentColor, + ), + onTap: () { + _mentionedUsers.add(m.user); - splits[splits.length - 1] = m.user.name; - final rejoin = splits.join('@'); + splits[splits.length - 1] = m.user.name; + final rejoin = splits.join('@'); - textEditingController.value = TextEditingValue( - text: rejoin + - textEditingController.text.substring( - textEditingController - .selection.start), - selection: TextSelection.collapsed( - offset: rejoin.length, - ), - ); + textEditingController.value = + TextEditingValue( + text: rejoin + + textEditingController.text + .substring( + textEditingController + .selection.start), + selection: TextSelection.collapsed( + offset: rejoin.length, + ), + ); - _mentionsOverlay?.remove(); - _mentionsOverlay = null; - }, - )) - .toList(), - ); - }), - ), - ), + _mentionsOverlay?.remove(); + _mentionsOverlay = null; + }, + )) + .toList(), + ); + }), + ), + ), + ); + }), ); }); } @@ -1058,8 +1090,7 @@ class MessageInputState extends State { Padding( padding: const EdgeInsets.symmetric(horizontal: 8.0), - child: Icon( - StreamIcons.smile, + child: StreamSvgIcon.smile( color: StreamChatTheme.of(context).accentColor, ), ), @@ -1194,8 +1225,7 @@ class MessageInputState extends State { }, fillColor: Colors.black.withOpacity(.5), child: Center( - child: Icon( - StreamIcons.close, + child: StreamSvgIcon.close( size: 24, color: Colors.white, ), @@ -1266,8 +1296,7 @@ class MessageInputState extends State { child: Padding( padding: const EdgeInsets.only(left: 4.0, right: 8.0, top: 8.0, bottom: 8.0), - child: Icon( - StreamIcons.lightning, + child: StreamSvgIcon.lightning( color: Color(0xFF000000).withAlpha(128), ), ), @@ -1290,8 +1319,7 @@ class MessageInputState extends State { child: Padding( padding: EdgeInsets.only(left: 8.0, right: padding, top: 8.0, bottom: 8.0), - child: Icon( - StreamIcons.attach, + child: StreamSvgIcon.attach( color: _openFilePickerSection ? StreamChatTheme.of(context).accentColor : Color(0xFF000000).withAlpha(128), @@ -1561,69 +1589,53 @@ class MessageInputState extends State { } Widget _buildIdleSendButton(BuildContext context) { - return IconTheme( - data: - StreamChatTheme.of(context).channelTheme.messageInputButtonIconTheme, - child: Padding( - padding: const EdgeInsets.all(8.0), - child: Center( - child: InkWell( - onTap: () { - sendMessage(); - }, - child: Icon( - _getIdleSendIcon(), - color: Colors.grey, - ), - )), - ), + return Padding( + padding: const EdgeInsets.all(8.0), + child: Center( + child: InkWell( + onTap: () { + sendMessage(); + }, + child: StreamSvgIcon( + assetName: _getIdleSendIcon(), + color: Colors.grey, + ), + )), ); } Widget _buildSendButton(BuildContext context) { - return IconTheme( - data: - StreamChatTheme.of(context).channelTheme.messageInputButtonIconTheme, - child: Center( - child: Padding( - padding: const EdgeInsets.all(8.0), - child: InkWell( - onTap: () { - sendMessage(); - }, - child: _getSendIcon(), + return Center( + child: Padding( + padding: const EdgeInsets.all(8.0), + child: InkWell( + onTap: () { + sendMessage(); + }, + child: StreamSvgIcon( + assetName: _getSendIcon(), + color: StreamChatTheme.of(context).accentColor, ), ), ), ); } - IconData _getIdleSendIcon() { + String _getIdleSendIcon() { if (_commandEnabled) { - return StreamIcons.search; + return 'Icon_search.svg'; } else { - return StreamIcons.send_message; + return 'Icon_circle_up.svg'; } } - Widget _getSendIcon() { + String _getSendIcon() { if (widget.editMessage != null) { - return Icon( - StreamIcons.check_send, - color: StreamChatTheme.of(context).accentColor, - ); + return 'Icon_circle_right.svg'; } else if (_commandEnabled) { - return Icon( - StreamIcons.search, - color: StreamChatTheme.of(context).accentColor, - ); + return 'Icon_search.svg'; } else { - return Transform.rotate( - angle: -pi / 2, - child: Icon( - StreamIcons.send_message, - color: StreamChatTheme.of(context).accentColor, - )); + return 'Icon_circle_right.svg'; } } diff --git a/lib/src/message_list_view.dart b/lib/src/message_list_view.dart index 4a5e445b..1be1d0aa 100644 --- a/lib/src/message_list_view.dart +++ b/lib/src/message_list_view.dart @@ -6,6 +6,7 @@ import 'package:jiffy/jiffy.dart'; import 'package:scrollable_positioned_list/scrollable_positioned_list.dart'; import 'package:stream_chat/stream_chat.dart'; import 'package:stream_chat_flutter/src/message_widget.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; import 'package:stream_chat_flutter/src/system_message.dart'; import 'package:visibility_detector/visibility_detector.dart'; @@ -374,8 +375,7 @@ class _MessageListViewState extends State { children: [ FloatingActionButton( backgroundColor: Colors.white, - child: Icon( - StreamIcons.down, + child: StreamSvgIcon.down( color: Colors.black, ), onPressed: () { diff --git a/lib/src/message_reactions_modal.dart b/lib/src/message_reactions_modal.dart index d68bd769..db5d8710 100644 --- a/lib/src/message_reactions_modal.dart +++ b/lib/src/message_reactions_modal.dart @@ -86,27 +86,35 @@ class MessageReactionsModal extends StatelessWidget { messageTheme: messageTheme, ), ), - IgnorePointer( - child: MessageWidget( - key: Key('MessageWidget'), - reverse: reverse, - message: message.copyWith( - text: message.text.length > 200 - ? '${message.text.substring(0, 200)}...' - : message.text, - ), - messageTheme: messageTheme, - showReactions: false, - showUsername: false, - showUserAvatar: showUserAvatar, - showReplyIndicator: false, - showTimestamp: false, - translateUserAvatar: false, - showSendingIndicator: DisplayWidget.gone, - shape: messageShape, - showReactionPickerIndicator: true, - ), - ), + TweenAnimationBuilder( + tween: Tween(begin: 0.0, end: 1.0), + duration: Duration(milliseconds: 300), + builder: (context, val, snapshot) { + return Transform.scale( + scale: val, + child: IgnorePointer( + child: MessageWidget( + key: Key('MessageWidget'), + reverse: reverse, + message: message.copyWith( + text: message.text.length > 200 + ? '${message.text.substring(0, 200)}...' + : message.text, + ), + messageTheme: messageTheme, + showReactions: false, + showUsername: false, + showUserAvatar: showUserAvatar, + showReplyIndicator: false, + showTimestamp: false, + translateUserAvatar: false, + showSendingIndicator: DisplayWidget.gone, + shape: messageShape, + showReactionPickerIndicator: true, + ), + ), + ); + }), SizedBox( height: 16, ), @@ -178,50 +186,60 @@ class MessageReactionsModal extends StatelessWidget { BuildContext context, ) { final isCurrentUser = reaction.user.id == currentUser.id; - return ConstrainedBox( - constraints: BoxConstraints.loose(Size( - 64, - 98, - )), - child: Column( - mainAxisSize: MainAxisSize.min, - mainAxisAlignment: MainAxisAlignment.start, - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - Stack( - children: [ - UserAvatar( - onTap: onUserAvatarTap, - user: reaction.user, - constraints: BoxConstraints.tightFor( - height: 64, - width: 64, - ), - borderRadius: BorderRadius.circular(32), - ), - Positioned( - child: Align( - alignment: Alignment.centerLeft, - child: ReactionBubble( - reactions: [reaction], - borderColor: messageTheme.reactionsBorderColor, - backgroundColor: messageTheme.reactionsBackgroundColor, - highlightOwnReactions: false, + return TweenAnimationBuilder( + tween: Tween(begin: 0.0, end: 1.0), + duration: Duration(milliseconds: 300), + curve: Curves.easeInOut, + builder: (context, val, snapshot) { + return Transform.scale( + scale: val, + child: ConstrainedBox( + constraints: BoxConstraints.loose(Size( + 64, + 98, + )), + child: Column( + mainAxisSize: MainAxisSize.min, + mainAxisAlignment: MainAxisAlignment.start, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + Stack( + children: [ + UserAvatar( + onTap: onUserAvatarTap, + user: reaction.user, + constraints: BoxConstraints.tightFor( + height: 64, + width: 64, + ), + borderRadius: BorderRadius.circular(32), + ), + Positioned( + child: Align( + alignment: Alignment.centerLeft, + child: ReactionBubble( + reactions: [reaction], + borderColor: messageTheme.reactionsBorderColor, + backgroundColor: + messageTheme.reactionsBackgroundColor, + highlightOwnReactions: false, + ), + ), + bottom: 4, + left: isCurrentUser ? 0 : null, + right: isCurrentUser ? 0 : null, + ), + ], ), - ), - bottom: 4, - left: isCurrentUser ? 0 : null, - right: isCurrentUser ? 0 : null, + Text( + reaction.user.name, + style: Theme.of(context).textTheme.subtitle2, + textAlign: TextAlign.center, + ), + ], ), - ], - ), - Text( - reaction.user.name, - style: Theme.of(context).textTheme.subtitle2, - textAlign: TextAlign.center, - ), - ], - ), - ); + ), + ); + }); } } diff --git a/lib/src/reaction_bubble.dart b/lib/src/reaction_bubble.dart index 83593afc..87dc7a92 100644 --- a/lib/src/reaction_bubble.dart +++ b/lib/src/reaction_bubble.dart @@ -3,6 +3,7 @@ import 'dart:math'; import 'package:flutter/material.dart'; import 'package:flutter/rendering.dart'; import 'package:stream_chat_flutter/src/reaction_icon.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; import 'package:stream_chat_flutter/stream_chat_flutter.dart'; class ReactionBubble extends StatelessWidget { @@ -99,14 +100,24 @@ class ReactionBubble extends StatelessWidget { padding: const EdgeInsets.symmetric( horizontal: 4.0, ), - child: Icon( - reactionIcon?.iconData ?? Icons.help_outline_rounded, - size: 16, - color: (!highlightOwnReactions || - reaction.user.id == StreamChat.of(context).user.id) - ? StreamChatTheme.of(context).accentColor - : Colors.black.withOpacity(.5), - ), + child: reactionIcon != null + ? StreamSvgIcon( + assetName: reactionIcon.assetName, + width: 16, + height: 16, + color: (!highlightOwnReactions || + reaction.user.id == StreamChat.of(context).user.id) + ? StreamChatTheme.of(context).accentColor + : Colors.black.withOpacity(.5), + ) + : Icon( + Icons.help_outline_rounded, + size: 16, + color: (!highlightOwnReactions || + reaction.user.id == StreamChat.of(context).user.id) + ? StreamChatTheme.of(context).accentColor + : Colors.black.withOpacity(.5), + ), ); } diff --git a/lib/src/reaction_icon.dart b/lib/src/reaction_icon.dart index 5f885643..99b93328 100644 --- a/lib/src/reaction_icon.dart +++ b/lib/src/reaction_icon.dart @@ -1,11 +1,9 @@ -import 'package:flutter/material.dart'; - class ReactionIcon { final String type; - final IconData iconData; + final String assetName; ReactionIcon({ this.type, - this.iconData, + this.assetName, }); } diff --git a/lib/src/reaction_picker.dart b/lib/src/reaction_picker.dart index e7d302e6..ff23b8a3 100644 --- a/lib/src/reaction_picker.dart +++ b/lib/src/reaction_picker.dart @@ -1,4 +1,6 @@ +import 'package:ezanimation/ezanimation.dart'; import 'package:flutter/material.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; import '../stream_chat_flutter.dart'; @@ -8,7 +10,8 @@ import '../stream_chat_flutter.dart'; /// It shows a reaction picker /// /// Usually you don't use this widget as it's one of the default widgets used by [MessageWidget.onMessageActions]. -class ReactionPicker extends StatelessWidget { + +class ReactionPicker extends StatefulWidget { const ReactionPicker({ Key key, @required this.message, @@ -18,59 +21,136 @@ class ReactionPicker extends StatelessWidget { final Message message; final MessageTheme messageTheme; + @override + _ReactionPickerState createState() => _ReactionPickerState(); +} + +class _ReactionPickerState extends State + with TickerProviderStateMixin { + List animations = []; + @override Widget build(BuildContext context) { final reactionIcons = StreamChatTheme.of(context).reactionIcons; - return Material( - color: messageTheme.reactionsBackgroundColor, - clipBehavior: Clip.hardEdge, - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(24), - ), - child: Row( - crossAxisAlignment: CrossAxisAlignment.start, - mainAxisAlignment: MainAxisAlignment.end, - mainAxisSize: MainAxisSize.min, - children: reactionIcons.map((reactionIcon) { - final ownReactionIndex = message.ownReactions?.indexWhere( - (reaction) => reaction.type == reactionIcon.type) ?? - -1; - return IconButton( - iconSize: 24, - icon: Icon( - reactionIcon.iconData, - color: ownReactionIndex != -1 - ? StreamChatTheme.of(context).accentColor - : Theme.of(context).iconTheme.color.withOpacity(.5), + + if (animations.isEmpty && reactionIcons.isNotEmpty) { + reactionIcons.forEach((element) { + animations.add( + EzAnimation.sequence( + [ + SequenceItem(0.0, 1.4), + SequenceItem(1.4, 1.0), + ], + Duration(milliseconds: 500), + vsync: this, + ), + ); + }); + + triggerAnimations(); + } + + return TweenAnimationBuilder( + tween: Tween(begin: 0.0, end: 1.0), + curve: Curves.easeInOutExpo, + duration: Duration(milliseconds: 500), + builder: (context, val, wid) { + return Transform.scale( + scale: val, + child: Material( + color: widget.messageTheme.reactionsBackgroundColor, + clipBehavior: Clip.hardEdge, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(24), + ), + child: Row( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.end, + mainAxisSize: MainAxisSize.min, + children: reactionIcons.map((reactionIcon) { + final ownReactionIndex = widget.message.ownReactions + ?.indexWhere((reaction) => + reaction.type == reactionIcon.type) ?? + -1; + var index = reactionIcons.indexOf(reactionIcon); + + return IconButton( + iconSize: 24, + icon: AnimatedBuilder( + animation: animations[index], + builder: (context, val) { + return Transform( + transform: Matrix4.identity() + ..scale(animations[index].value, + animations[index].value) + ..rotateZ(1.0 - animations[index].value), + child: StreamSvgIcon( + assetName: reactionIcon.assetName, + height: animations[index].value * 24.0, + width: animations[index].value * 24.0, + color: ownReactionIndex != -1 + ? StreamChatTheme.of(context).accentColor + : Theme.of(context) + .iconTheme + .color + .withOpacity(.5), + ), + ); + }), + onPressed: () { + if (ownReactionIndex != -1) { + removeReaction( + context, + widget.message.ownReactions[ownReactionIndex], + ); + } else { + sendReaction( + context, + reactionIcon.type, + ); + } + }, + ); + }).toList(), + ), ), - onPressed: () { - if (ownReactionIndex != -1) { - removeReaction( - context, - message.ownReactions[ownReactionIndex], - ); - } else { - sendReaction( - context, - reactionIcon.type, - ); - } - }, ); - }).toList(), - ), - ); + }); + } + + void triggerAnimations() async { + for (var a in animations) { + a.start(); + await Future.delayed(Duration(milliseconds: 100)); + } + } + + void pop() async { + for (var a in animations) { + a.stop(); + } + Navigator.of(context).pop(); } /// Add a reaction to the message void sendReaction(BuildContext context, String reactionType) { - StreamChannel.of(context).channel.sendReaction(message, reactionType); - Navigator.of(context).pop(); + StreamChannel.of(context) + .channel + .sendReaction(widget.message, reactionType); + pop(); } /// Remove a reaction from the message void removeReaction(BuildContext context, Reaction reaction) { - StreamChannel.of(context).channel.deleteReaction(message, reaction); - Navigator.of(context).pop(); + StreamChannel.of(context).channel.deleteReaction(widget.message, reaction); + pop(); + } + + @override + void dispose() { + for (var a in animations) { + a?.dispose(); + } + super.dispose(); } } diff --git a/lib/src/stream_chat_theme.dart b/lib/src/stream_chat_theme.dart index 967cbbbf..d5b2c1c2 100644 --- a/lib/src/stream_chat_theme.dart +++ b/lib/src/stream_chat_theme.dart @@ -5,7 +5,6 @@ import 'package:stream_chat_flutter/src/channel_header.dart'; import 'package:stream_chat_flutter/src/channel_preview.dart'; import 'package:stream_chat_flutter/src/message_input.dart'; import 'package:stream_chat_flutter/src/reaction_icon.dart'; -import 'package:stream_chat_flutter/src/stream_icons.dart'; import 'package:stream_chat_flutter/src/utils.dart'; /// Inherited widget providing the [StreamChatThemeData] to the widget tree @@ -353,23 +352,23 @@ class StreamChatThemeData { reactionIcons: [ ReactionIcon( type: 'love', - iconData: StreamIcons.love_reaction, + assetName: 'Icon_love_reaction.svg', ), ReactionIcon( type: 'thumbs_up', - iconData: StreamIcons.thumbs_up_reaction, + assetName: 'Icon_thumbs_up_reaction.svg', ), ReactionIcon( type: 'thumbs_down', - iconData: StreamIcons.thumbs_down_reaction, + assetName: 'Icon_thumbs_down_reaction.svg', ), ReactionIcon( type: 'lol', - iconData: StreamIcons.LOL_reaction, + assetName: 'Icon_LOL_reaction.svg', ), ReactionIcon( type: 'wut', - iconData: StreamIcons.wut_reaction, + assetName: 'Icon_wut_reaction.svg', ), ], ); diff --git a/lib/src/stream_icons.dart b/lib/src/stream_icons.dart deleted file mode 100644 index c8fc6493..00000000 --- a/lib/src/stream_icons.dart +++ /dev/null @@ -1,1184 +0,0 @@ -import 'package:flutter/widgets.dart'; - -class StreamIcons { - StreamIcons._(); - - static const String _fontFamily = 'stream-icons'; - static const String _fontPackage = 'stream_chat_flutter'; - - static const IconData ambulance_car = IconData( - 0xe900, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData ambulance_signal = IconData( - 0xe901, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData ambulance = IconData( - 0xe902, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData apps = IconData( - 0xe903, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData archive = IconData( - 0xe904, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData arrow_down_left = IconData( - 0xe905, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData arrow_down = IconData( - 0xe906, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData arrow_drop_down = IconData( - 0xe907, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData arrow_drop_up = IconData( - 0xe908, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData arrow_left_up = IconData( - 0xe909, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData arrow_left = IconData( - 0xe90a, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData arrow_right_down = IconData( - 0xe90b, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData arrow_right = IconData( - 0xe90c, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData arrow_up_right = IconData( - 0xe90d, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData arrow_up = IconData( - 0xe90e, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData at_mention = IconData( - 0xe90f, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData atom = IconData( - 0xe910, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData attach = IconData( - 0xe911, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData attention = IconData( - 0xe912, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData basket = IconData( - 0xe913, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData blank_empty = IconData( - 0xe914, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData blank = IconData( - 0xe915, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData blood_add = IconData( - 0xe916, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData blood_delete = IconData( - 0xe917, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData brain = IconData( - 0xe918, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData building = IconData( - 0xe919, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData calculator = IconData( - 0xe91a, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData calendar = IconData( - 0xe91b, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData call_in = IconData( - 0xe91c, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData call_out = IconData( - 0xe91d, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData call = IconData( - 0xe91e, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData camera = IconData( - 0xe91f, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData car = IconData( - 0xe920, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData card = IconData( - 0xe921, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData cards = IconData( - 0xe922, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData cash = IconData( - 0xe923, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData chart_line = IconData( - 0xe924, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData chart = IconData( - 0xe925, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData check_all = IconData( - 0xe926, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData check_send = IconData( - 0xe927, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData check = IconData( - 0xe928, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData chemical = IconData( - 0xe929, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData circle_down = IconData( - 0xe92a, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData circle_left = IconData( - 0xe92b, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData circle_right = IconData( - 0xe92c, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData circle_up = IconData( - 0xe92d, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData close_circle = IconData( - 0xe92e, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData close = IconData( - 0xe92f, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData closed = IconData( - 0xe930, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData coin = IconData( - 0xe931, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData command_runner_rocket = IconData( - 0xe932, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData compass = IconData( - 0xe933, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData copy = IconData( - 0xe934, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData couch = IconData( - 0xe935, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData curve_left_down = IconData( - 0xe936, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData curve_line_down_left = IconData( - 0xe937, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData curve_line_down_right = IconData( - 0xe938, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData curve_line_left_up = IconData( - 0xe939, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData curve_line_right_up = IconData( - 0xe93a, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData curve_line_up_left = IconData( - 0xe93b, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData curve_line_up_right = IconData( - 0xe93c, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData curve_right_down = IconData( - 0xe93d, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData daily_planner = IconData( - 0xe93e, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData date = IconData( - 0xe93f, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData delete = IconData( - 0xe940, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData desktop = IconData( - 0xe941, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData disabled = IconData( - 0xe942, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData dna = IconData( - 0xe943, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData doc = IconData( - 0xe944, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData documents = IconData( - 0xe945, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData down = IconData( - 0xe946, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData download_1 = IconData( - 0xe947, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData download = IconData( - 0xe948, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData edit = IconData( - 0xe949, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData emergency_call_add = IconData( - 0xe94a, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData emergency_call = IconData( - 0xe94b, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData emergency = IconData( - 0xe94c, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData error = IconData( - 0xe94d, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData exit = IconData( - 0xe94e, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData experiment = IconData( - 0xe94f, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData eye_off = IconData( - 0xe950, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData eye = IconData( - 0xe951, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData face = IconData( - 0xe952, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData female = IconData( - 0xe953, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData filter_hor = IconData( - 0xe954, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData filter = IconData( - 0xe955, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData first_aid = IconData( - 0xe956, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData flag = IconData( - 0xe957, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData flash = IconData( - 0xe958, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData folder = IconData( - 0xe959, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData form_edit = IconData( - 0xe95a, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData grid = IconData( - 0xe95b, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData group = IconData( - 0xe95c, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData heart_1 = IconData( - 0xe95d, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData heart_outline_add = IconData( - 0xe95e, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData heart_outline_delete = IconData( - 0xe95f, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData heart_pill = IconData( - 0xe960, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData heart = IconData( - 0xe961, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData help = IconData( - 0xe962, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData home_1 = IconData( - 0xe963, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData home = IconData( - 0xe964, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData hospital = IconData( - 0xe965, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData hourglass_empty = IconData( - 0xe966, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData hourglass_full = IconData( - 0xe967, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData hourglass = IconData( - 0xe968, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData insurance_outline = IconData( - 0xe969, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData insurance = IconData( - 0xe96a, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData left_right = IconData( - 0xe96b, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData left = IconData( - 0xe96c, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData light = IconData( - 0xe96d, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData lightning = IconData( - 0xe96e, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData link = IconData( - 0xe96f, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData location_map = IconData( - 0xe970, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData location = IconData( - 0xe971, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData LOL_reaction = IconData( - 0xe972, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData love_reaction = IconData( - 0xe973, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData love = IconData( - 0xe974, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData lungs = IconData( - 0xe975, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData mail_open = IconData( - 0xe976, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData mail = IconData( - 0xe977, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData male = IconData( - 0xe978, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData medical_bed = IconData( - 0xe979, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData medical_blank = IconData( - 0xe97a, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData medical_card_add = IconData( - 0xe97b, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData medical_card = IconData( - 0xe97c, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData medical_cross = IconData( - 0xe97d, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData medical_load = IconData( - 0xe97e, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData menu_point_1 = IconData( - 0xe97f, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData menu_point_v = IconData( - 0xe980, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData menu_point = IconData( - 0xe981, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData menu = IconData( - 0xe982, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData message = IconData( - 0xe983, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData mic_1 = IconData( - 0xe984, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData mic = IconData( - 0xe985, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData minus_circle = IconData( - 0xe986, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData minus = IconData( - 0xe987, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData molecule = IconData( - 0xe988, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData money = IconData( - 0xe989, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData multiply_circle = IconData( - 0xe98a, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData mute = IconData( - 0xe98b, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData notification_off = IconData( - 0xe98c, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData notification = IconData( - 0xe98d, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData nurse = IconData( - 0xe98e, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData open = IconData( - 0xe98f, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData patch = IconData( - 0xe990, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData payment = IconData( - 0xe991, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData pc_graph = IconData( - 0xe992, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData pen_write = IconData( - 0xe993, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData photo = IconData( - 0xe994, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData picture = IconData( - 0xe995, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData pie_chart_empty = IconData( - 0xe996, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData pie_chart_line = IconData( - 0xe997, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData pie_chart = IconData( - 0xe998, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData pill = IconData( - 0xe999, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData pin = IconData( - 0xe99a, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData plus_circle = IconData( - 0xe99b, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData plus = IconData( - 0xe99c, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData podium = IconData( - 0xe99d, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData pointer_leftright = IconData( - 0xe99e, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData pointer = IconData( - 0xe99f, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData potion_circle = IconData( - 0xe9a0, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData potion_health = IconData( - 0xe9a1, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData potion = IconData( - 0xe9a2, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData print = IconData( - 0xe9a3, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData pulse = IconData( - 0xe9a4, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData pyramid = IconData( - 0xe9a5, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData radiation = IconData( - 0xe9a6, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData rating = IconData( - 0xe9a7, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData record = IconData( - 0xe9a8, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData refresh_back = IconData( - 0xe9a9, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData refresh = IconData( - 0xe9aa, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData reload_vert = IconData( - 0xe9ab, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData reload = IconData( - 0xe9ac, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData right = IconData( - 0xe9ad, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData roll = IconData( - 0xe9ae, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData sale = IconData( - 0xe9af, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData save_1 = IconData( - 0xe9b0, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData save_check = IconData( - 0xe9b1, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData save = IconData( - 0xe9b2, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData schedule_square = IconData( - 0xe9b3, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData schedule = IconData( - 0xe9b4, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData scissors = IconData( - 0xe9b5, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData search = IconData( - 0xe9b6, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData send_message = IconData( - 0xe9b7, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData settings = IconData( - 0xe9b8, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData share_1 = IconData( - 0xe9b9, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData share = IconData( - 0xe9ba, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData signboard = IconData( - 0xe9bb, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData smile_sad = IconData( - 0xe9bc, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData smile = IconData( - 0xe9bd, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData sorting_down = IconData( - 0xe9be, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData sorting_up = IconData( - 0xe9bf, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData sorting = IconData( - 0xe9c0, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData square_down = IconData( - 0xe9c1, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData square_left = IconData( - 0xe9c2, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData square_right = IconData( - 0xe9c3, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData square_up = IconData( - 0xe9c4, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData stand = IconData( - 0xe9c5, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData star = IconData( - 0xe9c6, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData stats = IconData( - 0xe9c7, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData stethoscope = IconData( - 0xe9c8, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData sticker = IconData( - 0xe9c9, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData storage = IconData( - 0xe9ca, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData strl_down = IconData( - 0xe9cb, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData strl_left = IconData( - 0xe9cc, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData strl_right = IconData( - 0xe9cd, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData strl_up = IconData( - 0xe9ce, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData syringe = IconData( - 0xe9cf, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData tablet = IconData( - 0xe9d0, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData target = IconData( - 0xe9d1, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData test_tube = IconData( - 0xe9d2, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData thumbs_down_reaction = IconData( - 0xe9d3, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData thumbs_up_reaction = IconData( - 0xe9d4, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData time_1 = IconData( - 0xe9d5, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData time_wait = IconData( - 0xe9d6, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData time = IconData( - 0xe9d7, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData tooth = IconData( - 0xe9d8, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData tube_full = IconData( - 0xe9d9, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData tv_check = IconData( - 0xe9da, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData tv_rating = IconData( - 0xe9db, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData unfold_less_h = IconData( - 0xe9dc, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData unfold_less = IconData( - 0xe9dd, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData unfold_more_h = IconData( - 0xe9de, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData unfold_more = IconData( - 0xe9df, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData unread = IconData( - 0xe9e0, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData up_down = IconData( - 0xe9e1, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData up = IconData( - 0xe9e2, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData upload = IconData( - 0xe9e3, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData user_add = IconData( - 0xe9e4, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData user_delete = IconData( - 0xe9e5, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData user_minus = IconData( - 0xe9e6, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData user = IconData( - 0xe9e7, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData voice = IconData( - 0xe9e8, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData world = IconData( - 0xe9e9, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); - static const IconData wut_reaction = IconData( - 0xe9ea, - fontFamily: _fontFamily, - fontPackage: _fontPackage, - ); -} diff --git a/example/lib/neumorphic_button.dart b/lib/src/stream_neumorphic_button.dart similarity index 90% rename from example/lib/neumorphic_button.dart rename to lib/src/stream_neumorphic_button.dart index 69454fb2..bf3e8e97 100644 --- a/example/lib/neumorphic_button.dart +++ b/lib/src/stream_neumorphic_button.dart @@ -1,10 +1,10 @@ import 'package:flutter/material.dart'; -class NeumorphicButton extends StatelessWidget { +class StreamNeumorphicButton extends StatelessWidget { final Widget child; final Color backgroundColor; - const NeumorphicButton({ + const StreamNeumorphicButton({ Key key, @required this.child, this.backgroundColor = Colors.white, diff --git a/lib/src/stream_svg_icon.dart b/lib/src/stream_svg_icon.dart new file mode 100644 index 00000000..2851df3a --- /dev/null +++ b/lib/src/stream_svg_icon.dart @@ -0,0 +1,376 @@ +import 'package:flutter/foundation.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_svg/flutter_svg.dart'; + +class StreamSvgIcon extends StatelessWidget { + final String assetName; + final double width; + final double height; + final Color color; + + const StreamSvgIcon({ + this.assetName, + this.width, + this.height, + this.color, + }); + + @override + Widget build(BuildContext context) { + final key = Key('StreamSvgIcon-$assetName'); + return kIsWeb + ? Image.network( + 'packages/stream_chat_flutter/svgs/$assetName', + width: width, + height: height, + key: key, + color: color, + alignment: Alignment.center, + ) + : SvgPicture.asset( + 'lib/svgs/$assetName', + package: 'stream_chat_flutter', + key: key, + width: width, + height: height, + color: color, + alignment: Alignment.center, + ); + } + + factory StreamSvgIcon.settings({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'settings.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.down({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_down.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.attach({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_attach.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.smile({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_smile.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.mentions({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'mentions.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.record({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_record.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.camera({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_camera.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.files({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'files.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.pictures({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'pictures.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.left({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_left.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.user({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_user.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.userAdd({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_User_add.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.check({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_check.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.penWrite({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_pen-write.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.contacts({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_contacts.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.close({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_close.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.search({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_search.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.right({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_right.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.mute({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_mute.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.userRemove({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_User_deselect.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.lightning({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_lightning-command runner.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.emptyCircleLeft({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_empty_circle_left.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.message({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_message.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.thread({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_Thread_Reply.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.edit({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_edit.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.copy({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_copy.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.delete({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_delete.svg', + color: color, + width: size, + height: size, + ); + } + + factory StreamSvgIcon.eye({ + double size, + Color color, + }) { + return StreamSvgIcon( + assetName: 'Icon_eye-off.svg', + color: color, + width: size, + height: size, + ); + } +} diff --git a/lib/src/thread_header.dart b/lib/src/thread_header.dart index 993a3047..c6cce13e 100644 --- a/lib/src/thread_header.dart +++ b/lib/src/thread_header.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; import 'package:stream_chat/stream_chat.dart'; -import 'package:stream_chat_flutter/src/back_button.dart'; import 'package:stream_chat_flutter/src/stream_chat_theme.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; /// ![screenshot](https://raw.githubusercontent.com/GetStream/stream-chat-flutter/master/screenshots/thread_header.png) /// ![screenshot](https://raw.githubusercontent.com/GetStream/stream-chat-flutter/master/screenshots/thread_header_paint.png) @@ -84,9 +84,14 @@ class ThreadHeader extends StatelessWidget implements PreferredSizeWidget { child: showBackButton ? AspectRatio( aspectRatio: 1, - child: StreamBackButton( + child: IconButton( onPressed: onBackPressed, - icon: Icons.close, + icon: StreamSvgIcon.close( + size: 24, + color: Theme.of(context).brightness == Brightness.dark + ? Colors.white + : Colors.black, + ), ), ) : SizedBox(), diff --git a/lib/src/user_item.dart b/lib/src/user_item.dart index 06ab0848..f12e3e61 100644 --- a/lib/src/user_item.dart +++ b/lib/src/user_item.dart @@ -1,6 +1,7 @@ import 'package:flutter/material.dart'; import 'package:jiffy/jiffy.dart'; import 'package:stream_chat/stream_chat.dart'; +import 'package:stream_chat_flutter/src/stream_svg_icon.dart'; import 'package:stream_chat_flutter/src/user_list_view.dart'; import 'package:stream_chat_flutter/stream_chat_flutter.dart'; @@ -73,9 +74,9 @@ class UserItem extends StatelessWidget { ), trailing: selected ? CircleAvatar( - child: Icon( - StreamIcons.check, + child: StreamSvgIcon.check( size: 20, + color: Colors.white, ), radius: 10, ) diff --git a/lib/stream_chat_flutter.dart b/lib/stream_chat_flutter.dart index 91ac68c8..f8ad25ea 100644 --- a/lib/stream_chat_flutter.dart +++ b/lib/stream_chat_flutter.dart @@ -3,6 +3,7 @@ export 'package:stream_chat/stream_chat.dart'; export 'src/back_button.dart'; export 'src/channel_header.dart'; export 'src/channel_image.dart'; +export 'src/channel_list_header.dart'; export 'src/channel_list_view.dart'; export 'src/channel_name.dart'; export 'src/channel_preview.dart'; @@ -23,13 +24,17 @@ export 'src/sending_indicator.dart'; export 'src/stream_channel.dart'; export 'src/stream_chat.dart'; export 'src/stream_chat_theme.dart'; -export 'src/stream_icons.dart'; +export 'src/stream_neumorphic_button.dart'; +export 'src/stream_svg_icon.dart'; export 'src/system_message.dart'; export 'src/thread_header.dart'; export 'src/typing_indicator.dart'; export 'src/user_avatar.dart'; +export 'src/user_item.dart'; +export 'src/user_item.dart'; +export 'src/user_list_view.dart'; +export 'src/user_list_view.dart'; +export 'src/users_bloc.dart'; +export 'src/users_bloc.dart'; export 'src/utils.dart'; export 'src/video_attachment.dart'; -export 'src/users_bloc.dart'; -export 'src/user_list_view.dart'; -export 'src/user_item.dart'; diff --git a/lib/svgs/Empty State_Camera.svg b/lib/svgs/Empty State_Camera.svg new file mode 100644 index 00000000..170ff7d4 --- /dev/null +++ b/lib/svgs/Empty State_Camera.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Empty State_Files.svg b/lib/svgs/Empty State_Files.svg new file mode 100644 index 00000000..658bcb1d --- /dev/null +++ b/lib/svgs/Empty State_Files.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Empty State_No channel.svg b/lib/svgs/Empty State_No channel.svg new file mode 100644 index 00000000..d7979534 --- /dev/null +++ b/lib/svgs/Empty State_No channel.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Empty State_Search.svg b/lib/svgs/Empty State_Search.svg new file mode 100644 index 00000000..d0026388 --- /dev/null +++ b/lib/svgs/Empty State_Search.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Empty State_picture.svg b/lib/svgs/Empty State_picture.svg new file mode 100644 index 00000000..fc82db46 --- /dev/null +++ b/lib/svgs/Empty State_picture.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Giphy icon.svg b/lib/svgs/Giphy icon.svg new file mode 100644 index 00000000..a9419e59 --- /dev/null +++ b/lib/svgs/Giphy icon.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/lib/svgs/Icon_LOL_reaction.svg b/lib/svgs/Icon_LOL_reaction.svg new file mode 100644 index 00000000..c0f1d6fc --- /dev/null +++ b/lib/svgs/Icon_LOL_reaction.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_Thread_Reply.svg b/lib/svgs/Icon_Thread_Reply.svg new file mode 100644 index 00000000..7482300d --- /dev/null +++ b/lib/svgs/Icon_Thread_Reply.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_User_add.svg b/lib/svgs/Icon_User_add.svg new file mode 100644 index 00000000..c9db7859 --- /dev/null +++ b/lib/svgs/Icon_User_add.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_User_deselect.svg b/lib/svgs/Icon_User_deselect.svg new file mode 100644 index 00000000..fc5129d7 --- /dev/null +++ b/lib/svgs/Icon_User_deselect.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_arrow_right.svg b/lib/svgs/Icon_arrow_right.svg new file mode 100644 index 00000000..dde29bcb --- /dev/null +++ b/lib/svgs/Icon_arrow_right.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_attach.svg b/lib/svgs/Icon_attach.svg new file mode 100644 index 00000000..e2369d21 --- /dev/null +++ b/lib/svgs/Icon_attach.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_camera.svg b/lib/svgs/Icon_camera.svg new file mode 100644 index 00000000..a5a7d99d --- /dev/null +++ b/lib/svgs/Icon_camera.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_check.svg b/lib/svgs/Icon_check.svg new file mode 100644 index 00000000..49cf76be --- /dev/null +++ b/lib/svgs/Icon_check.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_check_all.svg b/lib/svgs/Icon_check_all.svg new file mode 100644 index 00000000..b477edde --- /dev/null +++ b/lib/svgs/Icon_check_all.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_check_big.svg b/lib/svgs/Icon_check_big.svg new file mode 100644 index 00000000..d42503bb --- /dev/null +++ b/lib/svgs/Icon_check_big.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_check_send.svg b/lib/svgs/Icon_check_send.svg new file mode 100644 index 00000000..e62c7099 --- /dev/null +++ b/lib/svgs/Icon_check_send.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_circle_right.svg b/lib/svgs/Icon_circle_right.svg new file mode 100644 index 00000000..1d20c031 --- /dev/null +++ b/lib/svgs/Icon_circle_right.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_circle_up.svg b/lib/svgs/Icon_circle_up.svg new file mode 100644 index 00000000..41ed17dd --- /dev/null +++ b/lib/svgs/Icon_circle_up.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_close.svg b/lib/svgs/Icon_close.svg new file mode 100644 index 00000000..0765c5c3 --- /dev/null +++ b/lib/svgs/Icon_close.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_close_black.svg b/lib/svgs/Icon_close_black.svg new file mode 100644 index 00000000..74eb480c --- /dev/null +++ b/lib/svgs/Icon_close_black.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_close_sml.svg b/lib/svgs/Icon_close_sml.svg new file mode 100644 index 00000000..63e0d016 --- /dev/null +++ b/lib/svgs/Icon_close_sml.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_cloud_download.svg b/lib/svgs/Icon_cloud_download.svg new file mode 100644 index 00000000..7b935f29 --- /dev/null +++ b/lib/svgs/Icon_cloud_download.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_contacts.svg b/lib/svgs/Icon_contacts.svg new file mode 100644 index 00000000..6db40129 --- /dev/null +++ b/lib/svgs/Icon_contacts.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_copy.svg b/lib/svgs/Icon_copy.svg new file mode 100644 index 00000000..83bd7aa5 --- /dev/null +++ b/lib/svgs/Icon_copy.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_curve_line_left_up.svg b/lib/svgs/Icon_curve_line_left_up.svg new file mode 100644 index 00000000..1c3c718c --- /dev/null +++ b/lib/svgs/Icon_curve_line_left_up.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_curve_line_left_up_big.svg b/lib/svgs/Icon_curve_line_left_up_big.svg new file mode 100644 index 00000000..4b6181b1 --- /dev/null +++ b/lib/svgs/Icon_curve_line_left_up_big.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_delete.svg b/lib/svgs/Icon_delete.svg new file mode 100644 index 00000000..3a63cfec --- /dev/null +++ b/lib/svgs/Icon_delete.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_down.svg b/lib/svgs/Icon_down.svg new file mode 100644 index 00000000..60ea59ee --- /dev/null +++ b/lib/svgs/Icon_down.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_download.svg b/lib/svgs/Icon_download.svg new file mode 100644 index 00000000..f42047ba --- /dev/null +++ b/lib/svgs/Icon_download.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_edit.svg b/lib/svgs/Icon_edit.svg new file mode 100644 index 00000000..7fc784fb --- /dev/null +++ b/lib/svgs/Icon_edit.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_empty_circle_left.svg b/lib/svgs/Icon_empty_circle_left.svg new file mode 100644 index 00000000..8f1e8329 --- /dev/null +++ b/lib/svgs/Icon_empty_circle_left.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_error.svg b/lib/svgs/Icon_error.svg new file mode 100644 index 00000000..af3df414 --- /dev/null +++ b/lib/svgs/Icon_error.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_eye-off.svg b/lib/svgs/Icon_eye-off.svg new file mode 100644 index 00000000..8f404ae2 --- /dev/null +++ b/lib/svgs/Icon_eye-off.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_grid.svg b/lib/svgs/Icon_grid.svg new file mode 100644 index 00000000..43bb0489 --- /dev/null +++ b/lib/svgs/Icon_grid.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_left.svg b/lib/svgs/Icon_left.svg new file mode 100644 index 00000000..5a4c5ced --- /dev/null +++ b/lib/svgs/Icon_left.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_lightning-command runner.svg b/lib/svgs/Icon_lightning-command runner.svg new file mode 100644 index 00000000..83045bbb --- /dev/null +++ b/lib/svgs/Icon_lightning-command runner.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_love_reaction.svg b/lib/svgs/Icon_love_reaction.svg new file mode 100644 index 00000000..4d946544 --- /dev/null +++ b/lib/svgs/Icon_love_reaction.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_message.svg b/lib/svgs/Icon_message.svg new file mode 100644 index 00000000..11eacefa --- /dev/null +++ b/lib/svgs/Icon_message.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_mute.svg b/lib/svgs/Icon_mute.svg new file mode 100644 index 00000000..d1d16aa7 --- /dev/null +++ b/lib/svgs/Icon_mute.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_pen-write.svg b/lib/svgs/Icon_pen-write.svg new file mode 100644 index 00000000..820d28bd --- /dev/null +++ b/lib/svgs/Icon_pen-write.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_record.svg b/lib/svgs/Icon_record.svg new file mode 100644 index 00000000..64d02895 --- /dev/null +++ b/lib/svgs/Icon_record.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_right.svg b/lib/svgs/Icon_right.svg new file mode 100644 index 00000000..6d42a1db --- /dev/null +++ b/lib/svgs/Icon_right.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_search.svg b/lib/svgs/Icon_search.svg new file mode 100644 index 00000000..0865a95e --- /dev/null +++ b/lib/svgs/Icon_search.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_smile.svg b/lib/svgs/Icon_smile.svg new file mode 100644 index 00000000..b803cf22 --- /dev/null +++ b/lib/svgs/Icon_smile.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_thumbs_down_reaction.svg b/lib/svgs/Icon_thumbs_down_reaction.svg new file mode 100644 index 00000000..9036ff72 --- /dev/null +++ b/lib/svgs/Icon_thumbs_down_reaction.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_thumbs_up_reaction.svg b/lib/svgs/Icon_thumbs_up_reaction.svg new file mode 100644 index 00000000..ff4dcc72 --- /dev/null +++ b/lib/svgs/Icon_thumbs_up_reaction.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_time.svg b/lib/svgs/Icon_time.svg new file mode 100644 index 00000000..59aa2c5d --- /dev/null +++ b/lib/svgs/Icon_time.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_user.svg b/lib/svgs/Icon_user.svg new file mode 100644 index 00000000..f50e33fc --- /dev/null +++ b/lib/svgs/Icon_user.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_user_delete.svg b/lib/svgs/Icon_user_delete.svg new file mode 100644 index 00000000..fb47f5e8 --- /dev/null +++ b/lib/svgs/Icon_user_delete.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/Icon_wut_reaction.svg b/lib/svgs/Icon_wut_reaction.svg new file mode 100644 index 00000000..f445ec29 --- /dev/null +++ b/lib/svgs/Icon_wut_reaction.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/STREAM MARK 1.svg b/lib/svgs/STREAM MARK 1.svg new file mode 100644 index 00000000..57ccef0f --- /dev/null +++ b/lib/svgs/STREAM MARK 1.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/lib/svgs/UI_Reverse Pagination Loading.svg b/lib/svgs/UI_Reverse Pagination Loading.svg new file mode 100644 index 00000000..dfc3754f --- /dev/null +++ b/lib/svgs/UI_Reverse Pagination Loading.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/lib/svgs/eye-line_big.svg b/lib/svgs/eye-line_big.svg new file mode 100644 index 00000000..9eb20a58 --- /dev/null +++ b/lib/svgs/eye-line_big.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/files.svg b/lib/svgs/files.svg new file mode 100644 index 00000000..5d72fdd3 --- /dev/null +++ b/lib/svgs/files.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/filetype_7z.svg b/lib/svgs/filetype_7z.svg new file mode 100644 index 00000000..787f5f8c --- /dev/null +++ b/lib/svgs/filetype_7z.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/lib/svgs/filetype_CSV.svg b/lib/svgs/filetype_CSV.svg new file mode 100644 index 00000000..d7395e78 --- /dev/null +++ b/lib/svgs/filetype_CSV.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/lib/svgs/filetype_DOC.svg b/lib/svgs/filetype_DOC.svg new file mode 100644 index 00000000..4233055a --- /dev/null +++ b/lib/svgs/filetype_DOC.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/lib/svgs/filetype_DOCX.svg b/lib/svgs/filetype_DOCX.svg new file mode 100644 index 00000000..3077f515 --- /dev/null +++ b/lib/svgs/filetype_DOCX.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/lib/svgs/filetype_Generic.svg b/lib/svgs/filetype_Generic.svg new file mode 100644 index 00000000..3ec0f239 --- /dev/null +++ b/lib/svgs/filetype_Generic.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/lib/svgs/filetype_MD.svg b/lib/svgs/filetype_MD.svg new file mode 100644 index 00000000..560b7c61 --- /dev/null +++ b/lib/svgs/filetype_MD.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/lib/svgs/filetype_ODT.svg b/lib/svgs/filetype_ODT.svg new file mode 100644 index 00000000..6e08875f --- /dev/null +++ b/lib/svgs/filetype_ODT.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/lib/svgs/filetype_PDF.svg b/lib/svgs/filetype_PDF.svg new file mode 100644 index 00000000..c8306ca1 --- /dev/null +++ b/lib/svgs/filetype_PDF.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/lib/svgs/filetype_PPT.svg b/lib/svgs/filetype_PPT.svg new file mode 100644 index 00000000..0541a496 --- /dev/null +++ b/lib/svgs/filetype_PPT.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/lib/svgs/filetype_PPTX-1.svg b/lib/svgs/filetype_PPTX-1.svg new file mode 100644 index 00000000..a50efd64 --- /dev/null +++ b/lib/svgs/filetype_PPTX-1.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/lib/svgs/filetype_PPTX.svg b/lib/svgs/filetype_PPTX.svg new file mode 100644 index 00000000..83339acc --- /dev/null +++ b/lib/svgs/filetype_PPTX.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/lib/svgs/filetype_RAR.svg b/lib/svgs/filetype_RAR.svg new file mode 100644 index 00000000..ae0e14d0 --- /dev/null +++ b/lib/svgs/filetype_RAR.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/lib/svgs/filetype_RTF.svg b/lib/svgs/filetype_RTF.svg new file mode 100644 index 00000000..e9266599 --- /dev/null +++ b/lib/svgs/filetype_RTF.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/lib/svgs/filetype_TAR.svg b/lib/svgs/filetype_TAR.svg new file mode 100644 index 00000000..6796e1f7 --- /dev/null +++ b/lib/svgs/filetype_TAR.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/lib/svgs/filetype_TXT.svg b/lib/svgs/filetype_TXT.svg new file mode 100644 index 00000000..263fdfbe --- /dev/null +++ b/lib/svgs/filetype_TXT.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/lib/svgs/filetype_XLS.svg b/lib/svgs/filetype_XLS.svg new file mode 100644 index 00000000..eec9a05d --- /dev/null +++ b/lib/svgs/filetype_XLS.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/lib/svgs/filetype_XLSX.svg b/lib/svgs/filetype_XLSX.svg new file mode 100644 index 00000000..6203aa27 --- /dev/null +++ b/lib/svgs/filetype_XLSX.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/lib/svgs/filetype_ZIP.svg b/lib/svgs/filetype_ZIP.svg new file mode 100644 index 00000000..daa24576 --- /dev/null +++ b/lib/svgs/filetype_ZIP.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/lib/svgs/filetype_html.svg b/lib/svgs/filetype_html.svg new file mode 100644 index 00000000..9e3cb9cf --- /dev/null +++ b/lib/svgs/filetype_html.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/lib/svgs/giphy icon blue.svg b/lib/svgs/giphy icon blue.svg new file mode 100644 index 00000000..746e50a4 --- /dev/null +++ b/lib/svgs/giphy icon blue.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/icon_SHARE.svg b/lib/svgs/icon_SHARE.svg new file mode 100644 index 00000000..6a35ef8d --- /dev/null +++ b/lib/svgs/icon_SHARE.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/icon_delete_grey.svg b/lib/svgs/icon_delete_grey.svg new file mode 100644 index 00000000..10689df2 --- /dev/null +++ b/lib/svgs/icon_delete_grey.svg @@ -0,0 +1,4 @@ + + + + diff --git a/lib/svgs/icon_mentions.svg b/lib/svgs/icon_mentions.svg new file mode 100644 index 00000000..ce6c6fa1 --- /dev/null +++ b/lib/svgs/icon_mentions.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/mentions.svg b/lib/svgs/mentions.svg new file mode 100644 index 00000000..05bdee3b --- /dev/null +++ b/lib/svgs/mentions.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/pictures.svg b/lib/svgs/pictures.svg new file mode 100644 index 00000000..64e6ca34 --- /dev/null +++ b/lib/svgs/pictures.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/settings.svg b/lib/svgs/settings.svg new file mode 100644 index 00000000..7dfab209 --- /dev/null +++ b/lib/svgs/settings.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/svgs/share_arrow.svg b/lib/svgs/share_arrow.svg new file mode 100644 index 00000000..33b99c35 --- /dev/null +++ b/lib/svgs/share_arrow.svg @@ -0,0 +1,3 @@ + + + diff --git a/pubspec.yaml b/pubspec.yaml index c43eea9c..c441ca4f 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -40,15 +40,13 @@ dependencies: git: https://github.com/imtoori/media_gallery.git permission_handler: ^5.0.1+1 transparent_image: ^1.0.0 + ezanimation: ^0.4.1 flutter: assets: - images/ - svgs/ - fonts: - - family: stream-icons - fonts: - - asset: fonts/stream-icons.ttf + - lib/svgs/ dev_dependencies: pedantic: ^1.9.0 diff --git a/svgs/icon_pen_write.svg b/svgs/icon_pen_write.svg new file mode 100644 index 00000000..b2711dad --- /dev/null +++ b/svgs/icon_pen_write.svg @@ -0,0 +1,5 @@ + + + diff --git a/test/src/message_action_modal_test.dart b/test/src/message_action_modal_test.dart index 1427edd6..5b0c1678 100644 --- a/test/src/message_action_modal_test.dart +++ b/test/src/message_action_modal_test.dart @@ -40,11 +40,12 @@ void main() { ); await tester.pump(); + await tester.pump(Duration(milliseconds: 1000)); expect(find.byKey(Key('MessageWidget')), findsOneWidget); - expect(find.byIcon(StreamIcons.sorting_up), findsOneWidget); - expect(find.byIcon(StreamIcons.edit), findsOneWidget); - expect(find.byIcon(StreamIcons.delete), findsOneWidget); - expect(find.byIcon(StreamIcons.copy), findsOneWidget); + expect(find.text('Thread reply'), findsOneWidget); + expect(find.text('Edit message'), findsOneWidget); + expect(find.text('Delete message'), findsOneWidget); + expect(find.text('Copy message'), findsOneWidget); }, ); testWidgets( @@ -84,11 +85,12 @@ void main() { ); await tester.pump(); + await tester.pump(Duration(milliseconds: 1000)); expect(find.byKey(Key('MessageWidget')), findsOneWidget); - expect(find.byIcon(StreamIcons.sorting_up), findsNothing); - expect(find.byIcon(StreamIcons.edit), findsNothing); - expect(find.byIcon(StreamIcons.delete), findsNothing); - expect(find.byIcon(StreamIcons.copy), findsNothing); + expect(find.text('Thread reply'), findsNothing); + expect(find.text('Edit message'), findsNothing); + expect(find.text('Delete message'), findsNothing); + expect(find.text('Copy message'), findsNothing); }, ); } diff --git a/test/src/message_reaction_modal_test.dart b/test/src/message_reaction_modal_test.dart index e270793e..d1c2a49c 100644 --- a/test/src/message_reaction_modal_test.dart +++ b/test/src/message_reaction_modal_test.dart @@ -39,8 +39,11 @@ void main() { ), ); + await tester.pump(Duration(milliseconds: 1000)); + expect(find.byKey(Key('MessageWidget')), findsOneWidget); - expect(find.byIcon(StreamIcons.thumbs_up_reaction), findsOneWidget); + expect(find.byKey(Key('StreamSvgIcon-Icon_thumbs_up_reaction.svg')), + findsOneWidget); }, ); @@ -87,9 +90,12 @@ void main() { ); await tester.pump(); + await tester.pump(Duration(milliseconds: 1000)); expect(find.byKey(Key('MessageWidget')), findsOneWidget); - expect(find.byIcon(StreamIcons.thumbs_up_reaction), findsNWidgets(2)); - expect(find.byIcon(StreamIcons.love_reaction), findsNWidgets(2)); + expect(find.byKey(Key('StreamSvgIcon-Icon_thumbs_up_reaction.svg')), + findsNWidgets(2)); + expect(find.byKey(Key('StreamSvgIcon-Icon_love_reaction.svg')), + findsNWidgets(2)); expect(find.text(testUserId), findsNWidgets(2)); }, ); diff --git a/test/src/reaction_bubble_test.dart b/test/src/reaction_bubble_test.dart index c524061c..6518dc94 100644 --- a/test/src/reaction_bubble_test.dart +++ b/test/src/reaction_bubble_test.dart @@ -25,7 +25,8 @@ void main() { ), ); - expect(find.byIcon(StreamIcons.thumbs_up_reaction), findsNothing); + expect(find.byKey(Key('StreamSvgIcon-Icon_thumbs_up_reaction.svg')), + findsNothing); }, ); @@ -61,7 +62,8 @@ void main() { ), ); - expect(find.byIcon(StreamIcons.thumbs_up_reaction), findsOneWidget); + expect(find.byKey(Key('StreamSvgIcon-Icon_thumbs_up_reaction.svg')), + findsOneWidget); }, ); testWidgets( @@ -100,8 +102,10 @@ void main() { ), ); - expect(find.byIcon(StreamIcons.thumbs_up_reaction), findsOneWidget); - expect(find.byIcon(StreamIcons.love_reaction), findsOneWidget); + expect(find.byKey(Key('StreamSvgIcon-Icon_thumbs_up_reaction.svg')), + findsOneWidget); + expect(find.byKey(Key('StreamSvgIcon-Icon_love_reaction.svg')), + findsOneWidget); }, ); }