|
| 1 | +import 'package:flutter/material.dart'; |
| 2 | +import 'package:getflutter/getflutter.dart'; |
| 3 | + |
| 4 | +class GFCheckbox extends StatefulWidget { |
| 5 | + const GFCheckbox({ |
| 6 | + Key key, |
| 7 | + this.size = GFSize.MEDIUM, |
| 8 | + this.type = GFCheckboxType.basic, |
| 9 | + this.checkColor = GFColors.WHITE, |
| 10 | + this.activebgColor = GFColors.PRIMARY, |
| 11 | + this.inactivebgColor = GFColors.WHITE, |
| 12 | + this.activeBorderColor = GFColors.WHITE, |
| 13 | + this.inactiveBorderColor = GFColors.DARK, |
| 14 | + this.onChanged, |
| 15 | + this.value, |
| 16 | + this.activeIcon = const Icon( |
| 17 | + Icons.check, |
| 18 | + size: 20, |
| 19 | + color: GFColors.WHITE, |
| 20 | + ), |
| 21 | + this.inactiveIcon = const Icon(Icons.close), |
| 22 | + this.custombgColor = GFColors.SUCCESS, |
| 23 | + }) : super(key: key); |
| 24 | + |
| 25 | + /// type of [GFCheckboxType] which is of four type is basic, sqaure, circular and custom |
| 26 | + final GFCheckboxType type; |
| 27 | + |
| 28 | + /// type of [double] which is GFSize ie, small, medium and large and can use any double value |
| 29 | + final double size; |
| 30 | + |
| 31 | + // type pf [Color] used to change the checkcolor when the checkbox is active |
| 32 | + final Color checkColor; |
| 33 | + |
| 34 | + /// type of [Color] used to change the backgroundColor of the active checkbox |
| 35 | + final Color activebgColor; |
| 36 | + |
| 37 | + /// type of [Color] used to change the backgroundColor of the inactive checkbox |
| 38 | + final Color inactivebgColor; |
| 39 | + |
| 40 | + /// type of [Color] used to change the border color of the active checkbox |
| 41 | + final Color activeBorderColor; |
| 42 | + |
| 43 | + /// type of [Color] used to change the border color of the inactive checkbox |
| 44 | + final Color inactiveBorderColor; |
| 45 | + |
| 46 | + /// Called when the user checks or unchecks the checkbox. |
| 47 | + final ValueChanged<bool> onChanged; |
| 48 | + |
| 49 | + ///Used to set the current state of the checkbox |
| 50 | + final bool value; |
| 51 | + |
| 52 | + ///type of Widget used to change the checkbox's active icon |
| 53 | + final Widget activeIcon; |
| 54 | + |
| 55 | + ///type of [Widget] used to change the checkbox's inactive icon |
| 56 | + final Widget inactiveIcon; |
| 57 | + |
| 58 | + /// type of [Color] used to change the background color of the custom active checkbox only |
| 59 | + final Color custombgColor; |
| 60 | + |
| 61 | + @override |
| 62 | + _GFCheckboxState createState() => _GFCheckboxState(); |
| 63 | +} |
| 64 | + |
| 65 | +class _GFCheckboxState extends State<GFCheckbox> { |
| 66 | +// |
| 67 | + |
| 68 | + bool isSelected = false; |
| 69 | + |
| 70 | + @override |
| 71 | + void initState(){ |
| 72 | + isSelected = widget.value??false; |
| 73 | + } |
| 74 | + |
| 75 | + void onStatusChange() { |
| 76 | + setState(() { |
| 77 | + isSelected = !isSelected; |
| 78 | + }); |
| 79 | + if (widget.onChanged != null) { |
| 80 | + widget.onChanged(isSelected); |
| 81 | + } |
| 82 | + } |
| 83 | + @override |
| 84 | + Widget build(BuildContext context) => InkWell( |
| 85 | + onTap: onStatusChange, |
| 86 | + child: Container( |
| 87 | + height: widget.size, |
| 88 | + width: widget.size, |
| 89 | + decoration: BoxDecoration( |
| 90 | + color: isSelected |
| 91 | + ? widget.type == GFCheckboxType.custom |
| 92 | + ? Colors.white |
| 93 | + : widget.activebgColor |
| 94 | + : widget.inactivebgColor, |
| 95 | + borderRadius: widget.type == GFCheckboxType.basic |
| 96 | + ? BorderRadius.circular(3) |
| 97 | + : widget.type == GFCheckboxType.circle |
| 98 | + ? BorderRadius.circular(50) |
| 99 | + : BorderRadius.zero, |
| 100 | + border: Border.all( |
| 101 | + color: isSelected |
| 102 | + ? widget.type == GFCheckboxType.custom |
| 103 | + ? Colors.black87 |
| 104 | + : widget.activeBorderColor |
| 105 | + : widget.inactiveBorderColor)), |
| 106 | + child: isSelected |
| 107 | + ? widget.type == GFCheckboxType.custom |
| 108 | + ? Stack( |
| 109 | + children: <Widget>[ |
| 110 | + Container( |
| 111 | + alignment: Alignment.center, |
| 112 | + ), |
| 113 | + Container( |
| 114 | + margin: const EdgeInsets.all(5), |
| 115 | + alignment: Alignment.center, |
| 116 | + width: widget.size * 0.8, |
| 117 | + height: widget.size * 0.8, |
| 118 | + decoration: BoxDecoration( |
| 119 | + shape: BoxShape.rectangle, |
| 120 | + color: widget.custombgColor), |
| 121 | + ) |
| 122 | + ], |
| 123 | + ) |
| 124 | + : widget.activeIcon |
| 125 | + : widget.inactiveIcon, |
| 126 | + ), |
| 127 | + ); |
| 128 | +} |
0 commit comments