flutter_flutter/framework/sky-checkbox.sky
Adam Barth 26460f8130 Update Sky widgets to have more material design
This CL updates the Sky widgets to be closer to the material design spec.
There's still a long way to go, but this CL is a start.

R=eseidel@chromium.org

Review URL: https://codereview.chromium.org/951823002
2015-02-23 23:59:57 -08:00

52 lines
1.1 KiB
Plaintext

<!--
// 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 src="sky-element.sky" />
<import src="sky-icon.sky" />
<sky-element attributes="checked:boolean">
<template>
<style>
:host {
display: inline-block;
-webkit-user-select: none;
margin: 8px 16px;
}
</style>
<sky-icon size="18" />
</template>
<script>
import "dart:sky";
const String _kOnIcon = 'toggle/check_box_black';
const String _kOffIcon = 'toggle/check_box_outline_blank_black';
@Tagname('sky-checkbox')
class SkyCheckbox extends SkyElement {
SkyIcon _icon;
SkyCheckbox() {
addEventListener('click', _handleClick);
}
void shadowRootReady() {
_icon = shadowRoot.querySelector('sky-icon');
_icon.type = checked ? _kOnIcon : _kOffIcon;
}
void checkedChanged(bool oldValue, bool newValue) {
if (_icon != null)
_icon.type = newValue ? _kOnIcon : _kOffIcon;
}
void _handleClick(_) {
checked = !checked;
}
}
_init(script) => register(script, SkyCheckbox);
</script>
</sky-element>