Add segmented control to gallery (#19425)
This commit is contained in:
parent
0098b11d8e
commit
64532336f4
@ -8,5 +8,6 @@ export 'cupertino_dialog_demo.dart';
|
||||
export 'cupertino_navigation_demo.dart';
|
||||
export 'cupertino_picker_demo.dart';
|
||||
export 'cupertino_refresh_demo.dart';
|
||||
export 'cupertino_segmented_control_demo.dart';
|
||||
export 'cupertino_slider_demo.dart';
|
||||
export 'cupertino_switch_demo.dart';
|
||||
|
@ -0,0 +1,115 @@
|
||||
// Copyright 2018 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/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
const Color _kKeyUmbraOpacity = Color(0x33000000); // alpha = 0.2
|
||||
const Color _kKeyPenumbraOpacity = Color(0x24000000); // alpha = 0.14
|
||||
const Color _kAmbientShadowOpacity = Color(0x1F000000); // alpha = 0.12
|
||||
|
||||
class CupertinoSegmentedControlDemo extends StatefulWidget {
|
||||
static const String routeName = 'cupertino/segmented_control';
|
||||
|
||||
@override
|
||||
_CupertinoSegmentedControlDemoState createState() => new _CupertinoSegmentedControlDemoState();
|
||||
}
|
||||
|
||||
class _CupertinoSegmentedControlDemoState extends State<CupertinoSegmentedControlDemo> {
|
||||
final Map<int, Widget> children = const <int, Widget>{
|
||||
0: Text('Midnight'),
|
||||
1: Text('Viridian'),
|
||||
2: Text('Cerulean'),
|
||||
};
|
||||
|
||||
final Map<int, Widget> icons = const <int, Widget>{
|
||||
0: Center(
|
||||
child: FlutterLogo(
|
||||
colors: Colors.indigo,
|
||||
size: 200.0,
|
||||
),
|
||||
),
|
||||
1: Center(
|
||||
child: FlutterLogo(
|
||||
colors: Colors.teal,
|
||||
size: 200.0,
|
||||
),
|
||||
),
|
||||
2: Center(
|
||||
child: FlutterLogo(
|
||||
colors: Colors.cyan,
|
||||
size: 200.0,
|
||||
),
|
||||
),
|
||||
};
|
||||
|
||||
int sharedValue = 0;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return new Scaffold(
|
||||
appBar: new AppBar(
|
||||
title: const Text('Segmented Control'),
|
||||
),
|
||||
body: new Column(
|
||||
children: <Widget>[
|
||||
const Padding(
|
||||
padding: EdgeInsets.all(16.0),
|
||||
),
|
||||
new SizedBox(
|
||||
width: 500.0,
|
||||
child: new CupertinoSegmentedControl<int>(
|
||||
children: children,
|
||||
onValueChanged: (int newValue) {
|
||||
setState(() {
|
||||
sharedValue = newValue;
|
||||
});
|
||||
},
|
||||
groupValue: sharedValue,
|
||||
),
|
||||
),
|
||||
new Expanded(
|
||||
child: new Padding(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
vertical: 32.0,
|
||||
horizontal: 16.0,
|
||||
),
|
||||
child: new Container(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
vertical: 64.0,
|
||||
horizontal: 16.0,
|
||||
),
|
||||
decoration: new BoxDecoration(
|
||||
color: CupertinoColors.white,
|
||||
borderRadius: new BorderRadius.circular(3.0),
|
||||
boxShadow: const <BoxShadow>[
|
||||
BoxShadow(
|
||||
offset: Offset(0.0, 3.0),
|
||||
blurRadius: 5.0,
|
||||
spreadRadius: -1.0,
|
||||
color: _kKeyUmbraOpacity,
|
||||
),
|
||||
BoxShadow(
|
||||
offset: Offset(0.0, 6.0),
|
||||
blurRadius: 10.0,
|
||||
spreadRadius: 0.0,
|
||||
color: _kKeyPenumbraOpacity,
|
||||
),
|
||||
BoxShadow(
|
||||
offset: Offset(0.0, 1.0),
|
||||
blurRadius: 18.0,
|
||||
spreadRadius: 0.0,
|
||||
color: _kAmbientShadowOpacity,
|
||||
),
|
||||
],
|
||||
),
|
||||
child: icons[sharedValue],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
@ -429,6 +429,13 @@ List<GalleryDemo> _buildGalleryDemos() {
|
||||
routeName: CupertinoRefreshControlDemo.routeName,
|
||||
buildRoute: (BuildContext context) => new CupertinoRefreshControlDemo(),
|
||||
),
|
||||
new GalleryDemo(
|
||||
title: 'Segmented Control',
|
||||
icon: GalleryIcons.tabs,
|
||||
category: _kCupertinoComponents,
|
||||
routeName: CupertinoSegmentedControlDemo.routeName,
|
||||
buildRoute: (BuildContext context) => new CupertinoSegmentedControlDemo(),
|
||||
),
|
||||
new GalleryDemo(
|
||||
title: 'Sliders',
|
||||
icon: GalleryIcons.sliders,
|
||||
|
Loading…
x
Reference in New Issue
Block a user