DEV/flutter_flutter
1
0
Fork 0
mirror of https://github.com/flutter/flutter.git synced 2026-02-20 02:29:02 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add FlatButton

Browse Source 
I've factored the common code for FlatButton and RaisedButton into
MaterialButton. Also, tweak some of the constants in MaterialButton to better
match the spec.

R=ianh@google.com

Review URL: https://codereview.chromium.org/1187773008.
This commit is contained in:
Adam Barth 2015-06-16 12:19:33 -07:00
parent b5d44546c9
commit 5faecb46fe
4 changed files with 118 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
sdk/BUILD.gn
View File

@ -106,11 +106,13 @@ dart_pkg("sdk") {
"lib/widgets/drawer.dart",
"lib/widgets/drawer_header.dart",
"lib/widgets/fixed_height_scrollable.dart",
"lib/widgets/flat_button.dart",
"lib/widgets/floating_action_button.dart",
"lib/widgets/icon.dart",
"lib/widgets/icon_button.dart",
"lib/widgets/ink_well.dart",
"lib/widgets/material.dart",
"lib/widgets/material_button.dart",
"lib/widgets/menu_divider.dart",
"lib/widgets/menu_item.dart",
"lib/widgets/modal_overlay.dart",

36
sdk/lib/widgets/flat_button.dart Normal file
View File

@ -0,0 +1,36 @@
// 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 '../theme2/colors.dart';
import 'basic.dart';
import 'material_button.dart';
export 'material_button.dart' show MaterialButtonTheme;
class FlatButton extends MaterialButton {
FlatButton({
String key,
Widget child,
bool enabled: true,
Function onPressed,
MaterialButtonTheme theme: MaterialButtonTheme.light
}) : super(key: key,
child: child,
enabled: enabled,
onPressed: onPressed,
theme: theme);
Color get color {
if (!enabled || !highlight)
return null;
switch (theme) {
case MaterialButtonTheme.light:
return Grey[400];
case MaterialButtonTheme.dark:
return Grey[200];
}
}
int get level => null;
}

59
sdk/lib/widgets/material_button.dart Normal file
View File

@ -0,0 +1,59 @@
// 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 'basic.dart';
import 'button_base.dart';
import 'ink_well.dart';
import 'material.dart';
enum MaterialButtonTheme { light, dark }
// Rather than using this class directly, please use FlatButton or RaisedButton.
abstract class MaterialButton extends ButtonBase {
MaterialButton({
String key,
this.child,
this.enabled: true,
this.onPressed,
this.theme: MaterialButtonTheme.light
}) : super(key: key);
Widget child;
bool enabled;
Function onPressed;
MaterialButtonTheme theme;
void syncFields(MaterialButton source) {
child = source.child;
enabled = source.enabled;
onPressed = source.onPressed;
theme = source.theme;
super.syncFields(source);
}
Color get color;
int get level;
Widget buildContent() {
Widget contents = new Container(
padding: new EdgeDims.symmetric(horizontal: 8.0),
child: new Center(child: child) // TODO(ianh): figure out a way to compell the child to have gray text when disabled...
);
return new EventListenerNode(
new Container(
height: 36.0,
constraints: new BoxConstraints(minWidth: 88.0),
margin: new EdgeDims.all(8.0),
child: new Material(
child: enabled ? new InkWell(child: contents) : contents,
level: level,
color: color
)
),
onGestureTap: (_) { if (onPressed != null && enabled) onPressed(); }
);
}
}

72
sdk/lib/widgets/raised_button.dart
View File

@ -3,75 +3,45 @@
// found in the LICENSE file.
import '../theme2/colors.dart';
import '../theme2/edges.dart';
import 'basic.dart';
import 'button_base.dart';
import 'ink_well.dart';
import 'material.dart';
import 'material_button.dart';
enum RaisedButtonTheme { light, dark }
export 'material_button.dart' show MaterialButtonTheme;
class RaisedButton extends ButtonBase {
class RaisedButton extends MaterialButton {
RaisedButton({
String key,
this.child,
this.enabled: true,
this.onPressed,
this.theme: RaisedButtonTheme.light
}) : super(key: key);
Widget child,
bool enabled: true,
Function onPressed,
MaterialButtonTheme theme: MaterialButtonTheme.light
}) : super(key: key,
child: child,
enabled: enabled,
onPressed: onPressed,
theme: theme);
Widget child;
bool enabled;
Function onPressed;
RaisedButtonTheme theme;
void syncFields(RaisedButton source) {
child = source.child;
enabled = source.enabled;
onPressed = source.onPressed;
theme = source.theme;
super.syncFields(source);
}
Widget buildContent() {
Widget contents = new Container(
padding: new EdgeDims.symmetric(horizontal: 8.0),
child: new Center(child: child) // TODO(ianh): figure out a way to compell the child to have gray text when disabled...
);
Color color;
Color get color {
if (enabled) {
switch (theme) {
case RaisedButtonTheme.light:
case MaterialButtonTheme.light:
if (highlight)
color = Grey[350];
return Grey[350];
else
color = Grey[300];
return Grey[300];
break;
case RaisedButtonTheme.dark:
case MaterialButtonTheme.dark:
if (highlight)
color = Blue[700];
return Blue[700];
else
color = Blue[600];
return Blue[600];
break;
}
} else {
color = Grey[350];
return Grey[350];
}
return new EventListenerNode(
new Container(
height: 36.0,
constraints: new BoxConstraints(minWidth: 88.0),
margin: new EdgeDims.all(4.0),
child: new Material(
edge: MaterialEdge.card,
child: enabled ? new InkWell(child: contents) : contents,
level: enabled ? (highlight ? 2 : 1) : 0,
color: color
)
),
onGestureTap: (_) { if (onPressed != null && enabled) onPressed(); }
);
}
int get level => enabled ? (highlight ? 2 : 1) : 0;
}