mirror of
https://gitlab.com/veilid/veilidchat.git
synced 2024-09-19 21:15:38 +00:00
fix phone layout
This commit is contained in:
parent
216aef8173
commit
68f7a26ed1
@ -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,
|
||||||
|
@ -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');
|
||||||
}
|
}
|
||||||
|
@ -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;
|
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user