Commit 1674ecb6 authored by Adam Barth's avatar Adam Barth

Merge pull request #921 from abarth/use_tap

Use GestureDetector in the framework and examples
parents 4f1b4e3e dc84e882
......@@ -162,9 +162,9 @@ class DemoList extends Component {
}
Widget buildDemo(SkyDemo demo) {
return new Listener(
return new GestureDetector(
key: demo.key,
onGestureTap: (_) => launch(demo.href, demo.bundle),
onTap: () => launch(demo.href, demo.bundle),
child: new Container(
height: kCardHeight,
child: new Card(
......
......@@ -39,11 +39,8 @@ class DialogMenuItem extends ButtonBase {
}
Widget buildContent() {
return new Listener(
onGestureTap: (_) {
if (onPressed != null)
onPressed();
},
return new GestureDetector(
onTap: onPressed,
child: new Container(
height: 48.0,
child: new InkWell(
......
......@@ -56,10 +56,9 @@ class MealFragment extends StatefulComponent {
String _description = "";
EventDisposition _handleSave() {
void _handleSave() {
onCreated(new Meal(when: new DateTime.now(), description: _description));
navigator.pop();
return EventDisposition.processed;
}
Widget buildToolBar() {
......@@ -69,8 +68,8 @@ class MealFragment extends StatefulComponent {
onPressed: navigator.pop),
center: new Text('New Meal'),
right: [new InkWell(
child: new Listener(
onGestureTap: (_) => _handleSave(),
child: new GestureDetector(
onTap: _handleSave,
child: new Text('SAVE')
)
)]
......
......@@ -119,7 +119,7 @@ class MeasurementFragment extends StatefulComponent {
DateTime _when = new DateTime.now();
String _errorMessage = null;
EventDisposition _handleSave() {
void _handleSave() {
double parsedWeight;
try {
parsedWeight = double.parse(_weight);
......@@ -128,11 +128,9 @@ class MeasurementFragment extends StatefulComponent {
setState(() {
_errorMessage = "Save failed";
});
return EventDisposition.processed;
}
onCreated(new Measurement(when: _when, weight: parsedWeight));
navigator.pop();
return EventDisposition.processed;
}
Widget buildToolBar() {
......@@ -142,8 +140,8 @@ class MeasurementFragment extends StatefulComponent {
onPressed: navigator.pop),
center: new Text('New Measurement'),
right: [new InkWell(
child: new Listener(
onGestureTap: (_) => _handleSave(),
child: new GestureDetector(
onTap: _handleSave,
child: new Text('SAVE')
)
)]
......@@ -158,7 +156,7 @@ class MeasurementFragment extends StatefulComponent {
static final GlobalKey weightKey = new GlobalKey();
EventDisposition _handleDatePressed(_) {
void _handleDatePressed() {
showDialog(navigator, (navigator) {
return new MeasurementDateDialog(navigator: navigator, previousDate: _when);
}).then((DateTime value) {
......@@ -168,7 +166,6 @@ class MeasurementFragment extends StatefulComponent {
_when = value;
});
});
return EventDisposition.processed;
}
Widget buildBody() {
......@@ -179,8 +176,8 @@ class MeasurementFragment extends StatefulComponent {
child: new Container(
padding: const EdgeDims.all(20.0),
child: new Column([
new Listener(
onGestureTap: _handleDatePressed,
new GestureDetector(
onTap: _handleDatePressed,
child: new Container(
height: 50.0,
child: new Column([
......
......@@ -107,19 +107,19 @@ class MineDiggerApp extends App {
state = cells[iy][ix] ? CellState.shown : state;
}
if (state == CellState.covered) {
row.add(new Listener(
onPointerDown: _pointerDownHandlerFor(ix, iy),
onGestureTap: (_) {
probe(ix, iy);
},
onGestureLongPress: (_) {
row.add(new GestureDetector(
onTap: () => probe(ix, iy),
onLongPress: () {
activity.userFeedback.performHapticFeedback(activity.HapticFeedbackType_LONG_PRESS);
flag(ix, iy);
},
child: new CoveredMineNode(
flagged: false,
posX: ix,
posY: iy
child: new Listener(
onPointerDown: _pointerDownHandlerFor(ix, iy),
child: new CoveredMineNode(
flagged: false,
posX: ix,
posY: iy
)
)
));
// Mutating |hasCoveredCell| here is hacky, but convenient, same
......
......@@ -41,13 +41,11 @@ class EnsureVisibleApp extends App {
super.initState();
}
EventDisposition handleTap(Widget card, CardModel cardModel) {
void handleTap(Widget card, CardModel cardModel) {
ensureWidgetIsVisible(card, duration: const Duration(milliseconds: 200))
.then((_) {
setState(() { selectedCardModel = cardModel; });
});
return EventDisposition.processed;
}
Widget builder(int index) {
......@@ -63,9 +61,9 @@ class EnsureVisibleApp extends App {
child: new Center(child: new Text(cardModel.label, style: style))
)
);
return new Listener(
return new GestureDetector(
key: cardModel.key,
onGestureTap: (_) { return handleTap(card, cardModel); },
onTap: () => handleTap(card, cardModel),
child: card
);
}
......
......@@ -106,17 +106,15 @@ class MixedViewportApp extends App {
Widget builder(int index) {
if (index >= lengths.length)
return null;
return new Listener(
return new GestureDetector(
key: new Key.stringify(lengths[index]),
onTap: () => removeBox(index),
child: new Container(
decoration: new BoxDecoration(
backgroundColor: new Color((0xFF000000 + 0xFFFFFF * lengths[index] / kMaxLength).round())
),
height: lengths[index] + 12.0
),
onGestureTap: (_) {
removeBox(index);
}
)
);
}
......@@ -124,7 +122,4 @@ class MixedViewportApp extends App {
void main() {
runApp(new MixedViewportApp());
// scheduler.addPersistentFrameCallback((_) {
// SkyBinding.instance.debugDumpRenderTree();
// });
}
......@@ -46,8 +46,8 @@ class ExampleApp extends App {
GlobalKey _overlay;
Widget _buildCard(CardData cardData) {
return new Listener(
onGestureTap: (_) {
return new GestureDetector(
onTap: () {
setState(() {
_overlay = cardData.key;
});
......
......@@ -2,8 +2,6 @@
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import 'dart:sky' as sky;
import 'package:sky/animation/animation_performance.dart';
import 'package:sky/animation/animated_value.dart';
import 'package:sky/animation/curves.dart';
......@@ -28,7 +26,7 @@ class ProgressIndicatorApp extends App {
);
}
void handleTap(sky.GestureEvent event) {
void handleTap() {
if (valueAnimation.isAnimating)
valueAnimation.stop();
else
......@@ -73,8 +71,8 @@ class ProgressIndicatorApp extends App {
}
Widget build() {
Widget body = new Listener(
onGestureTap: (e) { handleTap(e); },
Widget body = new GestureDetector(
onTap: handleTap,
child: new Container(
padding: const EdgeDims.symmetric(vertical: 12.0, horizontal: 8.0),
decoration: new BoxDecoration(backgroundColor: Theme.of(this).cardColor),
......
......@@ -23,6 +23,7 @@ export 'widgets/flat_button.dart';
export 'widgets/floating_action_button.dart';
export 'widgets/focus.dart';
export 'widgets/framework.dart';
export 'widgets/gesture_detector.dart';
export 'widgets/icon.dart';
export 'widgets/icon_button.dart';
export 'widgets/ink_well.dart';
......
......@@ -140,21 +140,21 @@ class DatePickerHeader extends Component {
return new Container(
child: new BlockBody([
new Center(
child: new Listener(
child: new GestureDetector(
child: new Text(new DateFormat("MMM").format(selectedDate).toUpperCase(), style: monthStyle),
onGestureTap: (_) => _handleChangeMode(DatePickerMode.day)
onTap: () => _handleChangeMode(DatePickerMode.day)
)
),
new Center(
child: new Listener(
child: new GestureDetector(
child: new Text(new DateFormat("d").format(selectedDate), style: dayStyle),
onGestureTap: (_) => _handleChangeMode(DatePickerMode.day)
onTap: () => _handleChangeMode(DatePickerMode.day)
)
),
new Center(
child: new Listener(
child: new GestureDetector(
child: new Text(new DateFormat("yyyy").format(selectedDate), style: yearStyle),
onGestureTap: (_) => _handleChangeMode(DatePickerMode.year)
onTap: () => _handleChangeMode(DatePickerMode.year)
)
)
]),
......@@ -244,8 +244,8 @@ class DayPicker extends Component {
currentDate.day == day)
itemStyle = itemStyle.copyWith(color: theme.primaryColor);
item = new Listener(
onGestureTap: (_) {
item = new GestureDetector(
onTap: () {
DateTime result = new DateTime(year, month, day);
onChanged(result);
},
......@@ -386,9 +386,9 @@ class YearPicker extends ScrollableWidgetList {
for(int i = start; i < start + count; i++) {
int year = firstDate.year + i;
String label = year.toString();
Widget item = new Listener(
Widget item = new GestureDetector(
key: new Key(label),
onGestureTap: (_) {
onTap: () {
DateTime result = new DateTime(year, selectedDate.month, selectedDate.day);
onChanged(result);
},
......
......@@ -10,6 +10,7 @@ import 'package:sky/theme/colors.dart' as colors;
import 'package:sky/widgets/basic.dart';
import 'package:sky/widgets/default_text_style.dart';
import 'package:sky/widgets/focus.dart';
import 'package:sky/widgets/gesture_detector.dart';
import 'package:sky/widgets/material.dart';
import 'package:sky/widgets/navigator.dart';
import 'package:sky/widgets/scrollable.dart';
......@@ -101,13 +102,13 @@ class Dialog extends Component {
));
return new Stack([
new Listener(
new GestureDetector(
child: new Container(
decoration: const BoxDecoration(
backgroundColor: const Color(0x7F000000)
)
),
onGestureTap: (_) => onDismiss()
onTap: onDismiss
),
new Center(
child: new Container(
......
......@@ -8,10 +8,11 @@ import 'dart:sky' as sky;
import 'package:sky/animation/animated_value.dart';
import 'package:sky/animation/animation_performance.dart';
import 'package:sky/animation/forces.dart';
import 'package:sky/theme/shadows.dart';
import 'package:sky/theme/colors.dart' as colors;
import 'package:sky/theme/shadows.dart';
import 'package:sky/widgets/animated_container.dart';
import 'package:sky/widgets/basic.dart';
import 'package:sky/widgets/gesture_detector.dart';
import 'package:sky/widgets/navigator.dart';
import 'package:sky/widgets/scrollable.dart';
import 'package:sky/widgets/theme.dart';
......@@ -84,14 +85,16 @@ class Drawer extends StatefulComponent {
}
Widget build() {
var mask = new Listener(
var mask = new GestureDetector(
child: new ColorTransition(
performance: _performance,
direction: showing ? Direction.forward : Direction.reverse,
color: new AnimatedColorValue(colors.transparent, end: const Color(0x7F000000)),
child: new Container()
),
onGestureTap: handleMaskTap
onTap: () {
_performance.reverse();
}
);
Widget content = new SlideTransition(
......@@ -132,11 +135,6 @@ class Drawer extends StatefulComponent {
void _settle() { _isMostlyClosed ? _performance.reverse() : _performance.play(); }
EventDisposition handleMaskTap(_) {
_performance.reverse();
return EventDisposition.consumed;
}
// TODO(mpcomplete): Figure out how to generalize these handlers on a
// "PannableThingy" interface.
EventDisposition handlePointerDown(_) {
......
......@@ -9,10 +9,11 @@ import 'package:sky/theme/colors.dart' as colors;
import 'package:sky/widgets/basic.dart';
import 'package:sky/widgets/button_base.dart';
import 'package:sky/widgets/default_text_style.dart';
import 'package:sky/widgets/framework.dart';
import 'package:sky/widgets/gesture_detector.dart';
import 'package:sky/widgets/icon.dart';
import 'package:sky/widgets/ink_well.dart';
import 'package:sky/widgets/theme.dart';
import 'package:sky/widgets/framework.dart';
typedef EventDisposition OnPressedFunction();
......@@ -81,12 +82,8 @@ class DrawerItem extends ButtonBase {
)
);
return new Listener(
onGestureTap: (_) {
if (onPressed != null)
return onPressed();
return EventDisposition.ignored;
},
return new GestureDetector(
onTap: onPressed,
child: new Container(
height: 48.0,
decoration: new BoxDecoration(backgroundColor: _getBackgroundColor(themeData)),
......
......@@ -4,6 +4,7 @@
import 'package:sky/widgets/basic.dart';
import 'package:sky/widgets/button_base.dart';
import 'package:sky/widgets/gesture_detector.dart';
import 'package:sky/widgets/icon.dart';
import 'package:sky/widgets/ink_well.dart';
import 'package:sky/widgets/material.dart';
......@@ -47,11 +48,8 @@ class FloatingActionButton extends ButtonBase {
type: MaterialType.circle,
level: highlight ? 3 : 2,
child: new ClipOval(
child: new Listener(
onGestureTap: (_) {
if (onPressed != null)
onPressed();
},
child: new GestureDetector(
onTap: onPressed,
child: new Container(
width: _kSize,
height: _kSize,
......
......@@ -27,10 +27,7 @@ class IconButton extends Component {
);
}
return new GestureDetector(
onTap: () {
if (onPressed != null)
onPressed();
},
onTap: onPressed,
child: new Padding(
child: child,
padding: const EdgeDims.all(8.0))
......
......@@ -4,6 +4,7 @@
import 'package:sky/widgets/basic.dart';
import 'package:sky/widgets/button_base.dart';
import 'package:sky/widgets/gesture_detector.dart';
import 'package:sky/widgets/ink_well.dart';
import 'package:sky/widgets/material.dart';
......@@ -36,7 +37,8 @@ abstract class MaterialButton extends ButtonBase {
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 Listener(
return new GestureDetector(
onTap: enabled ? onPressed : null,
child: new Container(
height: 36.0,
constraints: new BoxConstraints(minWidth: 88.0),
......@@ -47,8 +49,7 @@ abstract class MaterialButton extends ButtonBase {
level: level,
color: color
)
),
onGestureTap: (_) { if (onPressed != null && enabled) onPressed(); }
)
);
}
......
......@@ -4,6 +4,7 @@
import 'package:sky/widgets/basic.dart';
import 'package:sky/widgets/framework.dart';
import 'package:sky/widgets/gesture_detector.dart';
class ModalOverlay extends Component {
......@@ -13,11 +14,8 @@ class ModalOverlay extends Component {
final Function onDismiss;
Widget build() {
return new Listener(
onGestureTap: (_) {
if (onDismiss != null)
onDismiss();
},
return new GestureDetector(
onTap: onDismiss,
child: new Stack(children)
);
}
......
......@@ -5,6 +5,7 @@
import 'package:sky/painting/text_style.dart';
import 'package:sky/widgets/basic.dart';
import 'package:sky/widgets/default_text_style.dart';
import 'package:sky/widgets/gesture_detector.dart';
import 'package:sky/widgets/ink_well.dart';
import 'package:sky/widgets/theme.dart';
......@@ -24,11 +25,8 @@ class PopupMenuItem extends Component {
TextStyle get textStyle => Theme.of(this).text.subhead;
Widget build() {
return new Listener(
onGestureTap: (_) {
if (onPressed != null)
onPressed();
},
return new GestureDetector(
onTap: onPressed,
child: new InkWell(
child: new Container(
height: kMenuItemHeight,
......
......@@ -7,6 +7,7 @@ import 'dart:sky' as sky;
import 'package:sky/rendering/object.dart';
import 'package:sky/widgets/basic.dart';
import 'package:sky/widgets/button_base.dart';
import 'package:sky/widgets/gesture_detector.dart';
import 'package:sky/widgets/theme.dart';
const sky.Color _kLightOffColor = const sky.Color(0x8A000000);
......@@ -21,7 +22,9 @@ class Radio extends ButtonBase {
this.value,
this.groupValue,
this.onChanged
}) : super(key: key);
}) : super(key: key) {
assert(onChanged != null);
}
Object value;
Object groupValue;
......@@ -45,7 +48,8 @@ class Radio extends ButtonBase {
const double kDiameter = 16.0;
const double kOuterRadius = kDiameter / 2;
const double kInnerRadius = 5.0;
return new Listener(
return new GestureDetector(
onTap: () => onChanged(value),
child: new Container(
margin: const EdgeDims.symmetric(horizontal: 5.0),
width: kDiameter,
......@@ -67,14 +71,8 @@ class Radio extends ButtonBase {
}
}
)
),
onGestureTap: _handleTap
)
);
}
EventDisposition _handleTap(_) {
onChanged(value);
return EventDisposition.consumed;
}
}
......@@ -10,6 +10,7 @@ import 'package:sky/painting/text_style.dart';
import 'package:sky/theme/typography.dart' as typography;
import 'package:sky/widgets/basic.dart';
import 'package:sky/widgets/default_text_style.dart';
import 'package:sky/widgets/gesture_detector.dart';
import 'package:sky/widgets/material.dart';
import 'package:sky/widgets/theme.dart';
import 'package:sky/widgets/transitions.dart';
......@@ -29,8 +30,8 @@ class SnackBarAction extends Component {
final Function onPressed;
Widget build() {
return new Listener(
onGestureTap: (_) => onPressed(),
return new GestureDetector(
onTap: onPressed,
child: new Container(
margin: const EdgeDims.only(left: 24.0),
padding: const EdgeDims.only(top: 14.0, bottom: 14.0),
......@@ -39,6 +40,7 @@ class SnackBarAction extends Component {
);
}
}
class SnackBar extends Component {
SnackBar({
......@@ -58,11 +60,6 @@ class SnackBar extends Component {
bool showing;
SnackBarDismissedCallback onDismissed;
void _onDismissed() {
if (onDismissed != null)
onDismissed();
}
Widget build() {
List<Widget> children = [
new Flexible(
......@@ -84,7 +81,7 @@ class SnackBar extends Component {
position: new AnimatedValue<Point>(Point.origin,
end: const Point(0.0, -52.0),
curve: easeIn, reverseCurve: easeOut),
onDismissed: _onDismissed,
onDismissed: onDismissed,
anchor: anchor,
child: new Material(
level: 2,
......
......@@ -18,12 +18,13 @@ import 'package:sky/theme/colors.dart' as colors;
import 'package:sky/theme/typography.dart' as typography;
import 'package:sky/widgets/basic.dart';
import 'package:sky/widgets/default_text_style.dart';
import 'package:sky/widgets/framework.dart';
import 'package:sky/widgets/gesture_detector.dart';
import 'package:sky/widgets/icon.dart';
import 'package:sky/widgets/ink_well.dart';
import 'package:sky/widgets/scrollable.dart';
import 'package:sky/widgets/theme.dart';
import 'package:sky/widgets/transitions.dart';
import 'package:sky/widgets/framework.dart';
typedef void SelectedIndexChanged(int selectedIndex);
typedef void LayoutChanged(Size size, List<double> widths);
......@@ -478,14 +479,14 @@ class TabBar extends Scrollable {
}
Widget _toTab(TabLabel label, int tabIndex, Color color, Color selectedColor) {
return new Listener(
return new GestureDetector(
onTap: () => _handleTap(tabIndex),
child: new Tab(
label: label,
color: color,
selected: tabIndex == selectedIndex,
selectedColor: selectedColor
),
onGestureTap: (_) => _handleTap(tabIndex)
)
);
}
......
......@@ -84,7 +84,9 @@ class WidgetTester {
}
void tap(Widget widget) {
dispatchEvent(new TestGestureEvent(type: 'gesturetap'), getCenter(widget));
Point location = getCenter(widget);
dispatchEvent(new TestPointerEvent(type: 'pointerdown', x: location.x, y: location.y), location);
dispatchEvent(new TestPointerEvent(type: 'pointerup', x: location.x, y: location.y), location);
}
void scroll(Widget widget, Offset offset) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment