| OLD | NEW |
|---|
| (Empty) |
| 1 // Copyright 2015 The Chromium Authors. All rights reserved. | |
| 2 // Use of this source code is governed by a BSD-style license that can be | |
| 3 // found in the LICENSE file. | |
| 4 | |
| 5 import '../fn.dart'; | |
| 6 import '../layout.dart'; | |
| 7 import 'button_base.dart'; | |
| 8 import 'dart:sky' as sky; | |
| 9 | |
| 10 typedef void ValueChanged(value); | |
| 11 | |
| 12 class Checkbox extends ButtonBase { | |
| 13 static final Style _style = new Style(''' | |
| 14 transform: translateX(0); | |
| 15 justify-content: center; | |
| 16 align-items: center; | |
| 17 -webkit-user-select: none; | |
| 18 cursor: pointer; | |
| 19 width: 30px; | |
| 20 height: 30px;''' | |
| 21 ); | |
| 22 | |
| 23 static final Style _containerStyle = new Style(''' | |
| 24 border: solid 2px; | |
| 25 border-color: rgba(90, 90, 90, 0.25); | |
| 26 width: 10px; | |
| 27 height: 10px;''' | |
| 28 ); | |
| 29 | |
| 30 static final Style _containerHighlightStyle = new Style(''' | |
| 31 border: solid 2px; | |
| 32 border-color: rgba(90, 90, 90, 0.25); | |
| 33 width: 10px; | |
| 34 height: 10px; | |
| 35 border-radius: 10px; | |
| 36 background-color: orange; | |
| 37 border-color: orange;''' | |
| 38 ); | |
| 39 | |
| 40 static final Style _uncheckedStyle = new Style(''' | |
| 41 top: 0px; | |
| 42 left: 0px;''' | |
| 43 ); | |
| 44 | |
| 45 static final Style _checkedStyle = new Style(''' | |
| 46 top: 0px; | |
| 47 left: 0px; | |
| 48 transform: translate(2px, -15px) rotate(45deg); | |
| 49 width: 10px; | |
| 50 height: 20px; | |
| 51 border-style: solid; | |
| 52 border-top: none; | |
| 53 border-left: none; | |
| 54 border-right-width: 2px; | |
| 55 border-bottom-width: 2px; | |
| 56 border-color: #0f9d58;''' | |
| 57 ); | |
| 58 | |
| 59 bool checked; | |
| 60 ValueChanged onChanged; | |
| 61 | |
| 62 Checkbox({ Object key, this.onChanged, this.checked }) : super(key: key); | |
| 63 | |
| 64 void _handleClick(sky.Event e) { | |
| 65 onChanged(!checked); | |
| 66 } | |
| 67 | |
| 68 UINode buildContent() { | |
| 69 return new EventListenerNode( | |
| 70 new FlexContainer( | |
| 71 style: _style, | |
| 72 direction: FlexDirection.Row, | |
| 73 children: [ | |
| 74 new Container( | |
| 75 style: highlight ? _containerHighlightStyle : _containerStyle, | |
| 76 children: [ | |
| 77 new Container( | |
| 78 style: checked ? _checkedStyle : _uncheckedStyle | |
| 79 ) | |
| 80 ] | |
| 81 ) | |
| 82 ] | |
| 83 ), | |
| 84 onGestureTap: _handleClick | |
| 85 ); | |
| 86 } | |
| 87 } | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1132063007:
Rationalize Dart mojo and sky package structure (Closed)
Base URL: https://github.com/domokit/mojo.git@master