mirror of
https://gitlab.com/veilid/veilidchat.git
synced 2025-07-23 06:31:13 -04:00
home layout
This commit is contained in:
Christien Rioux
parent
f754f7d5ed
commit
ca6b00e021
45 changed files with 2168 additions and 561 deletions
|
|
@ -1,10 +1,14 @@
|
|||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/scheduler.dart';
|
||||
import 'package:flutter_animate/flutter_animate.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:multi_split_view/multi_split_view.dart';
|
||||
import 'package:signal_strength_indicator/signal_strength_indicator.dart';
|
||||
|
||||
import '../components/chat.dart';
|
||||
import '../components/chat_list.dart';
|
||||
import '../providers/window_control.dart';
|
||||
import '../tools/tools.dart';
|
||||
import 'main_pager/main_pager.dart';
|
||||
|
||||
class HomePage extends ConsumerStatefulWidget {
|
||||
const HomePage({super.key});
|
||||
|
|
@ -17,6 +21,9 @@ class HomePage extends ConsumerStatefulWidget {
|
|||
class HomePageState extends ConsumerState<HomePage>
|
||||
with TickerProviderStateMixin {
|
||||
final _unfocusNode = FocusNode();
|
||||
|
||||
final MultiSplitViewController _splitController = MultiSplitViewController(
|
||||
areas: [Area(minimalSize: 300, weight: 0.25), Area(minimalSize: 300)]);
|
||||
final scaffoldKey = GlobalKey<ScaffoldState>();
|
||||
bool hasContainerTriggered = false;
|
||||
final animationsMap = {
|
||||
|
|
@ -38,12 +45,6 @@ class HomePageState extends ConsumerState<HomePage>
|
|||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
// // On page load action.
|
||||
// SchedulerBinding.instance.addPostFrameCallback((_) async {
|
||||
// await actions.initialize(
|
||||
// context,
|
||||
// );
|
||||
// });
|
||||
|
||||
setupAnimations(
|
||||
animationsMap.values.where((anim) =>
|
||||
|
|
@ -52,7 +53,11 @@ class HomePageState extends ConsumerState<HomePage>
|
|||
this,
|
||||
);
|
||||
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) => setState(() {}));
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) async {
|
||||
setState(() {});
|
||||
await ref.read(windowControlProvider.notifier).changeWindowSetup(
|
||||
TitleBarStyle.normal, OrientationCapability.normal);
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
|
|
@ -61,250 +66,66 @@ class HomePageState extends ConsumerState<HomePage>
|
|||
super.dispose();
|
||||
}
|
||||
|
||||
// ignore: prefer_expression_function_bodies
|
||||
Widget buildPhone(BuildContext context) {
|
||||
//
|
||||
return Material(
|
||||
color: Colors.transparent, elevation: 4, child: MainPager());
|
||||
}
|
||||
|
||||
// ignore: prefer_expression_function_bodies
|
||||
Widget buildTabletLeftPane(BuildContext context) {
|
||||
//
|
||||
return Material(
|
||||
color: Colors.transparent, elevation: 4, child: MainPager());
|
||||
}
|
||||
|
||||
// ignore: prefer_expression_function_bodies
|
||||
Widget buildTabletRightPane(BuildContext context) {
|
||||
//
|
||||
return Chat();
|
||||
}
|
||||
|
||||
// ignore: prefer_expression_function_bodies
|
||||
Widget buildTablet(BuildContext context) {
|
||||
final children = [
|
||||
buildTabletLeftPane(context),
|
||||
buildTabletRightPane(context),
|
||||
];
|
||||
|
||||
final multiSplitView = MultiSplitView(
|
||||
// onWeightChange: _onWeightChange,
|
||||
// onDividerTap: _onDividerTap,
|
||||
// onDividerDoubleTap: _onDividerDoubleTap,
|
||||
controller: _splitController,
|
||||
children: children);
|
||||
|
||||
final theme = MultiSplitViewTheme(
|
||||
data: isDesktop
|
||||
? MultiSplitViewThemeData(
|
||||
dividerThickness: 1,
|
||||
dividerPainter: DividerPainters.grooved2(thickness: 1))
|
||||
: MultiSplitViewThemeData(
|
||||
dividerThickness: 3,
|
||||
dividerPainter: DividerPainters.grooved2(thickness: 1)),
|
||||
child: multiSplitView);
|
||||
|
||||
return theme;
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) => Scaffold(
|
||||
key: scaffoldKey,
|
||||
appBar: AppBar(title: const Text('VeilidChat')),
|
||||
body: SafeArea(
|
||||
Widget build(BuildContext context) {
|
||||
ref.watch(windowControlProvider);
|
||||
|
||||
return SafeArea(
|
||||
child: GestureDetector(
|
||||
onTap: () => FocusScope.of(context).requestFocus(_unfocusNode),
|
||||
child: Stack(
|
||||
children: [
|
||||
if (responsiveVisibility(
|
||||
context: context,
|
||||
phone: false,
|
||||
))
|
||||
Align(
|
||||
alignment: AlignmentDirectional.centerEnd,
|
||||
child: Container(
|
||||
width: MediaQuery.of(context).size.width * 0.66,
|
||||
height: double.infinity,
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context).scaffoldBackgroundColor,
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
Container(
|
||||
width: double.infinity,
|
||||
height: double.infinity,
|
||||
decoration: const BoxDecoration(),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
children: [
|
||||
Container(
|
||||
width: double.infinity,
|
||||
height: 56,
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context).primaryColor,
|
||||
borderRadius: BorderRadius.circular(0),
|
||||
),
|
||||
child: Align(
|
||||
alignment: AlignmentDirectional.centerStart,
|
||||
child: Padding(
|
||||
padding:
|
||||
const EdgeInsetsDirectional.fromSTEB(
|
||||
16, 0, 16, 0),
|
||||
child: Text(
|
||||
"current contact",
|
||||
// getJsonField(
|
||||
// FFAppState().CurrentContact,
|
||||
// r'''$.name''',
|
||||
// ).toString(),
|
||||
textAlign: TextAlign.start,
|
||||
// style: Theme.of(context)
|
||||
// .textTheme....
|
||||
// .override(
|
||||
// fontFamily: 'Noto Sans',
|
||||
// color: FlutterFlowTheme.of(context)
|
||||
// .header,
|
||||
// ),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Container(
|
||||
width: double.infinity,
|
||||
height: 100,
|
||||
decoration: const BoxDecoration(),
|
||||
child: ChatComponentWidget(),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
// if (FFAppState().CurrentContact == null)
|
||||
// Container(
|
||||
// width: double.infinity,
|
||||
// height: double.infinity,
|
||||
// decoration: const BoxDecoration(),
|
||||
// child: NoContactComponentWidget(),
|
||||
// ),
|
||||
],
|
||||
),
|
||||
).animateOnActionTrigger(
|
||||
animationsMap['containerOnActionTriggerAnimation']!,
|
||||
hasBeenTriggered: hasContainerTriggered),
|
||||
),
|
||||
if (responsiveVisibility(
|
||||
context: context,
|
||||
phone: false,
|
||||
))
|
||||
Material(
|
||||
color: Colors.transparent,
|
||||
elevation: 4,
|
||||
child: Container(
|
||||
width: MediaQuery.of(context).size.width * 0.34,
|
||||
height: double.infinity,
|
||||
constraints: BoxConstraints(
|
||||
maxWidth: MediaQuery.of(context).size.width * 0.34,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context).scaffoldBackgroundColor,
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Container(
|
||||
width: double.infinity,
|
||||
height: 56,
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context).secondaryHeaderColor,
|
||||
borderRadius: BorderRadius.circular(0),
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsetsDirectional.fromSTEB(
|
||||
16, 8, 16, 8),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: [
|
||||
Expanded(
|
||||
child: Align(
|
||||
alignment: AlignmentDirectional.centerStart,
|
||||
child: Text(
|
||||
'Contacts',
|
||||
textAlign: TextAlign.start,
|
||||
// style: Theme.of(context).dialogTheme.titleTextStyle
|
||||
// .title2
|
||||
// .override(
|
||||
// fontFamily: 'Noto Sans',
|
||||
// color: FlutterFlowTheme.of(context)
|
||||
// .header,
|
||||
// ),
|
||||
),
|
||||
),
|
||||
),
|
||||
SignalStrengthIndicator.bars(
|
||||
value: .5, //_signalStrength,
|
||||
size: 50,
|
||||
barCount: 5,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Container(
|
||||
width: double.infinity,
|
||||
height: double.infinity,
|
||||
decoration: const BoxDecoration(
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
blurRadius: 0,
|
||||
color: Color(0x33000000),
|
||||
offset: Offset(0, 0),
|
||||
)
|
||||
],
|
||||
),
|
||||
child: ContactListComponentWidget(),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
if (responsiveVisibility(
|
||||
context: context,
|
||||
tablet: false,
|
||||
tabletLandscape: false,
|
||||
desktop: false,
|
||||
))
|
||||
Material(
|
||||
color: Colors.transparent,
|
||||
elevation: 4,
|
||||
child: Container(
|
||||
width: double.infinity,
|
||||
height: double.infinity,
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context).scaffoldBackgroundColor,
|
||||
),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Container(
|
||||
width: double.infinity,
|
||||
height: 56,
|
||||
decoration: BoxDecoration(
|
||||
//color: Theme.of(context).secondaryColor,
|
||||
borderRadius: BorderRadius.circular(0),
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsetsDirectional.fromSTEB(
|
||||
16, 8, 16, 8),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
children: [
|
||||
Expanded(
|
||||
child: Align(
|
||||
alignment:
|
||||
const AlignmentDirectional(-1, 0),
|
||||
child: Text(
|
||||
'Contacts',
|
||||
textAlign: TextAlign.start,
|
||||
// style: FlutterFlowTheme.of(context)
|
||||
// .title2
|
||||
// .override(
|
||||
// fontFamily: 'Noto Sans',
|
||||
// color: FlutterFlowTheme.of(context)
|
||||
// .header,
|
||||
// ),
|
||||
),
|
||||
),
|
||||
),
|
||||
SignalStrengthIndicator.bars(
|
||||
value: .5, //_signalStrength,
|
||||
size: 50,
|
||||
barCount: 5,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Container(
|
||||
width: double.infinity,
|
||||
height: double.infinity,
|
||||
decoration: const BoxDecoration(
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
blurRadius: 0,
|
||||
color: Color(0x33000000),
|
||||
offset: Offset(0, 0),
|
||||
)
|
||||
],
|
||||
),
|
||||
child: ContactListComponentWidget(),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
));
|
||||
onTap: () => FocusScope.of(context).requestFocus(_unfocusNode),
|
||||
child: responsiveVisibility(
|
||||
context: context,
|
||||
phone: false,
|
||||
)
|
||||
? buildTablet(context)
|
||||
: buildPhone(context),
|
||||
));
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue