layout fixes

This commit is contained in:
Christien Rioux 2024-07-08 21:29:52 -04:00
parent 71f4d37efa
commit 216aef8173
56 changed files with 654 additions and 342 deletions

View file

@ -1,7 +1,6 @@
import 'package:async_tools/async_tools.dart';
import 'package:awesome_extensions/awesome_extensions.dart';
import 'package:fast_immutable_collections/fast_immutable_collections.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/flutter_svg.dart';
@ -20,7 +19,7 @@ class DrawerMenu extends StatefulWidget {
const DrawerMenu({super.key});
@override
State createState() => _DrawerMenuState();
State<DrawerMenu> createState() => _DrawerMenuState();
}
class _DrawerMenuState extends State<DrawerMenu> {
@ -105,10 +104,12 @@ class _DrawerMenuState extends State<DrawerMenu> {
width: 34,
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(
color: border,
width: 2,
strokeAlign: BorderSide.strokeAlignOutside),
border: scaleConfig.preferBorders
? Border.all(
color: border,
width: 2,
strokeAlign: BorderSide.strokeAlignOutside)
: null,
color: Colors.blue,
),
child: AvatarImage(
@ -130,9 +131,18 @@ class _DrawerMenuState extends State<DrawerMenu> {
backgroundColor: background,
backgroundHoverColor: hoverBackground,
backgroundFocusColor: activeBackground,
borderColor: border,
borderHoverColor: hoverBorder,
borderFocusColor: activeBorder,
borderColor:
(scaleConfig.preferBorders || scaleConfig.useVisualIndicators)
? border
: null,
borderHoverColor:
(scaleConfig.preferBorders || scaleConfig.useVisualIndicators)
? hoverBorder
: null,
borderFocusColor:
(scaleConfig.preferBorders || scaleConfig.useVisualIndicators)
? activeBorder
: null,
borderRadius: 16 * scaleConfig.borderRadiusScale,
callback: callback,
footerButtonIcon: loggedIn ? Icons.edit_outlined : null,
@ -143,7 +153,7 @@ class _DrawerMenuState extends State<DrawerMenu> {
));
}
Widget _getAccountList(
List<Widget> _getAccountList(
{required IList<LocalAccount> localAccounts,
required TypedKey? activeLocalAccount,
required PerAccountCollectionBlocMapState
@ -164,7 +174,9 @@ class _DrawerMenuState extends State<DrawerMenu> {
final avAccountRecordState = perAccountState?.avAccountRecordState;
if (perAccountState != null && avAccountRecordState != null) {
// Account is logged in
final scale = theme.extension<ScaleScheme>()!.primaryScale;
final scale = scaleConfig.useVisualIndicators
? theme.extension<ScaleScheme>()!.primaryScale
: theme.extension<ScaleScheme>()!.tertiaryScale;
final loggedInAccount = avAccountRecordState.when(
data: (value) => _makeAccountWidget(
name: value.profile.name,
@ -209,14 +221,7 @@ class _DrawerMenuState extends State<DrawerMenu> {
}
// Assemble main menu
final mainMenu = <Widget>[...loggedInAccounts, ...loggedOutAccounts];
// Return main menu widgets
return Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[...mainMenu],
);
return <Widget>[...loggedInAccounts, ...loggedOutAccounts];
}
Widget _getButton(
@ -262,18 +267,18 @@ class _DrawerMenuState extends State<DrawerMenu> {
}), shape: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.hovered)) {
return RoundedRectangleBorder(
side: BorderSide(color: hoverBorder),
side: BorderSide(color: hoverBorder, width: 2),
borderRadius: BorderRadius.all(
Radius.circular(16 * scaleConfig.borderRadiusScale)));
}
if (states.contains(WidgetState.focused)) {
return RoundedRectangleBorder(
side: BorderSide(color: activeBorder),
side: BorderSide(color: activeBorder, width: 2),
borderRadius: BorderRadius.all(
Radius.circular(16 * scaleConfig.borderRadiusScale)));
}
return RoundedRectangleBorder(
side: BorderSide(color: border),
side: BorderSide(color: border, width: 2),
borderRadius: BorderRadius.all(
Radius.circular(16 * scaleConfig.borderRadiusScale)));
})),
@ -306,7 +311,7 @@ class _DrawerMenuState extends State<DrawerMenu> {
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [settingsButton, addButton]).paddingLTRB(0, 16, 0, 0);
children: [settingsButton, addButton]).paddingLTRB(0, 16, 0, 16);
}
@override
@ -323,8 +328,8 @@ class _DrawerMenuState extends State<DrawerMenu> {
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
scale.tertiaryScale.border,
scale.tertiaryScale.subtleBorder,
scale.tertiaryScale.subtleBackground,
]);
return DecoratedBox(
@ -391,35 +396,21 @@ class _DrawerMenuState extends State<DrawerMenu> {
? grayColorFilter
: null),
]))),
const Spacer(),
DecoratedBox(
decoration: ShapeDecoration(
shape: RoundedRectangleBorder(
side: !scaleConfig.useVisualIndicators
? BorderSide.none
: scaleConfig.preferBorders
? BorderSide(color: scale.tertiaryScale.border)
: BorderSide(color: scale.tertiaryScale.primary),
borderRadius: BorderRadius.circular(
16 * scaleConfig.borderRadiusScale)),
color: scaleConfig.preferBorders
? Colors.transparent
: scale.tertiaryScale.border.withAlpha(0x5F)),
child: Column(children: [
Text(translate('menu.accounts'),
style: theme.textTheme.titleMedium!.copyWith(
color: scaleConfig.preferBorders
? scale.tertiaryScale.border
: scale.tertiaryScale.primary))
.paddingLTRB(0, 0, 0, 16),
_getAccountList(
localAccounts: localAccounts,
activeLocalAccount: activeLocalAccount,
perAccountCollectionBlocMapState:
perAccountCollectionBlocMapState)
]).paddingAll(16)),
Text(translate('menu.accounts'),
style: theme.textTheme.titleMedium!.copyWith(
color: scaleConfig.preferBorders
? scale.tertiaryScale.border
: scale.tertiaryScale.borderText))
.paddingLTRB(0, 16, 0, 16),
ListView(
shrinkWrap: true,
children: _getAccountList(
localAccounts: localAccounts,
activeLocalAccount: activeLocalAccount,
perAccountCollectionBlocMapState:
perAccountCollectionBlocMapState))
.expanded(),
_getBottomButtons(),
const Spacer(),
Row(children: [
Text('${translate('menu.version')} $packageInfoVersion',
style: theme.textTheme.labelMedium!

View file

@ -72,7 +72,7 @@ class MenuItemWidget extends StatelessWidget {
).paddingAll(8)),
),
if (footerButtonIcon != null)
IconButton.outlined(
IconButton(
color: footerButtonIconColor,
focusColor: footerButtonIconFocusColor,
hoverColor: footerButtonIconHoverColor,

View file

@ -34,6 +34,7 @@ class HomeAccountReadyChatState extends State<HomeAccountReadyChat> {
@override
Widget build(BuildContext context) => SafeArea(
bottom: false,
child: buildChatComponent(context),
);
}

View file

@ -1,5 +1,4 @@
import 'package:awesome_extensions/awesome_extensions.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_translate/flutter_translate.dart';
@ -9,7 +8,6 @@ import '../../../account_manager/account_manager.dart';
import '../../../chat/chat.dart';
import '../../../proto/proto.dart' as proto;
import '../../../theme/theme.dart';
import '../../../tools/tools.dart';
import 'main_pager/main_pager.dart';
class HomeAccountReadyMain extends StatefulWidget {
@ -44,7 +42,7 @@ class _HomeAccountReadyMainState extends State<HomeAccountReadyMain> {
? scale.primaryScale.border
: scale.primaryScale.borderText,
constraints:
const BoxConstraints.expand(height: 64, width: 64),
const BoxConstraints.expand(height: 48, width: 48),
style: ButtonStyle(
backgroundColor: WidgetStateProperty.all(
scaleConfig.preferBorders
@ -61,7 +59,7 @@ class _HomeAccountReadyMainState extends State<HomeAccountReadyMain> {
: scale.primaryScale.borderText,
width: 2),
borderRadius: BorderRadius.all(Radius.circular(
16 * scaleConfig.borderRadiusScale))),
12 * scaleConfig.borderRadiusScale))),
)),
tooltip: translate('menu.settings_tooltip'),
onPressed: () async {
@ -69,7 +67,10 @@ class _HomeAccountReadyMainState extends State<HomeAccountReadyMain> {
await ctrl.toggle?.call();
//await GoRouterHelper(context).push('/settings');
}).paddingLTRB(0, 0, 8, 0),
ProfileWidget(profile: profile).expanded(),
ProfileWidget(
profile: profile,
showPronouns: false,
).expanded(),
]).paddingAll(8),
MainPager(key: _mainPagerKey).expanded()
]));

