fix phone layout

This commit is contained in:
Christien Rioux 2024-07-09 12:00:15 -04:00
parent 216aef8173
commit 68f7a26ed1
3 changed files with 62 additions and 90 deletions

View File

@ -20,7 +20,6 @@ class NoConversationWidget extends StatelessWidget {
), ),
child: Column( child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [ children: [
Icon( Icon(
Icons.diversity_3, Icons.diversity_3,

View File

@ -76,14 +76,11 @@ class _HomeAccountReadyMainState extends State<HomeAccountReadyMain> {
])); ]));
}); });
Widget buildPhone(BuildContext context) => Widget buildLeftPane(BuildContext context) => Builder(
Material(color: Colors.transparent, child: buildUserPanel());
Widget buildTabletLeftPane(BuildContext context) => Builder(
builder: (context) => builder: (context) =>
Material(color: Colors.transparent, child: buildUserPanel())); Material(color: Colors.transparent, child: buildUserPanel()));
Widget buildTabletRightPane(BuildContext context) { Widget buildRightPane(BuildContext context) {
final activeChatLocalConversationKey = final activeChatLocalConversationKey =
context.watch<ActiveChatCubit>().state; context.watch<ActiveChatCubit>().state;
if (activeChatLocalConversationKey == null) { if (activeChatLocalConversationKey == null) {
@ -94,42 +91,73 @@ class _HomeAccountReadyMainState extends State<HomeAccountReadyMain> {
key: ValueKey(activeChatLocalConversationKey)); key: ValueKey(activeChatLocalConversationKey));
} }
// ignore: prefer_expression_function_bodies @override
Widget buildTablet(BuildContext context) { Widget build(BuildContext context) {
final isLarge = responsiveVisibility(
context: context,
phone: false,
);
final w = MediaQuery.of(context).size.width; final w = MediaQuery.of(context).size.width;
final theme = Theme.of(context); final theme = Theme.of(context);
final scale = theme.extension<ScaleScheme>()!; final scale = theme.extension<ScaleScheme>()!;
final scaleConfig = theme.extension<ScaleConfig>()!; final scaleConfig = theme.extension<ScaleConfig>()!;
final children = [ final activeChat = context.watch<ActiveChatCubit>().state;
ConstrainedBox( final hasActiveChat = activeChat != null;
constraints: const BoxConstraints(minWidth: 300, maxWidth: 300), // if (hasActiveChat) {
// _chatAnimationController.forward();
// } else {
// _chatAnimationController.reset();
// }
late final bool offstageLeft;
late final bool offstageRight;
late final double leftWidth;
late final double rightWidth;
if (isLarge) {
leftWidth = 300;
rightWidth = w - 300 - 2;
offstageLeft = false;
offstageRight = false;
} else {
leftWidth = w;
rightWidth = w;
if (hasActiveChat) {
offstageLeft = true;
offstageRight = false;
} else {
offstageLeft = false;
offstageRight = true;
}
}
return Row(crossAxisAlignment: CrossAxisAlignment.stretch, children: [
Offstage(
offstage: offstageLeft,
child: ConstrainedBox( child: ConstrainedBox(
constraints: BoxConstraints(maxWidth: w / 2), constraints:
child: buildTabletLeftPane(context))), BoxConstraints(minWidth: leftWidth, maxWidth: leftWidth),
SizedBox( child: buildLeftPane(context))),
width: 2, Offstage(
height: double.infinity, offstage: offstageLeft || offstageRight,
child: ColoredBox( child: SizedBox(
color: scaleConfig.preferBorders width: 2,
? scale.primaryScale.subtleBorder height: double.infinity,
: scale.primaryScale.subtleBackground)), child: ColoredBox(
Expanded(child: buildTabletRightPane(context)), color: scaleConfig.preferBorders
]; ? scale.primaryScale.subtleBorder
: scale.primaryScale.subtleBackground))),
return Row( Offstage(
children: children, offstage: offstageRight,
); child: ConstrainedBox(
constraints:
BoxConstraints(minWidth: rightWidth, maxWidth: rightWidth),
child: buildRightPane(context),
)),
]);
} }
@override
Widget build(BuildContext context) => responsiveVisibility(
context: context,
phone: false,
)
? buildTablet(context)
: buildPhone(context);
//////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////
final _mainPagerKey = GlobalKey(debugLabel: '_mainPagerKey'); final _mainPagerKey = GlobalKey(debugLabel: '_mainPagerKey');
} }

