| OLD | NEW |
| (Empty) |
| 1 part of widgets; | |
| 2 | |
| 3 class Checkbox extends ButtonBase { | |
| 4 | |
| 5 bool checked; | |
| 6 ValueChanged onChanged; | |
| 7 | |
| 8 static Style _style = new Style(''' | |
| 9 transform: translateX(0); | |
| 10 display: flex; | |
| 11 justify-content: center; | |
| 12 align-items: center; | |
| 13 -webkit-user-select: none; | |
| 14 cursor: pointer; | |
| 15 width: 30px; | |
| 16 height: 30px;''' | |
| 17 ); | |
| 18 | |
| 19 static Style _containerStyle = new Style(''' | |
| 20 border: solid 2px; | |
| 21 border-color: rgba(90, 90, 90, 0.25); | |
| 22 width: 10px; | |
| 23 height: 10px;''' | |
| 24 ); | |
| 25 | |
| 26 static Style _containerHighlightStyle = new Style(''' | |
| 27 border: solid 2px; | |
| 28 border-color: rgba(90, 90, 90, 0.25); | |
| 29 width: 10px; | |
| 30 height: 10px; | |
| 31 border-radius: 10px; | |
| 32 background-color: orange; | |
| 33 border-color: orange;''' | |
| 34 ); | |
| 35 | |
| 36 static Style _uncheckedStyle = new Style(''' | |
| 37 top: 0px; | |
| 38 left: 0px;''' | |
| 39 ); | |
| 40 | |
| 41 static Style _checkedStyle = new Style(''' | |
| 42 top: 0px; | |
| 43 left: 0px; | |
| 44 transform: translate(2px, -15px) rotate(45deg); | |
| 45 width: 10px; | |
| 46 height: 20px; | |
| 47 border-style: solid; | |
| 48 border-top: none; | |
| 49 border-left: none; | |
| 50 border-right-width: 2px; | |
| 51 border-bottom-width: 2px; | |
| 52 border-color: #0f9d58;''' | |
| 53 ); | |
| 54 | |
| 55 Checkbox({ Object key, this.onChanged, this.checked }) : super(key: key); | |
| 56 | |
| 57 Node build() { | |
| 58 return new Container( | |
| 59 style: _style, | |
| 60 children: [ | |
| 61 super.build(), | |
| 62 new Container( | |
| 63 style: _highlight ? _containerHighlightStyle : _containerStyle, | |
| 64 children: [ | |
| 65 new Container( | |
| 66 style: checked ? _checkedStyle : _uncheckedStyle | |
| 67 ) | |
| 68 ] | |
| 69 ) | |
| 70 ] | |
| 71 )..events.listen('click', _handleClick); | |
| 72 } | |
| 73 | |
| 74 void _handleClick(sky.Event e) { | |
| 75 onChanged(!checked); | |
| 76 } | |
| 77 } | |
| OLD | NEW |