date picker and time picker color scheme changes

main_production_RSG
Sikander Saleem 2 months ago
parent e09ba251ca
commit 19b6de7ef8

@ -144,6 +144,69 @@ class _VerifyAssetDetailsState extends State<VerifyAssetDetails> with TickerProv
showTimePicker(
context: context,
initialTime: TimeOfDay.now(),
builder: (BuildContext context, Widget? child) {
return Theme(
data: Theme.of(context).copyWith(
timePickerTheme: TimePickerThemeData(
backgroundColor: AppColor.bottomSheetColor(context),
hourMinuteShape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
side: BorderSide(color: AppColor.borderColor(context)),
),
dayPeriodBorderSide: BorderSide(color: AppColor.borderColor(context)),
dayPeriodColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return AppColor.primary10;
}
return Colors.transparent;
}),
dayPeriodTextColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return Colors.white;
}
return AppColor.textStyleColor(context);
}),
dialHandColor: AppColor.primary10,
dialBackgroundColor: AppColor.scaffoldBackground(context),
hourMinuteColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return AppColor.primary10;
}
return AppColor.scaffoldBackground(context);
}),
hourMinuteTextColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return Colors.white;
}
return AppColor.textStyleColor(context);
}),
dialTextColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return Colors.white;
}
return AppColor.textStyleColor(context);
}),
entryModeIconColor: AppColor.primary10,
helpTextStyle: TextStyle(
color: AppColor.textStyleColor(context),
),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
),
),
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
foregroundColor: AppColor.primary10,
textStyle: const TextStyle(
fontWeight: FontWeight.w600,
fontSize: 14,
),
),
),
),
child: child!,
);
},
).then((selectedTime) {
// Handle the selected date and time here.
if (selectedTime != null) {
@ -261,6 +324,69 @@ class _VerifyAssetDetailsState extends State<VerifyAssetDetails> with TickerProv
showTimePicker(
context: context,
initialTime: TimeOfDay.now(),
builder: (BuildContext context, Widget? child) {
return Theme(
data: Theme.of(context).copyWith(
timePickerTheme: TimePickerThemeData(
backgroundColor: AppColor.bottomSheetColor(context),
hourMinuteShape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
side: BorderSide(color: AppColor.borderColor(context)),
),
dayPeriodBorderSide: BorderSide(color: AppColor.borderColor(context)),
dayPeriodColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return AppColor.primary10;
}
return Colors.transparent;
}),
dayPeriodTextColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return Colors.white;
}
return AppColor.textStyleColor(context);
}),
dialHandColor: AppColor.primary10,
dialBackgroundColor: AppColor.scaffoldBackground(context),
hourMinuteColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return AppColor.primary10;
}
return AppColor.scaffoldBackground(context);
}),
hourMinuteTextColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return Colors.white;
}
return AppColor.textStyleColor(context);
}),
dialTextColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return Colors.white;
}
return AppColor.textStyleColor(context);
}),
entryModeIconColor: AppColor.primary10,
helpTextStyle: TextStyle(
color: AppColor.textStyleColor(context),
),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
),
),
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
foregroundColor: AppColor.primary10,
textStyle: const TextStyle(
fontWeight: FontWeight.w600,
fontSize: 14,
),
),
),
),
child: child!,
);
},
).then((selectedTime) {
// Handle the selected date and time here.
if (selectedTime != null) {
@ -405,7 +531,7 @@ class _VerifyAssetDetailsState extends State<VerifyAssetDetails> with TickerProv
}),
),
8.width,
Text(element.name ?? '', style: AppTextStyles.tinyFont.copyWith(color: AppColor.neutral120)),
Text(element.name ?? '', style: AppTextStyles.tinyFont.copyWith(color: AppColor.textColor(context))),
],
)
],

@ -87,36 +87,124 @@ class ADatePicker extends StatelessWidget {
lastDate: to ?? DateTime.now(),
builder: (BuildContext context, Widget? child) {
final ThemeData currentTheme = Theme.of(context);
final bool isDark = context.isDark;
return Theme(
data: currentTheme.copyWith(
datePickerTheme: DatePickerThemeData(
headerBackgroundColor: AppColor.scaffoldBackground(context),
// Header styling
headerBackgroundColor: AppColor.primary10,
headerForegroundColor: Colors.white,
// Background
backgroundColor: AppColor.bottomSheetColor(context),
dayForegroundColor: MaterialStateColor.resolveWith((states) {
if (states.contains(MaterialState.selected)) return Colors.white;
if (states.contains(MaterialState.disabled)) return Colors.grey.withOpacity(0.6);
return currentTheme.colorScheme.onSurface;
// Surface tint removal for clean look
surfaceTintColor: Colors.transparent,
// Day cell styling
dayForegroundColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return Colors.white;
}
if (states.contains(WidgetState.disabled)) {
return isDark ? AppColor.neutral10.withOpacity(0.3) : AppColor.neutral20.withOpacity(0.4);
}
return AppColor.textStyleColor(context);
}),
dayBackgroundColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return AppColor.primary10;
}
return Colors.transparent;
}),
// Today's date styling
todayForegroundColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return Colors.white;
}
return AppColor.primary10;
}),
todayBackgroundColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return AppColor.primary10;
}
return Colors.transparent;
}),
dayBackgroundColor: MaterialStateColor.resolveWith((states) => states.contains(MaterialState.selected) ? AppColor.primary10 : Colors.transparent),
yearForegroundColor: MaterialStateColor.resolveWith((states) {
if (states.contains(MaterialState.selected)) return Colors.white;
if (states.contains(MaterialState.disabled)) return Colors.grey.withOpacity(0.6);
return currentTheme.colorScheme.onSurface;
todayBorder: BorderSide(color: AppColor.primary10, width: 1),
// Year selector styling
yearForegroundColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return Colors.white;
}
if (states.contains(WidgetState.disabled)) {
return isDark ? AppColor.neutral10.withOpacity(0.3) : AppColor.neutral20.withOpacity(0.4);
}
return AppColor.textStyleColor(context);
}),
yearBackgroundColor: WidgetStateColor.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return AppColor.primary10;
}
return Colors.transparent;
}),
yearBackgroundColor: MaterialStateColor.resolveWith((states) => states.contains(MaterialState.selected) ? AppColor.primary10 : Colors.transparent),
// todayForegroundColor: MaterialStateColor.resolveWith((states) => AppColor.primary10),
// todayBorder: BorderSide(color: AppColor.primary10.withOpacity(0.7)),
dividerColor: Colors.grey.withOpacity(0.2),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
inputDecorationTheme: const InputDecorationTheme(
focusedBorder: UnderlineInputBorder(borderSide: BorderSide(color: AppColor.primary10, width: 2)),
// Weekday labels
weekdayStyle: TextStyle(
color: AppColor.labelTextStyleColor(context),
fontWeight: FontWeight.w600,
),
// Day style
dayStyle: TextStyle(
color: AppColor.textStyleColor(context),
),
// Year style
yearStyle: TextStyle(
color: AppColor.textStyleColor(context),
),
// Divider
dividerColor: AppColor.borderColor(context),
// Shape
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
),
// Input decoration for text field mode
inputDecorationTheme: InputDecorationTheme(
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: AppColor.primary10, width: 2),
),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: AppColor.borderColor(context)),
),
),
),
// Button styling (Cancel/OK buttons)
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(foregroundColor: AppColor.loadingColor(context)),
style: TextButton.styleFrom(
foregroundColor: AppColor.primary10,
textStyle: const TextStyle(
fontWeight: FontWeight.w600,
fontSize: 14,
),
),
),
// Icon theme for navigation arrows
iconTheme: IconThemeData(
color: Colors.white,
),
iconTheme: IconThemeData(color: AppColor.primary10.withOpacity(0.7)),
),
child: child!,
);

Loading…
Cancel
Save