View File

@ -1,14 +1,12 @@
import 'dart:math'; import 'dart:math';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_zoom_drawer/flutter_zoom_drawer.dart'; import 'package:flutter_zoom_drawer/flutter_zoom_drawer.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
import 'package:transitioned_indexed_stack/transitioned_indexed_stack.dart'; import 'package:transitioned_indexed_stack/transitioned_indexed_stack.dart';
import 'package:veilid_support/veilid_support.dart'; import 'package:veilid_support/veilid_support.dart';
import '../../account_manager/account_manager.dart'; import '../../account_manager/account_manager.dart';
import '../../chat/chat.dart';
import '../../theme/theme.dart'; import '../../theme/theme.dart';
import '../../tools/tools.dart'; import '../../tools/tools.dart';
import 'drawer_menu/drawer_menu.dart'; import 'drawer_menu/drawer_menu.dart';
@ -32,19 +30,6 @@ class HomeScreenState extends State<HomeScreen>
with SingleTickerProviderStateMixin { with SingleTickerProviderStateMixin {
@override @override
void initState() { void initState() {
// Chat animation setup (open in phone mode)
_chatAnimationController = AnimationController(
vsync: this,
duration: const Duration(milliseconds: 250),
);
_chatAnimation = Tween<Offset>(
begin: const Offset(1, 0),
end: Offset.zero,
).animate(CurvedAnimation(
parent: _chatAnimationController,
curve: Curves.easeInOut,
));
WidgetsBinding.instance.addPostFrameCallback((_) async { WidgetsBinding.instance.addPostFrameCallback((_) async {
final localAccounts = context.read<LocalAccountsCubit>().state; final localAccounts = context.read<LocalAccountsCubit>().state;
final activeLocalAccount = context.read<ActiveLocalAccountCubit>().state; final activeLocalAccount = context.read<ActiveLocalAccountCubit>().state;
@ -62,44 +47,6 @@ class HomeScreenState extends State<HomeScreen>
super.initState(); super.initState();
} }
@override
void dispose() {
_chatAnimationController.dispose();
super.dispose();
}
Widget _buildAccountReadyDeviceSpecific(BuildContext context) {
if (responsiveVisibility(
context: context,
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) {
_chatAnimationController.forward();
} else {
_chatAnimationController.reset();
}
},
builder: (context, activeChat) => Stack(
children: <Widget>[
const HomeAccountReadyMain(),
Offstage(
offstage: activeChat == null,
child: SlideTransition(
position: _chatAnimation,
child: const HomeAccountReadyChat())),
],
));
}
return const HomeAccountReadyMain();
}
Widget _buildAccountPage( Widget _buildAccountPage(
BuildContext context, BuildContext context,
TypedKey superIdentityRecordKey, TypedKey superIdentityRecordKey,
@ -117,7 +64,7 @@ class HomeScreenState extends State<HomeScreen>
// Re-export all ready blocs to the account display subtree // Re-export all ready blocs to the account display subtree
return perAccountCollectionState.provide( return perAccountCollectionState.provide(
child: Builder(builder: _buildAccountReadyDeviceSpecific)); child: const HomeAccountReadyMain());
} }
} }
@ -217,6 +164,4 @@ class HomeScreenState extends State<HomeScreen>
//////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////
final _zoomDrawerController = ZoomDrawerController(); final _zoomDrawerController = ZoomDrawerController();
late final Animation<Offset> _chatAnimation;
late final AnimationController _chatAnimationController;
} }