| // Copyright 2019 The Flutter team. 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'; |
| |
| import 'package:gallery/l10n/gallery_localizations.dart'; |
| |
| // BEGIN cupertinoSegmentedControlDemo |
| |
| class CupertinoSegmentedControlDemo extends StatefulWidget { |
| @override |
| _CupertinoSegmentedControlDemoState createState() => |
| _CupertinoSegmentedControlDemoState(); |
| } |
| |
| class _CupertinoSegmentedControlDemoState |
| extends State<CupertinoSegmentedControlDemo> { |
| int currentSegment = 0; |
| |
| void onValueChanged(int newValue) { |
| setState(() { |
| currentSegment = newValue; |
| }); |
| } |
| |
| @override |
| Widget build(BuildContext context) { |
| final localizations = GalleryLocalizations.of(context); |
| final segmentedControlMaxWidth = 500.0; |
| final children = <int, Widget>{ |
| 0: Text(localizations.colorsIndigo), |
| 1: Text(localizations.colorsTeal), |
| 2: Text(localizations.colorsCyan), |
| }; |
| |
| return CupertinoPageScaffold( |
| navigationBar: CupertinoNavigationBar( |
| middle: Text( |
| localizations.demoCupertinoSegmentedControlTitle, |
| ), |
| ), |
| child: DefaultTextStyle( |
| style: CupertinoTheme.of(context) |
| .textTheme |
| .textStyle |
| .copyWith(fontSize: 13), |
| child: SafeArea( |
| child: ListView( |
| children: [ |
| const SizedBox(height: 16), |
| SizedBox( |
| width: segmentedControlMaxWidth, |
| child: CupertinoSegmentedControl<int>( |
| children: children, |
| onValueChanged: onValueChanged, |
| groupValue: currentSegment, |
| ), |
| ), |
| SizedBox( |
| width: segmentedControlMaxWidth, |
| child: Padding( |
| padding: const EdgeInsets.all(16), |
| child: CupertinoSlidingSegmentedControl<int>( |
| children: children, |
| onValueChanged: onValueChanged, |
| groupValue: currentSegment, |
| ), |
| ), |
| ), |
| Container( |
| padding: const EdgeInsets.all(16), |
| height: 300, |
| alignment: Alignment.center, |
| child: children[currentSegment], |
| ), |
| ], |
| ), |
| ), |
| ), |
| ); |
| } |
| } |
| |
| // END |