mirror of
https://gitlab.com/famedly/fluffychat.git
synced 2024-12-02 17:29:34 +01:00
Merge branch 'krille/stories-design' into 'main'
design: Display own stories at first place and combine with new stories button See merge request famedly/fluffychat!812
This commit is contained in:
commit
15feef181a
@ -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),
|
|
||||||
),
|
|
||||||
...client.storiesRooms.map(
|
|
||||||
(room) => Opacity(
|
|
||||||
opacity: room.hasPosts ? 1 : 0.75,
|
opacity: room.hasPosts ? 1 : 0.75,
|
||||||
child: FutureBuilder<Profile>(
|
child: FutureBuilder<Profile>(
|
||||||
future: room.getCreatorProfile(),
|
future: room.getCreatorProfile(),
|
||||||
builder: (context, snapshot) {
|
builder: (context, snapshot) {
|
||||||
final displayname = snapshot.data?.displayName ??
|
final userId =
|
||||||
room
|
room.getState(EventTypes.RoomCreate)!.senderId;
|
||||||
.getState(EventTypes.RoomCreate)!
|
final displayname =
|
||||||
.senderId
|
snapshot.data?.displayName ?? userId.localpart!;
|
||||||
.localpart!;
|
|
||||||
final avatarUrl = snapshot.data?.avatarUrl;
|
final avatarUrl = snapshot.data?.avatarUrl;
|
||||||
return _StoryButton(
|
return _StoryButton(
|
||||||
label: displayname,
|
profile: Profile(
|
||||||
child: Avatar(
|
displayName: displayname,
|
||||||
mxContent: avatarUrl,
|
avatarUrl: avatarUrl,
|
||||||
name: displayname,
|
userId: userId,
|
||||||
size: 100,
|
|
||||||
fontSize: 24,
|
|
||||||
),
|
),
|
||||||
|
showEditFab: userId == client.userID,
|
||||||
unread: room.membership == Membership.invite ||
|
unread: room.membership == Membership.invite ||
|
||||||
room.hasNewMessages,
|
room.hasNewMessages,
|
||||||
onPressed: () =>
|
onPressed: () => _goToStoryAction(context, room.id),
|
||||||
_goToStoryAction(context, room.id),
|
|
||||||
onLongPressed: () =>
|
onLongPressed: () =>
|
||||||
_contextualActions(context, room),
|
_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(
|
||||||
|
children: [
|
||||||
|
Material(
|
||||||
color: Theme.of(context).colorScheme.surface,
|
color: Theme.of(context).colorScheme.surface,
|
||||||
borderRadius: BorderRadius.circular(Avatar.defaultSize),
|
borderRadius: BorderRadius.circular(Avatar.defaultSize),
|
||||||
child: Padding(
|
child: Padding(
|
||||||
padding: const EdgeInsets.all(2.0),
|
padding: const EdgeInsets.all(2.0),
|
||||||
child: CircleAvatar(
|
child: CircleAvatar(
|
||||||
radius: 30,
|
radius: 30,
|
||||||
backgroundColor: Theme.of(context).colorScheme.surface,
|
backgroundColor:
|
||||||
|
Theme.of(context).colorScheme.surface,
|
||||||
foregroundColor:
|
foregroundColor:
|
||||||
Theme.of(context).textTheme.bodyText1?.color,
|
Theme.of(context).textTheme.bodyText1?.color,
|
||||||
child: child,
|
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(
|
||||||
|
@ -227,7 +227,11 @@ class StoryPageController extends State<StoryPage> {
|
|||||||
|
|
||||||
void skip() {
|
void skip() {
|
||||||
if (index + 1 >= max) {
|
if (index + 1 >= max) {
|
||||||
|
if (isOwnStory) {
|
||||||
|
VRouter.of(context).to('/stories/create');
|
||||||
|
} else {
|
||||||
VRouter.of(context).to('/rooms');
|
VRouter.of(context).to('/rooms');
|
||||||
|
}
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
setState(() {
|
setState(() {
|
||||||
|
@ -225,16 +225,7 @@ class StoryView extends StatelessWidget {
|
|||||||
);
|
);
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
SafeArea(
|
AnimatedContainer(
|
||||||
child: GestureDetector(
|
|
||||||
onTapDown: controller.hold,
|
|
||||||
onTapUp: controller.unhold,
|
|
||||||
onTapCancel: controller.unhold,
|
|
||||||
onVerticalDragStart: controller.hold,
|
|
||||||
onVerticalDragEnd: controller.unhold,
|
|
||||||
onHorizontalDragStart: controller.hold,
|
|
||||||
onHorizontalDragEnd: controller.unhold,
|
|
||||||
child: AnimatedContainer(
|
|
||||||
duration: const Duration(milliseconds: 200),
|
duration: const Duration(milliseconds: 200),
|
||||||
padding: const EdgeInsets.all(16.0),
|
padding: const EdgeInsets.all(16.0),
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
@ -253,6 +244,15 @@ class StoryView extends StatelessWidget {
|
|||||||
controller.storyThemeData.alignmentX.toDouble() / 100,
|
controller.storyThemeData.alignmentX.toDouble() / 100,
|
||||||
controller.storyThemeData.alignmentY.toDouble() / 100,
|
controller.storyThemeData.alignmentY.toDouble() / 100,
|
||||||
),
|
),
|
||||||
|
child: SafeArea(
|
||||||
|
child: GestureDetector(
|
||||||
|
onTapDown: controller.hold,
|
||||||
|
onTapUp: controller.unhold,
|
||||||
|
onTapCancel: controller.unhold,
|
||||||
|
onVerticalDragStart: controller.hold,
|
||||||
|
onVerticalDragEnd: controller.unhold,
|
||||||
|
onHorizontalDragStart: controller.hold,
|
||||||
|
onHorizontalDragEnd: controller.unhold,
|
||||||
child: LinkText(
|
child: LinkText(
|
||||||
text: controller.loadingMode
|
text: controller.loadingMode
|
||||||
? L10n.of(context)!.loadingPleaseWait
|
? L10n.of(context)!.loadingPleaseWait
|
||||||
|
Loading…
Reference in New Issue
Block a user