diff --git a/examples/flutter_gallery/lib/demo/cupertino/cupertino.dart b/examples/flutter_gallery/lib/demo/cupertino/cupertino.dart index da10d713428..641c1689943 100644 --- a/examples/flutter_gallery/lib/demo/cupertino/cupertino.dart +++ b/examples/flutter_gallery/lib/demo/cupertino/cupertino.dart @@ -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'; diff --git a/examples/flutter_gallery/lib/demo/cupertino/cupertino_segmented_control_demo.dart b/examples/flutter_gallery/lib/demo/cupertino/cupertino_segmented_control_demo.dart new file mode 100644 index 00000000000..09e7c51b6f4 --- /dev/null +++ b/examples/flutter_gallery/lib/demo/cupertino/cupertino_segmented_control_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 { + final Map children = const { + 0: Text('Midnight'), + 1: Text('Viridian'), + 2: Text('Cerulean'), + }; + + final Map icons = const { + 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: [ + const Padding( + padding: EdgeInsets.all(16.0), + ), + new SizedBox( + width: 500.0, + child: new CupertinoSegmentedControl( + 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( + 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], + ), + ), + ), + ], + ), + ); + } +} diff --git a/examples/flutter_gallery/lib/gallery/demos.dart b/examples/flutter_gallery/lib/gallery/demos.dart index 7ae47490ae9..f71545d7b7a 100644 --- a/examples/flutter_gallery/lib/gallery/demos.dart +++ b/examples/flutter_gallery/lib/gallery/demos.dart @@ -429,6 +429,13 @@ List _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,