View file

@ -55,6 +55,8 @@ class AccountPageState extends State<AccountPage> {
tilePadding: const EdgeInsets.fromLTRB(8, 0, 8, 0),
backgroundColor: scale.primaryScale.border,
collapsedBackgroundColor: scale.primaryScale.border,
dense: true,
minTileHeight: 16,
shape: RoundedRectangleBorder(
borderRadius:
BorderRadius.circular(16 * scaleConfig.borderRadiusScale),
@ -66,10 +68,11 @@ class AccountPageState extends State<AccountPage> {
title: Text(
translate('account_page.contact_invitations'),
textAlign: TextAlign.center,
style: textTheme.titleMedium!
style: textTheme.titleSmall!
.copyWith(color: scale.primaryScale.borderText),
),
iconColor: scale.primaryScale.borderText,
collapsedIconColor: scale.primaryScale.borderText,
initiallyExpanded: true,
children: [
ContactInvitationListWidget(

View file

@ -46,6 +46,7 @@ class BottomSheetActionButtonState extends State<BottomSheetActionButton> {
return _showFab
? FloatingActionButton(
elevation: 0,
heroTag: this,
hoverElevation: 0,
shape: widget.shape,
foregroundColor: widget.foregroundColor,

View file

@ -113,7 +113,7 @@ class MainPagerState extends State<MainPager> with TickerProviderStateMixin {
padding: const EdgeInsets.symmetric(horizontal: 4),
child: Text(
_bottomLabelList[index],
style: theme.textTheme.labelLarge!.copyWith(
style: theme.textTheme.labelMedium!.copyWith(
fontWeight: isActive ? FontWeight.bold : FontWeight.normal,
color: color),
),

View file

@ -74,7 +74,10 @@ class HomeScreenState extends State<HomeScreen>
tablet: false,
tabletLandscape: false,
desktop: false)) {
final activeChatCubit = context.watch<ActiveChatCubit>();
return BlocConsumer<ActiveChatCubit, TypedKey?>(
bloc: activeChatCubit,
listener: (context, activeChat) {
final hasActiveChat = activeChat != null;
if (hasActiveChat) {
@ -179,6 +182,7 @@ class HomeScreenState extends State<HomeScreen>
final canClose = activeIndex != -1;
return SafeArea(
bottom: false,
child: DefaultTextStyle(
style: theme.textTheme.bodySmall!,
child: ZoomDrawer(