assistant employee selection sheet ui improvement.

design_3.0_TM_Module_snagsFix
Sikander Saleem 2 months ago
parent 7efeeed619
commit 5e9e8dc870

@ -3,6 +3,7 @@ import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/modules/cm_module/views/components/action_button/footer_action_button.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import 'package:test_sa/new_views/common_widgets/app_filled_button.dart';
@ -45,121 +46,118 @@ class _SelectionBottomSheetState<T> extends State<SelectionBottomSheet<T>> {
@override
Widget build(BuildContext context) {
return SafeArea(
child: Container(
height: MediaQuery.of(context).size.height * .7,
color: Theme.of(context).scaffoldBackgroundColor,
padding: const EdgeInsets.all(21),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
widget.title.heading5(context).expanded,
if (widget.showCancel)
AnimatedOpacity(
opacity: _selectedValue != null ? 1 : 0,
duration: const Duration(milliseconds: 250),
child: Container(
height: 30,
decoration: BoxDecoration(color: const Color(0xffF63939).withOpacity(.75), borderRadius: BorderRadius.circular(30)),
padding: const EdgeInsets.only(left: 8, right: 12, top: 4, bottom: 4),
alignment: Alignment.center,
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(Icons.clear, color: Colors.white, size: 16),
4.width,
const Text(
"Clear",
style: TextStyle(fontSize: 14, color: Colors.white),
)
],
),
).onPress(_selectedValue != null
? () {
Navigator.pop(context);
widget.onSelect(null);
}
: null),
),
],
),
16.height,
TextField(
onChanged: (queryString) {
query = queryString;
setState(() {});
},
style: const TextStyle(fontSize: 14),
focusNode: searchFocusNode,
decoration: InputDecoration(
hintText: 'Search by name',
labelText: 'Search',
labelStyle: TextStyle(color: AppColor.textColor(context)),
filled: true,
fillColor: AppColor.fieldBgColor(context),
hintStyle: const TextStyle(fontSize: 14),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: AppColor.blueStatus(context), width: 2.0),
borderRadius: const BorderRadius.all(Radius.circular(12.0)),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: AppColor.blueStatus(context), width: 1.0),
borderRadius: const BorderRadius.all(Radius.circular(12.0)),
return Container(
height: MediaQuery.of(context).size.height * .7,
color: Theme.of(context).scaffoldBackgroundColor,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
widget.title.heading5(context).expanded,
if (widget.showCancel)
AnimatedOpacity(
opacity: _selectedValue != null ? 1 : 0,
duration: const Duration(milliseconds: 250),
child: Container(
height: 30,
decoration: BoxDecoration(color: const Color(0xffF63939).withOpacity(.75), borderRadius: BorderRadius.circular(30)),
padding: const EdgeInsets.only(left: 8, right: 12, top: 4, bottom: 4),
alignment: Alignment.center,
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(Icons.clear, color: Colors.white, size: 16),
4.width,
const Text(
"Clear",
style: TextStyle(fontSize: 14, color: Colors.white),
)
],
),
).onPress(_selectedValue != null
? () {
Navigator.pop(context);
widget.onSelect(null);
}
: null),
),
contentPadding: const EdgeInsets.symmetric(vertical: 8.0, horizontal: 16.0),
],
).paddingOnly(top: 16, start: 16, end: 16, bottom: 0),
TextField(
onChanged: (queryString) {
query = queryString;
setState(() {});
},
style: const TextStyle(fontSize: 14),
focusNode: searchFocusNode,
decoration: InputDecoration(
hintText: 'Search by name',
labelText: 'Search',
labelStyle: TextStyle(color: AppColor.textColor(context)),
filled: true,
fillColor: AppColor.fieldBgColor(context),
hintStyle: const TextStyle(fontSize: 14),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: AppColor.blueStatus(context), width: 2.0),
borderRadius: const BorderRadius.all(Radius.circular(12.0)),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: AppColor.blueStatus(context), width: 1.0),
borderRadius: const BorderRadius.all(Radius.circular(12.0)),
),
contentPadding: const EdgeInsets.symmetric(vertical: 8.0, horizontal: 16.0),
),
8.height,
Expanded(
// Wrap ListView with Expanded
child: ListView.builder(
itemCount: filteredList?.length,
padding: const EdgeInsets.only(top: 8),
itemBuilder: (cxt, index) => Theme(
data: Theme.of(context).copyWith(
radioTheme: RadioThemeData(
fillColor: MaterialStateColor.resolveWith((states) {
if (states.contains(MaterialState.selected)) {
return AppColor.textColor(context); // Active color
}
return Colors.grey; // Inactive color
}),
),
).paddingOnly(top: 16, start: 16, end: 16, bottom: 16),
Expanded(
// Wrap ListView with Expanded
child: ListView.builder(
itemCount: filteredList?.length,
padding: EdgeInsets.zero,
itemBuilder: (cxt, index) => Theme(
data: Theme.of(context).copyWith(
radioTheme: RadioThemeData(
fillColor: MaterialStateColor.resolveWith((states) {
if (states.contains(MaterialState.selected)) {
return AppColor.textColor(context); // Active color
}
return Colors.grey; // Inactive color
}),
),
child: RadioListTile<T>(
// Specify type for RadioListTile
value: filteredList![index],
dense: true,
contentPadding: EdgeInsets.zero,
groupValue: _selectedValue,
activeColor: AppColor.textColor(context),
onChanged: (value) {
_selectedValue = value;
searchFocusNode.unfocus();
setState(() {});
},
title: Text(
widget.builderString(filteredList![index]).cleanupWhitespace.capitalizeFirstOfEach ?? "",
style: Theme.of(context).textTheme.bodyLarge,
),
),
child: RadioListTile<T>(
// Specify type for RadioListTile
value: filteredList![index],
dense: true,
groupValue: _selectedValue,
activeColor: AppColor.textColor(context),
contentPadding: const EdgeInsets.only(left: 16, right: 16),
onChanged: (value) {
_selectedValue = value;
searchFocusNode.unfocus();
setState(() {});
},
title: Text(
widget.builderString(filteredList![index]).cleanupWhitespace.capitalizeFirstOfEach ?? "",
style: Theme.of(context).textTheme.bodyLarge,
),
),
),
),
8.height,
if (_selectedValue != null)
AppFilledButton(
label: context.translation.select,
maxWidth: true,
onPressed: () {
Navigator.pop(context);
widget.onSelect(_selectedValue);
},
),
],
),
),
8.height,
if (_selectedValue != null)
FooterActionButton.footerContainer(
context: context,
child: AppFilledButton(
label: context.translation.select,
maxWidth: true,
onPressed: () {
Navigator.pop(context);
widget.onSelect(_selectedValue);
},
)),
],
),
);
}

@ -124,7 +124,8 @@ class _SingleAssistantEmployeeMenuState extends State<AssistantEmployeeMenu> {
value: value,
child: Text(
value.user?.name ?? "NULL", // Use null-aware operator for user.name
style: AppTextStyles.bodyText.copyWith(color: AppColor.black20),
// style: AppTextStyles.bodyText.copyWith(color: AppColor.black20),
style: Theme.of(context).textTheme.bodyMedium?.copyWith(fontWeight: FontWeight.w500, color: context.isDark ? AppColor.white10 : AppColor.black10),
),
);
},

Loading…
Cancel
Save