chore: Adjust design of space avatars and more
This commit is contained in:
parent
e5000b83dd
commit
6d5ceba885
8 changed files with 70 additions and 57 deletions
|
|
@ -18,6 +18,7 @@ abstract class AppConfig {
|
|||
static const String pushNotificationsChannelId = 'fluffychat_push';
|
||||
static const String pushNotificationsAppId = 'chat.fluffy.fluffychat';
|
||||
static const double borderRadius = 18.0;
|
||||
static const double spaceBorderRadius = 11.0;
|
||||
static const double columnWidth = 360.0;
|
||||
|
||||
static const String website = 'https://fluffy.chat';
|
||||
|
|
|
|||
|
|
@ -78,10 +78,7 @@ class ChatAppBarTitle extends StatelessWidget {
|
|||
builder: (context, presence) {
|
||||
final lastActiveTimestamp =
|
||||
presence?.lastActiveTimestamp;
|
||||
final style = TextStyle(
|
||||
fontSize: 12,
|
||||
color: Theme.of(context).colorScheme.outline,
|
||||
);
|
||||
final style = TextStyle(fontSize: 11);
|
||||
if (presence?.currentlyActive == true) {
|
||||
return Text(
|
||||
L10n.of(context).currentlyActive,
|
||||
|
|
@ -108,23 +105,13 @@ class ChatAppBarTitle extends StatelessWidget {
|
|||
child: CircularProgressIndicator.adaptive(
|
||||
strokeWidth: 1,
|
||||
value: status.progress,
|
||||
valueColor: status.error != null
|
||||
? AlwaysStoppedAnimation<Color>(
|
||||
Theme.of(context).colorScheme.error,
|
||||
)
|
||||
: null,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 4),
|
||||
Expanded(
|
||||
child: Text(
|
||||
status.calcLocalizedString(context),
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
color: status.error != null
|
||||
? Theme.of(context).colorScheme.error
|
||||
: null,
|
||||
),
|
||||
style: TextStyle(fontSize: 12),
|
||||
),
|
||||
),
|
||||
],
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
import 'package:fluffychat/widgets/hover_builder.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'package:animations/animations.dart';
|
||||
|
|
@ -12,6 +11,7 @@ import 'package:fluffychat/pages/chat/recording_view_model.dart';
|
|||
import 'package:fluffychat/utils/other_party_can_receive.dart';
|
||||
import 'package:fluffychat/utils/platform_infos.dart';
|
||||
import 'package:fluffychat/widgets/avatar.dart';
|
||||
import 'package:fluffychat/widgets/hover_builder.dart';
|
||||
import 'package:fluffychat/widgets/matrix.dart';
|
||||
import '../../config/themes.dart';
|
||||
import 'chat.dart';
|
||||
|
|
|
|||
|
|
@ -59,9 +59,7 @@ class ChatListHeader extends StatelessWidget implements PreferredSizeWidget {
|
|||
? L10n.of(context).searchChatsRooms
|
||||
: status.calcLocalizedString(context),
|
||||
hintStyle: TextStyle(
|
||||
color: status.error != null
|
||||
? Colors.orange
|
||||
: theme.colorScheme.onPrimaryContainer,
|
||||
color: theme.colorScheme.onPrimaryContainer,
|
||||
fontWeight: FontWeight.normal,
|
||||
),
|
||||
prefixIcon: hide
|
||||
|
|
@ -87,11 +85,6 @@ class ChatListHeader extends StatelessWidget implements PreferredSizeWidget {
|
|||
child: CircularProgressIndicator.adaptive(
|
||||
strokeWidth: 2,
|
||||
value: status.progress,
|
||||
valueColor: status.error != null
|
||||
? const AlwaysStoppedAnimation<Color>(
|
||||
Colors.orange,
|
||||
)
|
||||
: null,
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
|
|||
|
|
@ -92,14 +92,19 @@ class ChatListItem extends StatelessWidget {
|
|||
top: 0,
|
||||
left: 0,
|
||||
child: Avatar(
|
||||
border: BorderSide(
|
||||
width: 2,
|
||||
color:
|
||||
backgroundColor ??
|
||||
theme.colorScheme.surface,
|
||||
shapeBorder: RoundedSuperellipseBorder(
|
||||
side: BorderSide(
|
||||
width: 2,
|
||||
color:
|
||||
backgroundColor ??
|
||||
theme.colorScheme.surface,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(
|
||||
AppConfig.spaceBorderRadius * 0.75,
|
||||
),
|
||||
),
|
||||
borderRadius: BorderRadius.circular(
|
||||
AppConfig.borderRadius / 4,
|
||||
AppConfig.spaceBorderRadius * 0.75,
|
||||
),
|
||||
mxContent: space.avatar,
|
||||
size: Avatar.defaultSize * 0.75,
|
||||
|
|
@ -111,22 +116,32 @@ class ChatListItem extends StatelessWidget {
|
|||
bottom: 0,
|
||||
right: 0,
|
||||
child: Avatar(
|
||||
border: space == null
|
||||
shapeBorder: space == null
|
||||
? room.isSpace
|
||||
? BorderSide(
|
||||
width: 1,
|
||||
color: theme.dividerColor,
|
||||
? RoundedSuperellipseBorder(
|
||||
side: BorderSide(
|
||||
width: 1,
|
||||
color: theme.dividerColor,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(
|
||||
AppConfig.spaceBorderRadius,
|
||||
),
|
||||
)
|
||||
: null
|
||||
: BorderSide(
|
||||
width: 2,
|
||||
color:
|
||||
backgroundColor ??
|
||||
theme.colorScheme.surface,
|
||||
: RoundedRectangleBorder(
|
||||
side: BorderSide(
|
||||
width: 2,
|
||||
color:
|
||||
backgroundColor ??
|
||||
theme.colorScheme.surface,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(
|
||||
Avatar.defaultSize,
|
||||
),
|
||||
),
|
||||
borderRadius: room.isSpace
|
||||
? BorderRadius.circular(
|
||||
AppConfig.borderRadius / 4,
|
||||
AppConfig.spaceBorderRadius,
|
||||
)
|
||||
: null,
|
||||
mxContent: room.avatar,
|
||||
|
|
|
|||
|
|
@ -403,8 +403,11 @@ class _SpaceViewState extends State<SpaceView> {
|
|||
size: avatarSize,
|
||||
mxContent: room?.avatar,
|
||||
name: displayname,
|
||||
border: BorderSide(width: 1, color: theme.dividerColor),
|
||||
borderRadius: BorderRadius.circular(AppConfig.borderRadius / 2),
|
||||
shapeBorder: RoundedSuperellipseBorder(
|
||||
side: BorderSide(width: 1, color: theme.dividerColor),
|
||||
borderRadius: BorderRadius.circular(AppConfig.spaceBorderRadius),
|
||||
),
|
||||
borderRadius: BorderRadius.circular(AppConfig.spaceBorderRadius),
|
||||
),
|
||||
title: Text(
|
||||
displayname,
|
||||
|
|
@ -637,11 +640,18 @@ class _SpaceViewState extends State<SpaceView> {
|
|||
textColor:
|
||||
item.name?.darkColor ??
|
||||
theme.colorScheme.onSurface,
|
||||
border: item.roomType == 'm.space'
|
||||
? BorderSide(
|
||||
color: theme
|
||||
.colorScheme
|
||||
.surfaceContainerHighest,
|
||||
shapeBorder: item.roomType == 'm.space'
|
||||
? RoundedSuperellipseBorder(
|
||||
side: BorderSide(
|
||||
color: theme
|
||||
.colorScheme
|
||||
.surfaceContainerHighest,
|
||||
),
|
||||
borderRadius:
|
||||
BorderRadius.circular(
|
||||
AppConfig.borderRadius /
|
||||
4,
|
||||
),
|
||||
)
|
||||
: null,
|
||||
borderRadius: item.roomType == 'm.space'
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ class Avatar extends StatelessWidget {
|
|||
final Color? presenceBackgroundColor;
|
||||
final BorderRadius? borderRadius;
|
||||
final IconData? icon;
|
||||
final BorderSide? border;
|
||||
final ShapeBorder? shapeBorder;
|
||||
final Color? backgroundColor;
|
||||
final Color? textColor;
|
||||
|
||||
|
|
@ -30,7 +30,7 @@ class Avatar extends StatelessWidget {
|
|||
this.presenceUserId,
|
||||
this.presenceBackgroundColor,
|
||||
this.borderRadius,
|
||||
this.border,
|
||||
this.shapeBorder,
|
||||
this.icon,
|
||||
this.backgroundColor,
|
||||
this.textColor,
|
||||
|
|
@ -61,10 +61,12 @@ class Avatar extends StatelessWidget {
|
|||
color: theme.brightness == Brightness.light
|
||||
? Colors.white
|
||||
: Colors.black,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: borderRadius,
|
||||
side: border ?? BorderSide.none,
|
||||
),
|
||||
shape:
|
||||
shapeBorder ??
|
||||
RoundedSuperellipseBorder(
|
||||
borderRadius: borderRadius,
|
||||
side: BorderSide.none,
|
||||
),
|
||||
clipBehavior: Clip.antiAlias,
|
||||
child: MxcImage(
|
||||
client: client,
|
||||
|
|
|
|||
|
|
@ -96,12 +96,17 @@ class SpacesNavigationRail extends StatelessWidget {
|
|||
icon: Avatar(
|
||||
mxContent: allSpaces[i].avatar,
|
||||
name: displayname,
|
||||
border: BorderSide(
|
||||
width: 1,
|
||||
color: Theme.of(context).dividerColor,
|
||||
shapeBorder: RoundedSuperellipseBorder(
|
||||
side: BorderSide(
|
||||
width: 1,
|
||||
color: Theme.of(context).dividerColor,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(
|
||||
AppConfig.spaceBorderRadius,
|
||||
),
|
||||
),
|
||||
borderRadius: BorderRadius.circular(
|
||||
AppConfig.borderRadius / 2,
|
||||
AppConfig.spaceBorderRadius,
|
||||
),
|
||||
),
|
||||
);
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue