flutter/examples/flutter_gallery/lib/demo/material/slider_demo.dart
Greg Spencer 701eff4ac5
Slider Visual Update (#14901)
This implements an update to the look of the Slider widget.

Specifically, it does the following:

* Adds the ability to customize the colors of all components of the slider
* Adds the ability to customize the shape of the slider thumb and value indicator
* Adds the ability to show the value indicator on continuous sliders
* Updates the default value indicator to be a "paddle" shape with new animations.
* Changes the tick marks to be visible all the time on discrete sliders
* Fixes a memory leak of an animation controller.
* Removes "thumbOpenAtMin" flag, which is no longer needed, and can be emulated by the
custom thumb shape support. It was not widely used.
* Adds tests for all of the new features.
2018-03-01 13:03:20 -08:00

74 lines
2.1 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 'package:flutter/material.dart';
class SliderDemo extends StatefulWidget {
static const String routeName = '/material/slider';
@override
_SliderDemoState createState() => new _SliderDemoState();
}
class _SliderDemoState extends State<SliderDemo> {
double _value = 25.0;
double _discreteValue = 20.0;
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(title: const Text('Sliders')),
body: new Padding(
padding: const EdgeInsets.symmetric(horizontal: 40.0),
child: new Column(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
new Column(
mainAxisSize: MainAxisSize.min,
children: <Widget> [
new Slider(
value: _value,
min: 0.0,
max: 100.0,
onChanged: (double value) {
setState(() {
_value = value;
});
}
),
const Text('Continuous'),
]
),
new Column(
mainAxisSize: MainAxisSize.min,
children: const <Widget> [
const Slider(value: 0.25, onChanged: null),
const Text('Disabled'),
]
),
new Column(
mainAxisSize: MainAxisSize.min,
children: <Widget> [
new Slider(
value: _discreteValue,
min: 0.0,
max: 100.0,
divisions: 5,
label: '${_discreteValue.round()}',
onChanged: (double value) {
setState(() {
_discreteValue = value;
});
}
),
const Text('Discrete'),
],
),
],
),
),
);
}
}