GitLab/fluffychat
2
0
Fork 0
mirror of https://gitlab.com/famedly/fluffychat.git synced 2024-12-02 17:29:34 +01:00
Code Issues Projects Releases Wiki Activity

Merge branch 'krille/stories-design' into 'main'

Browse Source 
design: Display own stories at first place and combine with new stories button

See merge request famedly/fluffychat!812
This commit is contained in:
Krille Fear 2022-04-08 05:53:01 +00:00
commit 15feef181a
3 changed files with 116 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

139
lib/pages/chat_list/stories_header.dart
View File

@ -107,48 +107,45 @@ class StoriesHeader extends StatelessWidget {
if (client.storiesRooms.isEmpty) { if (client.storiesRooms.isEmpty) {
return Container(); return Container();
} }
final stories = client.storiesRooms
..sort((a, b) =>
a.getState(EventTypes.RoomCreate)?.senderId == client.userID
? -1
: 1);
return SizedBox( return SizedBox(
height: 106, height: 106,
child: ListView( child: ListView.builder(
padding: const EdgeInsets.symmetric(horizontal: 2), padding: const EdgeInsets.symmetric(horizontal: 2),
scrollDirection: Axis.horizontal, scrollDirection: Axis.horizontal,
children: [ itemCount: stories.length,
_StoryButton( itemBuilder: (context, i) {
label: L10n.of(context)!.yourStory, final room = stories[i];
onPressed: () => _addToStoryAction(context), return Opacity(
child: const Icon(Icons.camera_alt_outlined), opacity: room.hasPosts ? 1 : 0.75,
), child: FutureBuilder<Profile>(
...client.storiesRooms.map( future: room.getCreatorProfile(),
(room) => Opacity( builder: (context, snapshot) {
opacity: room.hasPosts ? 1 : 0.75, final userId =
child: FutureBuilder<Profile>( room.getState(EventTypes.RoomCreate)!.senderId;
future: room.getCreatorProfile(), final displayname =
builder: (context, snapshot) { snapshot.data?.displayName ?? userId.localpart!;
final displayname = snapshot.data?.displayName ?? final avatarUrl = snapshot.data?.avatarUrl;
room return _StoryButton(
.getState(EventTypes.RoomCreate)! profile: Profile(
.senderId displayName: displayname,
.localpart!; avatarUrl: avatarUrl,
final avatarUrl = snapshot.data?.avatarUrl; userId: userId,
return _StoryButton( ),
label: displayname, showEditFab: userId == client.userID,
child: Avatar( unread: room.membership == Membership.invite ||
mxContent: avatarUrl, room.hasNewMessages,
name: displayname, onPressed: () => _goToStoryAction(context, room.id),
size: 100, onLongPressed: () =>
fontSize: 24, _contextualActions(context, room),
), );
unread: room.membership == Membership.invite || }),
room.hasNewMessages, );
onPressed: () => },
_goToStoryAction(context, room.id),
onLongPressed: () =>
_contextualActions(context, room),
);
}),
),
),
],
), ),
); );
}), }),
@ -174,16 +171,16 @@ extension on Room {
} }
class _StoryButton extends StatelessWidget { class _StoryButton extends StatelessWidget {
final Widget child; final Profile profile;
final String label; final bool showEditFab;
final bool unread;
final void Function() onPressed; final void Function() onPressed;
final void Function()? onLongPressed; final void Function()? onLongPressed;
final bool unread;
const _StoryButton({ const _StoryButton({
required this.child, required this.profile,
required this.label,
required this.onPressed, required this.onPressed,
this.showEditFab = false,
this.unread = false, this.unread = false,
this.onLongPressed, this.onLongPressed,
Key? key, Key? key,
@ -223,25 +220,55 @@ class _StoryButton extends StatelessWidget {
color: unread ? null : Theme.of(context).dividerColor, color: unread ? null : Theme.of(context).dividerColor,
borderRadius: BorderRadius.circular(Avatar.defaultSize), borderRadius: BorderRadius.circular(Avatar.defaultSize),
), ),
child: Material( child: Stack(
color: Theme.of(context).colorScheme.surface, children: [
borderRadius: BorderRadius.circular(Avatar.defaultSize), Material(
child: Padding( color: Theme.of(context).colorScheme.surface,
padding: const EdgeInsets.all(2.0), borderRadius: BorderRadius.circular(Avatar.defaultSize),
child: CircleAvatar( child: Padding(
radius: 30, padding: const EdgeInsets.all(2.0),
backgroundColor: Theme.of(context).colorScheme.surface, child: CircleAvatar(
foregroundColor: radius: 30,
Theme.of(context).textTheme.bodyText1?.color, backgroundColor:
child: child, Theme.of(context).colorScheme.surface,
foregroundColor:
Theme.of(context).textTheme.bodyText1?.color,
child: Avatar(
mxContent: profile.avatarUrl,
name: profile.displayName,
size: 100,
fontSize: 24,
),
),
),
), ),
), if (showEditFab)
Positioned(
right: 0,
bottom: 0,
child: SizedBox(
width: 24,
height: 24,
child: FloatingActionButton.small(
backgroundColor:
Theme.of(context).backgroundColor,
foregroundColor: Theme.of(context).primaryColor,
onPressed: () =>
VRouter.of(context).to('/stories/create'),
child: const Icon(
Icons.add_outlined,
size: 16,
),
),
),
),
],
), ),
), ),
), ),
const SizedBox(height: 8), const SizedBox(height: 8),
Text( Text(
label, profile.displayName ?? '',
maxLines: 1, maxLines: 1,
textAlign: TextAlign.center, textAlign: TextAlign.center,
style: TextStyle( style: TextStyle(

6
lib/pages/story/story_page.dart
View File

@ -227,7 +227,11 @@ class StoryPageController extends State<StoryPage> {
void skip() { void skip() {
if (index + 1 >= max) { if (index + 1 >= max) {
VRouter.of(context).to('/rooms'); if (isOwnStory) {
VRouter.of(context).to('/stories/create');
} else {
VRouter.of(context).to('/rooms');
}
return; return;
} }
setState(() { setState(() {

56
lib/pages/story/story_view.dart
View File

@ -225,34 +225,34 @@ class StoryView extends StatelessWidget {
); );
}, },
), ),
SafeArea( AnimatedContainer(
child: GestureDetector( duration: const Duration(milliseconds: 200),
onTapDown: controller.hold, padding: const EdgeInsets.all(16.0),
onTapUp: controller.unhold, decoration: BoxDecoration(
onTapCancel: controller.unhold, gradient: event.messageType == MessageTypes.Text
onVerticalDragStart: controller.hold, ? LinearGradient(
onVerticalDragEnd: controller.unhold, colors: [
onHorizontalDragStart: controller.hold, backgroundColorDark,
onHorizontalDragEnd: controller.unhold, backgroundColor,
child: AnimatedContainer( ],
duration: const Duration(milliseconds: 200), begin: Alignment.topCenter,
padding: const EdgeInsets.all(16.0), end: Alignment.bottomCenter,
decoration: BoxDecoration( )
gradient: event.messageType == MessageTypes.Text : null,
? LinearGradient( ),
colors: [ alignment: Alignment(
backgroundColorDark, controller.storyThemeData.alignmentX.toDouble() / 100,
backgroundColor, controller.storyThemeData.alignmentY.toDouble() / 100,
], ),
begin: Alignment.topCenter, child: SafeArea(
end: Alignment.bottomCenter, child: GestureDetector(
) onTapDown: controller.hold,
: null, onTapUp: controller.unhold,
), onTapCancel: controller.unhold,
alignment: Alignment( onVerticalDragStart: controller.hold,
controller.storyThemeData.alignmentX.toDouble() / 100, onVerticalDragEnd: controller.unhold,
controller.storyThemeData.alignmentY.toDouble() / 100, onHorizontalDragStart: controller.hold,
), onHorizontalDragEnd: controller.unhold,
child: LinkText( child: LinkText(
text: controller.loadingMode text: controller.loadingMode
? L10n.of(context)!.loadingPleaseWait ? L10n.of(context)!.loadingPleaseWait