mirror of
https://gitlab.com/veilid/veilidchat.git
synced 2025-08-20 11:48:16 -04:00
layout fixes
This commit is contained in:
parent
71f4d37efa
commit
216aef8173
56 changed files with 654 additions and 342 deletions
|
@ -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!
|
||||
|
|
|
@ -72,7 +72,7 @@ class MenuItemWidget extends StatelessWidget {
|
|||
).paddingAll(8)),
|
||||
),
|
||||
if (footerButtonIcon != null)
|
||||
IconButton.outlined(
|
||||
IconButton(
|
||||
color: footerButtonIconColor,
|
||||
focusColor: footerButtonIconFocusColor,
|
||||
hoverColor: footerButtonIconHoverColor,
|
||||
|
|
|
@ -34,6 +34,7 @@ class HomeAccountReadyChatState extends State<HomeAccountReadyChat> {
|
|||
|
||||
@override
|
||||
Widget build(BuildContext context) => SafeArea(
|
||||
bottom: false,
|
||||
child: buildChatComponent(context),
|
||||
);
|
||||
}
|
||||
|
|
|
@ -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()
|
||||
]));
|
||||
|
|
|
@ -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(
|
||||
|
|
|
@ -46,6 +46,7 @@ class BottomSheetActionButtonState extends State<BottomSheetActionButton> {
|
|||
return _showFab
|
||||
? FloatingActionButton(
|
||||
elevation: 0,
|
||||
heroTag: this,
|
||||
hoverElevation: 0,
|
||||
shape: widget.shape,
|
||||
foregroundColor: widget.foregroundColor,
|
||||
|
|
|
@ -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),
|
||||
),
|
||||
|
|
|
@ -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(
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue