feat: change user avatar corner radius (#5461)

This commit is contained in:
Lucas.Xu 2024-06-04 15:59:56 +08:00 committed by GitHub
parent 57d4652824
commit 1757570337
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 48 additions and 33 deletions

View File

@ -28,17 +28,26 @@ class SidebarUser extends StatelessWidget {
child: BlocBuilder<MenuUserBloc, MenuUserState>(
builder: (context, state) => Row(
children: [
const HSpace(6),
const HSpace(4),
UserAvatar(
iconUrl: state.userProfile.iconUrl,
name: state.userProfile.name,
size: 16.0,
fontSize: 10.0,
size: 24.0,
fontSize: 16.0,
decoration: ShapeDecoration(
color: const Color(0xFFFBE8FB),
shape: RoundedRectangleBorder(
side: const BorderSide(width: 0.50, color: Color(0x19171717)),
borderRadius: BorderRadius.circular(8),
),
),
),
const HSpace(10),
const HSpace(8),
Expanded(child: _buildUserName(context, state)),
UserSettingButton(userProfile: state.userProfile),
const HSpace(8.0),
const NotificationButton(),
const HSpace(10.0),
],
),
),
@ -51,6 +60,7 @@ class SidebarUser extends StatelessWidget {
name,
overflow: TextOverflow.ellipsis,
color: Theme.of(context).colorScheme.tertiary,
fontSize: 15.0,
);
}

View File

@ -16,12 +16,14 @@ class UserAvatar extends StatelessWidget {
required this.size,
required this.fontSize,
this.isHovering = false,
this.decoration,
});
final String iconUrl;
final String name;
final double size;
final double fontSize;
final Decoration? decoration;
// If true, a border will be applied on top of the avatar
final bool isHovering;
@ -54,17 +56,18 @@ class UserAvatar extends StatelessWidget {
width: size,
height: size,
alignment: Alignment.center,
decoration: BoxDecoration(
color: color,
shape: BoxShape.circle,
border: isHovering
? Border.all(
color: _darken(color),
width: 4,
)
: null,
),
child: FlowyText.regular(
decoration: decoration ??
BoxDecoration(
color: color,
shape: BoxShape.circle,
border: isHovering
? Border.all(
color: _darken(color),
width: 4,
)
: null,
),
child: FlowyText.medium(
nameInitials,
color: Colors.black,
fontSize: fontSize,
@ -76,15 +79,16 @@ class UserAvatar extends StatelessWidget {
return SizedBox.square(
dimension: size,
child: DecoratedBox(
decoration: BoxDecoration(
shape: BoxShape.circle,
border: isHovering
? Border.all(
color: Theme.of(context).colorScheme.primary,
width: 4,
)
: null,
),
decoration: decoration ??
BoxDecoration(
shape: BoxShape.circle,
border: isHovering
? Border.all(
color: Theme.of(context).colorScheme.primary,
width: 4,
)
: null,
),
child: ClipRRect(
borderRadius: Corners.s5Border,
child: CircleAvatar(
@ -105,15 +109,16 @@ class UserAvatar extends StatelessWidget {
return SizedBox.square(
dimension: size,
child: DecoratedBox(
decoration: BoxDecoration(
shape: BoxShape.circle,
border: isHovering
? Border.all(
color: Theme.of(context).colorScheme.primary,
width: 4,
)
: null,
),
decoration: decoration ??
BoxDecoration(
shape: BoxShape.circle,
border: isHovering
? Border.all(
color: Theme.of(context).colorScheme.primary,
width: 4,
)
: null,
),
child: ClipRRect(
borderRadius: Corners.s5Border,
child: CircleAvatar(