mirror of
https://github.com/flutter/flutter.git
synced 2026-02-20 02:29:02 +08:00
e8318f65a7
This patch removes the mutable API to event handling (Nodes no longer have a events object with which to add listeners). Instead, a new (non-Render) Node is introduced: EventTarget. This node represents a location in the Effen tree which can handle events as they bubble. Note that this also changes the implementation to use event delegation (one set of listeners at the sky.document level) rather than direct listeners on leaf nodes. R=abarth@chromium.org Review URL: https://codereview.chromium.org/1019633004
86 lines
1.9 KiB
Dart
86 lines
1.9 KiB
Dart
// Copyright 2015 The Chromium Authors. All rights reserved.
|
|
// Use of this source code is governed by a BSD-style license that can be
|
|
// found in the LICENSE file.
|
|
|
|
import '../fn.dart';
|
|
import 'button_base.dart';
|
|
|
|
typedef void ValueChanged(value);
|
|
|
|
class Checkbox extends ButtonBase {
|
|
static final Style _style = new Style('''
|
|
transform: translateX(0);
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
-webkit-user-select: none;
|
|
cursor: pointer;
|
|
width: 30px;
|
|
height: 30px;'''
|
|
);
|
|
|
|
static final Style _containerStyle = new Style('''
|
|
border: solid 2px;
|
|
border-color: rgba(90, 90, 90, 0.25);
|
|
width: 10px;
|
|
height: 10px;'''
|
|
);
|
|
|
|
static final Style _containerHighlightStyle = new Style('''
|
|
border: solid 2px;
|
|
border-color: rgba(90, 90, 90, 0.25);
|
|
width: 10px;
|
|
height: 10px;
|
|
border-radius: 10px;
|
|
background-color: orange;
|
|
border-color: orange;'''
|
|
);
|
|
|
|
static final Style _uncheckedStyle = new Style('''
|
|
top: 0px;
|
|
left: 0px;'''
|
|
);
|
|
|
|
static final Style _checkedStyle = new Style('''
|
|
top: 0px;
|
|
left: 0px;
|
|
transform: translate(2px, -15px) rotate(45deg);
|
|
width: 10px;
|
|
height: 20px;
|
|
border-style: solid;
|
|
border-top: none;
|
|
border-left: none;
|
|
border-right-width: 2px;
|
|
border-bottom-width: 2px;
|
|
border-color: #0f9d58;'''
|
|
);
|
|
|
|
bool checked;
|
|
ValueChanged onChanged;
|
|
|
|
Checkbox({ Object key, this.onChanged, this.checked }) : super(key: key);
|
|
|
|
void _handleClick(sky.Event e) {
|
|
onChanged(!checked);
|
|
}
|
|
|
|
Node buildContent() {
|
|
return new EventTarget(
|
|
new Container(
|
|
style: _style,
|
|
children: [
|
|
new Container(
|
|
style: highlight ? _containerHighlightStyle : _containerStyle,
|
|
children: [
|
|
new Container(
|
|
style: checked ? _checkedStyle : _uncheckedStyle
|
|
)
|
|
]
|
|
)
|
|
]
|
|
),
|
|
onGestureTap: _handleClick
|
|
);
|
|
}
|
|
}
|