chore: Expand role card if needed/available space
This commit is contained in:
parent
84ca5a79ee
commit
af996b298c
4 changed files with 42 additions and 29 deletions
|
|
@ -45,6 +45,7 @@ class ActivityParticipantIndicator extends StatelessWidget {
|
|||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
final borderRadius = this.borderRadius ?? BorderRadius.circular(8.0);
|
||||
return MouseRegion(
|
||||
cursor: SystemMouseCursors.basic,
|
||||
child: GestureDetector(
|
||||
|
|
@ -99,20 +100,21 @@ class ActivityParticipantIndicator extends StatelessWidget {
|
|||
opacity: opacity,
|
||||
child: ShimmerBackground(
|
||||
enabled: shimmer,
|
||||
borderRadius: borderRadius,
|
||||
child: Container(
|
||||
alignment: Alignment.center,
|
||||
padding: padding ??
|
||||
const EdgeInsets.symmetric(
|
||||
vertical: 4.0,
|
||||
horizontal: 8.0,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: borderRadius ?? BorderRadius.circular(8.0),
|
||||
borderRadius: borderRadius,
|
||||
color: (hovered || selected) && selectable
|
||||
? theme.colorScheme.surfaceContainerHighest
|
||||
: theme.colorScheme.surface.withAlpha(130),
|
||||
),
|
||||
height: 125.0,
|
||||
constraints: const BoxConstraints(maxWidth: 100.0),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
|
|
|
|||
|
|
@ -52,10 +52,9 @@ class ActivityParticipantList extends StatelessWidget {
|
|||
spacing: 12.0,
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Wrap(
|
||||
alignment: WrapAlignment.center,
|
||||
spacing: 12.0,
|
||||
runSpacing: 12.0,
|
||||
Row(
|
||||
spacing: 8.0,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: availableRoles.map((availableRole) {
|
||||
final selected =
|
||||
isSelected != null ? isSelected!(availableRole.id) : false;
|
||||
|
|
@ -83,18 +82,21 @@ class ActivityParticipantList extends StatelessWidget {
|
|||
? isShimmering!(availableRole.id)
|
||||
: false;
|
||||
|
||||
return ActivityParticipantIndicator(
|
||||
name: availableRole.name,
|
||||
userId: assignedRole?.userId,
|
||||
opacity: getOpacity != null ? getOpacity!(assignedRole) : 1.0,
|
||||
user: user,
|
||||
onTap: onTap != null && selectable
|
||||
? () => onTap!(availableRole.id)
|
||||
: null,
|
||||
selected: selected,
|
||||
selectable: selectable,
|
||||
shimmer: shimmering,
|
||||
room: room,
|
||||
return Expanded(
|
||||
child: ActivityParticipantIndicator(
|
||||
name: availableRole.name,
|
||||
userId: assignedRole?.userId,
|
||||
opacity:
|
||||
getOpacity != null ? getOpacity!(assignedRole) : 1.0,
|
||||
user: user,
|
||||
onTap: onTap != null && selectable
|
||||
? () => onTap!(availableRole.id)
|
||||
: null,
|
||||
selected: selected,
|
||||
selectable: selectable,
|
||||
shimmer: shimmering,
|
||||
room: room,
|
||||
),
|
||||
);
|
||||
}).toList(),
|
||||
),
|
||||
|
|
|
|||
|
|
@ -290,14 +290,20 @@ class ButtonControlledCarouselView extends StatelessWidget {
|
|||
(role) => role.userId == p.participantId,
|
||||
);
|
||||
final userRoleInfo = availableRoles[userRole.id]!;
|
||||
return ActivityParticipantIndicator(
|
||||
name: userRoleInfo.name,
|
||||
userId: p.participantId,
|
||||
user: user,
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
selected: highlightedRole?.id == userRole.id,
|
||||
onTap: () => _scrollToUser(userRole, index, cardWidth),
|
||||
room: controller.room,
|
||||
return SizedBox(
|
||||
width: 100.0,
|
||||
height: 125.0,
|
||||
child: Center(
|
||||
child: ActivityParticipantIndicator(
|
||||
name: userRoleInfo.name,
|
||||
userId: p.participantId,
|
||||
user: user,
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
selected: highlightedRole?.id == userRole.id,
|
||||
onTap: () => _scrollToUser(userRole, index, cardWidth),
|
||||
room: controller.room,
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@ class ShimmerBackground extends StatelessWidget {
|
|||
final Color shimmerColor;
|
||||
final Color? baseColor;
|
||||
final bool enabled;
|
||||
final BorderRadius? borderRadius;
|
||||
|
||||
const ShimmerBackground({
|
||||
super.key,
|
||||
|
|
@ -16,10 +17,13 @@ class ShimmerBackground extends StatelessWidget {
|
|||
this.shimmerColor = AppConfig.goldLight,
|
||||
this.baseColor,
|
||||
this.enabled = true,
|
||||
this.borderRadius,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final borderRadius =
|
||||
this.borderRadius ?? BorderRadius.circular(AppConfig.borderRadius);
|
||||
return Stack(
|
||||
children: [
|
||||
child,
|
||||
|
|
@ -27,7 +31,7 @@ class ShimmerBackground extends StatelessWidget {
|
|||
Positioned.fill(
|
||||
child: IgnorePointer(
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
|
||||
borderRadius: borderRadius,
|
||||
child: Shimmer.fromColors(
|
||||
baseColor: baseColor ?? shimmerColor.withValues(alpha: 0.1),
|
||||
highlightColor: shimmerColor.withValues(alpha: 0.6),
|
||||
|
|
@ -35,8 +39,7 @@ class ShimmerBackground extends StatelessWidget {
|
|||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: shimmerColor.withValues(alpha: 0.3),
|
||||
borderRadius:
|
||||
BorderRadius.circular(AppConfig.borderRadius),
|
||||
borderRadius: borderRadius,
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue