mirror of
https://github.com/flutter/flutter
synced 2024-10-13 19:52:53 +00:00
233 lines
6.5 KiB
Dart
233 lines
6.5 KiB
Dart
// Copyright 2014 The Flutter 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 'package:flutter/material.dart';
|
|
|
|
class _GesturePainter extends CustomPainter {
|
|
const _GesturePainter({
|
|
required this.zoom,
|
|
required this.offset,
|
|
required this.swatch,
|
|
required this.forward,
|
|
required this.scaleEnabled,
|
|
required this.tapEnabled,
|
|
required this.doubleTapEnabled,
|
|
required this.longPressEnabled,
|
|
});
|
|
|
|
final double zoom;
|
|
final Offset offset;
|
|
final MaterialColor swatch;
|
|
final bool forward;
|
|
final bool scaleEnabled;
|
|
final bool tapEnabled;
|
|
final bool doubleTapEnabled;
|
|
final bool longPressEnabled;
|
|
|
|
@override
|
|
void paint(Canvas canvas, Size size) {
|
|
final Offset center = size.center(Offset.zero) * zoom + offset;
|
|
final double radius = size.width / 2.0 * zoom;
|
|
final Gradient gradient = RadialGradient(
|
|
colors: forward
|
|
? <Color>[swatch.shade50, swatch.shade900]
|
|
: <Color>[swatch.shade900, swatch.shade50],
|
|
);
|
|
final Paint paint = Paint()
|
|
..shader = gradient.createShader(Rect.fromCircle(
|
|
center: center,
|
|
radius: radius,
|
|
));
|
|
canvas.drawCircle(center, radius, paint);
|
|
}
|
|
|
|
@override
|
|
bool shouldRepaint(_GesturePainter oldPainter) {
|
|
return oldPainter.zoom != zoom
|
|
|| oldPainter.offset != offset
|
|
|| oldPainter.swatch != swatch
|
|
|| oldPainter.forward != forward
|
|
|| oldPainter.scaleEnabled != scaleEnabled
|
|
|| oldPainter.tapEnabled != tapEnabled
|
|
|| oldPainter.doubleTapEnabled != doubleTapEnabled
|
|
|| oldPainter.longPressEnabled != longPressEnabled;
|
|
}
|
|
}
|
|
|
|
class GestureDemo extends StatefulWidget {
|
|
const GestureDemo({Key? key}) : super(key: key);
|
|
|
|
@override
|
|
GestureDemoState createState() => GestureDemoState();
|
|
}
|
|
|
|
class GestureDemoState extends State<GestureDemo> {
|
|
|
|
late Offset _startingFocalPoint;
|
|
|
|
late Offset _previousOffset;
|
|
Offset _offset = Offset.zero;
|
|
|
|
late double _previousZoom;
|
|
double _zoom = 1.0;
|
|
|
|
static const List<MaterialColor> kSwatches = <MaterialColor>[
|
|
Colors.red,
|
|
Colors.pink,
|
|
Colors.purple,
|
|
Colors.deepPurple,
|
|
Colors.indigo,
|
|
Colors.blue,
|
|
Colors.lightBlue,
|
|
Colors.cyan,
|
|
Colors.green,
|
|
Colors.lightGreen,
|
|
Colors.lime,
|
|
Colors.yellow,
|
|
Colors.amber,
|
|
Colors.orange,
|
|
Colors.deepOrange,
|
|
Colors.brown,
|
|
Colors.grey,
|
|
Colors.blueGrey,
|
|
];
|
|
int _swatchIndex = 0;
|
|
MaterialColor _swatch = kSwatches.first;
|
|
MaterialColor get swatch => _swatch;
|
|
|
|
bool _forward = true;
|
|
bool _scaleEnabled = true;
|
|
bool _tapEnabled = true;
|
|
bool _doubleTapEnabled = true;
|
|
bool _longPressEnabled = true;
|
|
|
|
void _handleScaleStart(ScaleStartDetails details) {
|
|
setState(() {
|
|
_startingFocalPoint = details.focalPoint;
|
|
_previousOffset = _offset;
|
|
_previousZoom = _zoom;
|
|
});
|
|
}
|
|
|
|
void _handleScaleUpdate(ScaleUpdateDetails details) {
|
|
setState(() {
|
|
_zoom = _previousZoom * details.scale;
|
|
|
|
// Ensure that item under the focal point stays in the same place despite zooming
|
|
final Offset normalizedOffset = (_startingFocalPoint - _previousOffset) / _previousZoom;
|
|
_offset = details.focalPoint - normalizedOffset * _zoom;
|
|
});
|
|
}
|
|
|
|
void _handleScaleReset() {
|
|
setState(() {
|
|
_zoom = 1.0;
|
|
_offset = Offset.zero;
|
|
});
|
|
}
|
|
|
|
void _handleColorChange() {
|
|
setState(() {
|
|
_swatchIndex += 1;
|
|
if (_swatchIndex == kSwatches.length)
|
|
_swatchIndex = 0;
|
|
_swatch = kSwatches[_swatchIndex];
|
|
});
|
|
}
|
|
|
|
void _handleDirectionChange() {
|
|
setState(() {
|
|
_forward = !_forward;
|
|
});
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Stack(
|
|
fit: StackFit.expand,
|
|
children: <Widget>[
|
|
GestureDetector(
|
|
onScaleStart: _scaleEnabled ? _handleScaleStart : null,
|
|
onScaleUpdate: _scaleEnabled ? _handleScaleUpdate : null,
|
|
onTap: _tapEnabled ? _handleColorChange : null,
|
|
onDoubleTap: _doubleTapEnabled ? _handleScaleReset : null,
|
|
onLongPress: _longPressEnabled ? _handleDirectionChange : null,
|
|
child: CustomPaint(
|
|
painter: _GesturePainter(
|
|
zoom: _zoom,
|
|
offset: _offset,
|
|
swatch: swatch,
|
|
forward: _forward,
|
|
scaleEnabled: _scaleEnabled,
|
|
tapEnabled: _tapEnabled,
|
|
doubleTapEnabled: _doubleTapEnabled,
|
|
longPressEnabled: _longPressEnabled,
|
|
),
|
|
),
|
|
),
|
|
Positioned(
|
|
bottom: 0.0,
|
|
left: 0.0,
|
|
child: Card(
|
|
child: Container(
|
|
padding: const EdgeInsets.all(4.0),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: <Widget>[
|
|
Row(
|
|
children: <Widget>[
|
|
Checkbox(
|
|
value: _scaleEnabled,
|
|
onChanged: (bool? value) { setState(() { _scaleEnabled = value!; }); },
|
|
),
|
|
const Text('Scale'),
|
|
],
|
|
),
|
|
Row(
|
|
children: <Widget>[
|
|
Checkbox(
|
|
value: _tapEnabled,
|
|
onChanged: (bool? value) { setState(() { _tapEnabled = value!; }); },
|
|
),
|
|
const Text('Tap'),
|
|
],
|
|
),
|
|
Row(
|
|
children: <Widget>[
|
|
Checkbox(
|
|
value: _doubleTapEnabled,
|
|
onChanged: (bool? value) { setState(() { _doubleTapEnabled = value!; }); },
|
|
),
|
|
const Text('Double Tap'),
|
|
],
|
|
),
|
|
Row(
|
|
children: <Widget>[
|
|
Checkbox(
|
|
value: _longPressEnabled,
|
|
onChanged: (bool? value) { setState(() { _longPressEnabled = value!; }); },
|
|
),
|
|
const Text('Long Press'),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
}
|
|
|
|
void main() {
|
|
runApp(MaterialApp(
|
|
theme: ThemeData.dark(),
|
|
home: Scaffold(
|
|
appBar: AppBar(title: const Text('Gestures Demo')),
|
|
body: const GestureDemo(),
|
|
),
|
|
));
|
|
}
|