134 lines
4.3 KiB
Dart
134 lines
4.3 KiB
Dart
import 'package:cims_apps/application/theme/color_palette.dart';
|
|
import 'package:cims_apps/core/utils/size_config.dart';
|
|
import 'package:flutter/material.dart';
|
|
|
|
class NumericPad extends StatelessWidget {
|
|
final Function(String) onNumberSelected;
|
|
final bool isPin;
|
|
const NumericPad({super.key, required this.onNumberSelected, this.isPin = false});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Column(
|
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
|
children: [
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
numberWidget('1'),
|
|
dividerGradient(false, Alignment.bottomCenter, Alignment.topCenter),
|
|
numberWidget('2'),
|
|
dividerGradient(false, Alignment.bottomCenter, Alignment.topCenter),
|
|
numberWidget('3')
|
|
],
|
|
),
|
|
dividerGradient(true, Alignment.centerLeft, Alignment.centerRight),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
numberWidget('4'),
|
|
dividerGradient(false, Alignment.center, Alignment.center, fullColor: true),
|
|
numberWidget('5'),
|
|
dividerGradient(false, Alignment.center, Alignment.center, fullColor: true),
|
|
numberWidget('6')
|
|
],
|
|
),
|
|
dividerGradient(true, Alignment.centerLeft, Alignment.centerRight),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
numberWidget('7'),
|
|
dividerGradient(false, Alignment.center, Alignment.center, fullColor: true),
|
|
numberWidget('8'),
|
|
dividerGradient(false, Alignment.center, Alignment.center, fullColor: true),
|
|
numberWidget('9')
|
|
],
|
|
),
|
|
dividerGradient(true, Alignment.centerLeft, Alignment.centerRight),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
isPin ? spaceWidget() : numberWidget('0'),
|
|
dividerGradient(false, Alignment.topCenter, Alignment.bottomCenter),
|
|
numberWidget(isPin ? '0' : '000'),
|
|
dividerGradient(false, Alignment.topCenter, Alignment.bottomCenter),
|
|
removeWidget()
|
|
],
|
|
),
|
|
],
|
|
);
|
|
}
|
|
|
|
Widget dividerGradient(bool isHorizontal, AlignmentGeometry gradientFrom, AlignmentGeometry gradientTo, {bool fullColor = false}) {
|
|
return Container(
|
|
width: isHorizontal ? SizeConfig.width : 1,
|
|
height: isHorizontal ? 1 : SizeConfig.height * 0.097,
|
|
decoration: BoxDecoration(
|
|
gradient: LinearGradient(
|
|
colors: [
|
|
if(isHorizontal) ...[
|
|
ColorPalette.slate200.withOpacity(0)
|
|
],
|
|
ColorPalette.slate200,
|
|
fullColor ? ColorPalette.slate200 : ColorPalette.slate200.withOpacity(0)
|
|
],
|
|
begin: gradientFrom,
|
|
end: gradientTo
|
|
)
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget spaceWidget() {
|
|
return const Expanded(
|
|
child: SizedBox()
|
|
);
|
|
}
|
|
|
|
Widget numberWidget(String number) {
|
|
return Expanded(
|
|
child: GestureDetector(
|
|
onTap: () {
|
|
onNumberSelected(number);
|
|
},
|
|
child: Container(
|
|
color: Colors.transparent,
|
|
padding: EdgeInsets.symmetric(vertical: SizeConfig.height * .028),
|
|
child: Text(
|
|
number,
|
|
textAlign: TextAlign.center,
|
|
style: const TextStyle(
|
|
fontSize: 28,
|
|
fontWeight: FontWeight.bold,
|
|
color: ColorPalette.slate800
|
|
),
|
|
),
|
|
),
|
|
)
|
|
);
|
|
}
|
|
|
|
Widget removeWidget() {
|
|
return Expanded(
|
|
child: GestureDetector(
|
|
onTap: () {
|
|
onNumberSelected('');
|
|
},
|
|
child: Container(
|
|
color: Colors.transparent,
|
|
padding: EdgeInsets.symmetric(vertical: SizeConfig.height * .028),
|
|
child: const Icon(
|
|
Icons.backspace_outlined,
|
|
size: 28,
|
|
color: ColorPalette.slate800,
|
|
),
|
|
),
|
|
)
|
|
);
|
|
}
|
|
}
|