1// Copyright 2018 The Chromium Authors. All rights reserved. 2// Use of this source code is governed by a BSD-style license that can be 3// found in the LICENSE file. 4 5import 'package:flutter/cupertino.dart'; 6import 'package:flutter/material.dart'; 7 8import '../../gallery/demo.dart'; 9 10const Color _kKeyUmbraOpacity = Color(0x33000000); // alpha = 0.2 11const Color _kKeyPenumbraOpacity = Color(0x24000000); // alpha = 0.14 12const Color _kAmbientShadowOpacity = Color(0x1F000000); // alpha = 0.12 13 14class CupertinoSegmentedControlDemo extends StatefulWidget { 15 static const String routeName = 'cupertino/segmented_control'; 16 17 @override 18 _CupertinoSegmentedControlDemoState createState() => _CupertinoSegmentedControlDemoState(); 19} 20 21class _CupertinoSegmentedControlDemoState extends State<CupertinoSegmentedControlDemo> { 22 final Map<int, Widget> children = const <int, Widget>{ 23 0: Text('Midnight'), 24 1: Text('Viridian'), 25 2: Text('Cerulean'), 26 }; 27 28 final Map<int, Widget> icons = const <int, Widget>{ 29 0: Center( 30 child: FlutterLogo( 31 colors: Colors.indigo, 32 size: 200.0, 33 ), 34 ), 35 1: Center( 36 child: FlutterLogo( 37 colors: Colors.teal, 38 size: 200.0, 39 ), 40 ), 41 2: Center( 42 child: FlutterLogo( 43 colors: Colors.cyan, 44 size: 200.0, 45 ), 46 ), 47 }; 48 49 int sharedValue = 0; 50 51 @override 52 Widget build(BuildContext context) { 53 return CupertinoPageScaffold( 54 navigationBar: CupertinoNavigationBar( 55 middle: const Text('Segmented Control'), 56 // We're specifying a back label here because the previous page is a 57 // Material page. CupertinoPageRoutes could auto-populate these back 58 // labels. 59 previousPageTitle: 'Cupertino', 60 trailing: CupertinoDemoDocumentationButton(CupertinoSegmentedControlDemo.routeName), 61 ), 62 child: DefaultTextStyle( 63 style: CupertinoTheme.of(context).textTheme.textStyle, 64 child: SafeArea( 65 child: Column( 66 children: <Widget>[ 67 const Padding( 68 padding: EdgeInsets.all(16.0), 69 ), 70 SizedBox( 71 width: 500.0, 72 child: CupertinoSegmentedControl<int>( 73 children: children, 74 onValueChanged: (int newValue) { 75 setState(() { 76 sharedValue = newValue; 77 }); 78 }, 79 groupValue: sharedValue, 80 ), 81 ), 82 Expanded( 83 child: Padding( 84 padding: const EdgeInsets.symmetric( 85 vertical: 32.0, 86 horizontal: 16.0, 87 ), 88 child: Container( 89 padding: const EdgeInsets.symmetric( 90 vertical: 64.0, 91 horizontal: 16.0, 92 ), 93 decoration: BoxDecoration( 94 color: CupertinoTheme.of(context).scaffoldBackgroundColor, 95 borderRadius: BorderRadius.circular(3.0), 96 boxShadow: const <BoxShadow>[ 97 BoxShadow( 98 offset: Offset(0.0, 3.0), 99 blurRadius: 5.0, 100 spreadRadius: -1.0, 101 color: _kKeyUmbraOpacity, 102 ), 103 BoxShadow( 104 offset: Offset(0.0, 6.0), 105 blurRadius: 10.0, 106 spreadRadius: 0.0, 107 color: _kKeyPenumbraOpacity, 108 ), 109 BoxShadow( 110 offset: Offset(0.0, 1.0), 111 blurRadius: 18.0, 112 spreadRadius: 0.0, 113 color: _kAmbientShadowOpacity, 114 ), 115 ], 116 ), 117 child: icons[sharedValue], 118 ), 119 ), 120 ), 121 ], 122 ), 123 ), 124 ), 125 ); 126 } 127} 128