231 lines
8.0 KiB
Dart
231 lines
8.0 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:get/get.dart';
|
|
import 'package:on_field_work/controller/project_controller.dart';
|
|
import 'package:on_field_work/helpers/widgets/my_spacing.dart';
|
|
import 'package:on_field_work/helpers/widgets/my_text.dart';
|
|
import 'package:on_field_work/helpers/utils/mixins/ui_mixin.dart';
|
|
|
|
class CustomAppBar extends StatefulWidget
|
|
with UIMixin
|
|
implements PreferredSizeWidget {
|
|
final String title;
|
|
final String? projectName; // If passed, show static text
|
|
final VoidCallback? onBackPressed;
|
|
final Color? backgroundColor;
|
|
|
|
CustomAppBar({
|
|
super.key,
|
|
required this.title,
|
|
this.projectName,
|
|
this.onBackPressed,
|
|
this.backgroundColor,
|
|
});
|
|
|
|
@override
|
|
Size get preferredSize => const Size.fromHeight(72);
|
|
|
|
@override
|
|
State<CustomAppBar> createState() => _CustomAppBarState();
|
|
}
|
|
|
|
class _CustomAppBarState extends State<CustomAppBar> with UIMixin {
|
|
final ProjectController projectController = Get.find();
|
|
OverlayEntry? _overlayEntry;
|
|
final LayerLink _layerLink = LayerLink();
|
|
|
|
void _toggleDropdown() {
|
|
if (_overlayEntry == null) {
|
|
_overlayEntry = _createOverlayEntry();
|
|
Overlay.of(context).insert(_overlayEntry!);
|
|
} else {
|
|
_overlayEntry?.remove();
|
|
_overlayEntry = null;
|
|
}
|
|
}
|
|
|
|
OverlayEntry _createOverlayEntry() {
|
|
final renderBox = context.findRenderObject() as RenderBox;
|
|
final size = renderBox.size;
|
|
final offset = renderBox.localToGlobal(Offset.zero);
|
|
|
|
return OverlayEntry(
|
|
builder: (context) => GestureDetector(
|
|
onTap: () {
|
|
_toggleDropdown();
|
|
},
|
|
behavior: HitTestBehavior.translucent,
|
|
child: Stack(
|
|
children: [
|
|
Positioned(
|
|
left: offset.dx + 16,
|
|
top: offset.dy + size.height,
|
|
width: size.width - 32,
|
|
child: Material(
|
|
elevation: 4,
|
|
borderRadius: BorderRadius.circular(5),
|
|
child: Container(
|
|
height: MediaQuery.of(context).size.height * 0.33,
|
|
padding: const EdgeInsets.all(8),
|
|
decoration: BoxDecoration(
|
|
color: Colors.white,
|
|
borderRadius: BorderRadius.circular(5),
|
|
),
|
|
child: Column(
|
|
children: [
|
|
TextField(
|
|
decoration: InputDecoration(
|
|
hintText: "Search project...",
|
|
isDense: true,
|
|
prefixIcon: const Icon(Icons.search),
|
|
border: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(5)),
|
|
),
|
|
),
|
|
Expanded(
|
|
child: ListView.builder(
|
|
itemCount: projectController.projects.length,
|
|
itemBuilder: (_, index) {
|
|
final project = projectController.projects[index];
|
|
return RadioListTile<String>(
|
|
dense: true,
|
|
value: project.id,
|
|
groupValue:
|
|
projectController.selectedProjectId.value,
|
|
onChanged: (v) {
|
|
if (v != null) {
|
|
projectController.updateSelectedProject(v);
|
|
_toggleDropdown();
|
|
}
|
|
},
|
|
title: Text(project.name),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final Color effectiveBackgroundColor =
|
|
widget.backgroundColor ?? contentTheme.primary;
|
|
const Color onPrimaryColor = Colors.white;
|
|
|
|
final bool showDropdown = widget.projectName == null;
|
|
|
|
return AppBar(
|
|
backgroundColor: effectiveBackgroundColor,
|
|
elevation: 0,
|
|
automaticallyImplyLeading: false,
|
|
titleSpacing: 0,
|
|
shadowColor: Colors.transparent,
|
|
leading: Padding(
|
|
padding: MySpacing.only(left: 16),
|
|
child: IconButton(
|
|
icon: const Icon(
|
|
Icons.arrow_back_ios_new,
|
|
color: onPrimaryColor,
|
|
size: 20,
|
|
),
|
|
onPressed: widget.onBackPressed ?? () => Get.back(),
|
|
padding: EdgeInsets.zero,
|
|
constraints: const BoxConstraints(),
|
|
),
|
|
),
|
|
title: Padding(
|
|
padding: MySpacing.only(right: 16, left: 8),
|
|
child: Row(
|
|
children: [
|
|
Expanded(
|
|
child: Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
MyText.titleLarge(
|
|
widget.title,
|
|
fontWeight: 800,
|
|
color: onPrimaryColor,
|
|
overflow: TextOverflow.ellipsis,
|
|
maxLines: 1,
|
|
),
|
|
MySpacing.height(3),
|
|
showDropdown
|
|
? CompositedTransformTarget(
|
|
link: _layerLink,
|
|
child: GestureDetector(
|
|
onTap: _toggleDropdown,
|
|
child: Row(
|
|
children: [
|
|
const Icon(Icons.folder_open,
|
|
size: 14, color: onPrimaryColor),
|
|
MySpacing.width(4),
|
|
Flexible(
|
|
child: Obx(() {
|
|
final projectName = projectController
|
|
.selectedProject?.name ??
|
|
'Select Project';
|
|
return MyText.bodySmall(
|
|
projectName,
|
|
fontWeight: 500,
|
|
color: onPrimaryColor.withOpacity(0.8),
|
|
overflow: TextOverflow.ellipsis,
|
|
maxLines: 1,
|
|
);
|
|
}),
|
|
),
|
|
MySpacing.width(2),
|
|
const Icon(Icons.keyboard_arrow_down,
|
|
size: 18, color: onPrimaryColor),
|
|
],
|
|
),
|
|
),
|
|
)
|
|
: Row(
|
|
children: [
|
|
const Icon(Icons.folder_open,
|
|
size: 14, color: onPrimaryColor),
|
|
MySpacing.width(4),
|
|
Flexible(
|
|
child: MyText.bodySmall(
|
|
widget.projectName!,
|
|
fontWeight: 500,
|
|
color: onPrimaryColor.withOpacity(0.8),
|
|
overflow: TextOverflow.ellipsis,
|
|
maxLines: 1,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
actions: [
|
|
Padding(
|
|
padding: MySpacing.only(right: 16),
|
|
child: IconButton(
|
|
icon: const Icon(Icons.home, color: onPrimaryColor, size: 24),
|
|
onPressed: () => Get.offAllNamed('/dashboard'),
|
|
),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
_overlayEntry?.remove();
|
|
super.dispose();
|
|
}
|
|
}
|