mirror of https://github.com/flutter/samples.git
Update VeggieSeasons Settings screen to use CupertinoList (#2426)
## Pre-launch Checklist - [x] I read the [Flutter Style Guide] _recently_, and have followed its advice. - [x] I signed the [CLA]. - [x] I read the [Contributors Guide]. - [x] I updated/added relevant documentation (doc comments with `///`). - [x] All existing and new tests are passing. If you need help, consider asking for advice on the #hackers-devrel channel on [Discord]. <!-- Links --> [Flutter Style Guide]: https://github.com/flutter/flutter/blob/master/docs/contributing/Style-guide-for-Flutter-repo.md [CLA]: https://cla.developers.google.com/ [Discord]: https://github.com/flutter/flutter/blob/master/docs/contributing/Chat.md [Contributors Guide]: https://github.com/flutter/samples/blob/main/CONTRIBUTING.mdpull/2427/head
Michael Thomsen
4 months ago
committed by
GitHub
parent
8d208d7fd4
commit
2bb837ea6e
@ -1,111 +0,0 @@
|
|||||||
// Copyright 2018 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 '../styles.dart';
|
|
||||||
|
|
||||||
import 'settings_item.dart';
|
|
||||||
|
|
||||||
// The widgets in this file present a group of Cupertino-style settings items to
|
|
||||||
// the user. In the future, the Cupertino package in the Flutter SDK will
|
|
||||||
// include dedicated widgets for this purpose, but for now they're done here.
|
|
||||||
//
|
|
||||||
// See https://github.com/flutter/flutter/projects/29 for more info.
|
|
||||||
|
|
||||||
class SettingsGroupHeader extends StatelessWidget {
|
|
||||||
const SettingsGroupHeader(this.title, {super.key});
|
|
||||||
|
|
||||||
final String title;
|
|
||||||
|
|
||||||
@override
|
|
||||||
Widget build(BuildContext context) {
|
|
||||||
return Padding(
|
|
||||||
padding: const EdgeInsets.only(
|
|
||||||
left: 15,
|
|
||||||
right: 15,
|
|
||||||
bottom: 6,
|
|
||||||
),
|
|
||||||
child: Text(
|
|
||||||
title.toUpperCase(),
|
|
||||||
style: Styles.settingsGroupHeaderText(CupertinoTheme.of(context)),
|
|
||||||
),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
class SettingsGroupFooter extends StatelessWidget {
|
|
||||||
const SettingsGroupFooter(this.title, {super.key});
|
|
||||||
|
|
||||||
final String title;
|
|
||||||
|
|
||||||
@override
|
|
||||||
Widget build(BuildContext context) {
|
|
||||||
return Padding(
|
|
||||||
padding: const EdgeInsets.only(
|
|
||||||
left: 15,
|
|
||||||
right: 15,
|
|
||||||
top: 7.5,
|
|
||||||
),
|
|
||||||
child: Text(title,
|
|
||||||
style: Styles.settingsGroupFooterText(CupertinoTheme.of(context))),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
class SettingsGroup extends StatelessWidget {
|
|
||||||
SettingsGroup({
|
|
||||||
required this.items,
|
|
||||||
this.header,
|
|
||||||
this.footer,
|
|
||||||
super.key,
|
|
||||||
}) : assert(items.isNotEmpty);
|
|
||||||
|
|
||||||
final List<SettingsItem> items;
|
|
||||||
final Widget? header;
|
|
||||||
final Widget? footer;
|
|
||||||
@override
|
|
||||||
Widget build(BuildContext context) {
|
|
||||||
var brightness = CupertinoTheme.brightnessOf(context);
|
|
||||||
final dividedItems = <Widget>[items[0]];
|
|
||||||
for (var i = 1; i < items.length; i++) {
|
|
||||||
dividedItems.add(Container(
|
|
||||||
color: Styles.settingsLineation(brightness),
|
|
||||||
height: 0.3,
|
|
||||||
));
|
|
||||||
dividedItems.add(items[i]);
|
|
||||||
}
|
|
||||||
|
|
||||||
return Padding(
|
|
||||||
padding: EdgeInsets.only(
|
|
||||||
top: header == null ? 35 : 22,
|
|
||||||
),
|
|
||||||
child: Column(
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
|
||||||
children: [
|
|
||||||
if (header != null) header!,
|
|
||||||
Container(
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
color: CupertinoColors.white,
|
|
||||||
border: Border(
|
|
||||||
top: BorderSide(
|
|
||||||
color: Styles.settingsLineation(brightness),
|
|
||||||
width: 0,
|
|
||||||
),
|
|
||||||
bottom: BorderSide(
|
|
||||||
color: Styles.settingsLineation(brightness),
|
|
||||||
width: 0,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
child: Column(
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
|
||||||
children: dividedItems,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
if (footer != null) footer!,
|
|
||||||
],
|
|
||||||
),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,161 +0,0 @@
|
|||||||
// Copyright 2018 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 'dart:async';
|
|
||||||
|
|
||||||
import 'package:flutter/cupertino.dart';
|
|
||||||
import '../styles.dart';
|
|
||||||
|
|
||||||
// The widgets in this file present a Cupertino-style settings item to the user.
|
|
||||||
// In the future, the Cupertino package in the Flutter SDK will include
|
|
||||||
// dedicated widgets for this purpose, but for now they're done here.
|
|
||||||
//
|
|
||||||
// See https://github.com/flutter/flutter/projects/29 for more info.
|
|
||||||
|
|
||||||
typedef SettingsItemCallback = FutureOr<void> Function();
|
|
||||||
|
|
||||||
class SettingsNavigationIndicator extends StatelessWidget {
|
|
||||||
const SettingsNavigationIndicator({super.key});
|
|
||||||
|
|
||||||
@override
|
|
||||||
Widget build(BuildContext context) {
|
|
||||||
return const Icon(
|
|
||||||
CupertinoIcons.forward,
|
|
||||||
color: Styles.settingsMediumGray,
|
|
||||||
size: 21,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
class SettingsIcon extends StatelessWidget {
|
|
||||||
const SettingsIcon({
|
|
||||||
required this.icon,
|
|
||||||
this.foregroundColor = CupertinoColors.white,
|
|
||||||
this.backgroundColor = CupertinoColors.black,
|
|
||||||
super.key,
|
|
||||||
});
|
|
||||||
|
|
||||||
final Color backgroundColor;
|
|
||||||
final Color foregroundColor;
|
|
||||||
final IconData icon;
|
|
||||||
|
|
||||||
@override
|
|
||||||
Widget build(BuildContext context) {
|
|
||||||
return Container(
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
borderRadius: BorderRadius.circular(5),
|
|
||||||
color: backgroundColor,
|
|
||||||
),
|
|
||||||
child: Center(
|
|
||||||
child: Icon(
|
|
||||||
icon,
|
|
||||||
color: foregroundColor,
|
|
||||||
size: 20,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
class SettingsItem extends StatefulWidget {
|
|
||||||
const SettingsItem({
|
|
||||||
required this.label,
|
|
||||||
this.icon,
|
|
||||||
this.content,
|
|
||||||
this.subtitle,
|
|
||||||
this.onPress,
|
|
||||||
super.key,
|
|
||||||
});
|
|
||||||
|
|
||||||
final String label;
|
|
||||||
final Widget? icon;
|
|
||||||
final Widget? content;
|
|
||||||
final String? subtitle;
|
|
||||||
final SettingsItemCallback? onPress;
|
|
||||||
|
|
||||||
@override
|
|
||||||
State<SettingsItem> createState() => _SettingsItemState();
|
|
||||||
}
|
|
||||||
|
|
||||||
class _SettingsItemState extends State<SettingsItem> {
|
|
||||||
bool pressed = false;
|
|
||||||
|
|
||||||
@override
|
|
||||||
Widget build(BuildContext context) {
|
|
||||||
var themeData = CupertinoTheme.of(context);
|
|
||||||
var brightness = CupertinoTheme.brightnessOf(context);
|
|
||||||
return AnimatedContainer(
|
|
||||||
duration: const Duration(milliseconds: 200),
|
|
||||||
color: Styles.settingsItemColor(brightness),
|
|
||||||
child: GestureDetector(
|
|
||||||
behavior: HitTestBehavior.opaque,
|
|
||||||
onTap: () async {
|
|
||||||
if (widget.onPress != null) {
|
|
||||||
setState(() {
|
|
||||||
pressed = true;
|
|
||||||
});
|
|
||||||
await widget.onPress!();
|
|
||||||
Future.delayed(
|
|
||||||
const Duration(milliseconds: 150),
|
|
||||||
() {
|
|
||||||
setState(() {
|
|
||||||
pressed = false;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
child: SizedBox(
|
|
||||||
height: widget.subtitle == null ? 44 : 57,
|
|
||||||
child: Row(
|
|
||||||
children: [
|
|
||||||
if (widget.icon != null)
|
|
||||||
Padding(
|
|
||||||
padding: const EdgeInsets.only(
|
|
||||||
left: 15,
|
|
||||||
bottom: 2,
|
|
||||||
),
|
|
||||||
child: SizedBox(
|
|
||||||
height: 29,
|
|
||||||
width: 29,
|
|
||||||
child: widget.icon,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Expanded(
|
|
||||||
child: Padding(
|
|
||||||
padding: const EdgeInsets.only(
|
|
||||||
left: 15,
|
|
||||||
),
|
|
||||||
child: widget.subtitle != null
|
|
||||||
? Column(
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
|
||||||
children: [
|
|
||||||
const SizedBox(height: 8.5),
|
|
||||||
Text(widget.label,
|
|
||||||
style: themeData.textTheme.textStyle),
|
|
||||||
const SizedBox(height: 4),
|
|
||||||
Text(
|
|
||||||
widget.subtitle!,
|
|
||||||
style: Styles.settingsItemSubtitleText(themeData),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
)
|
|
||||||
: Padding(
|
|
||||||
padding: const EdgeInsets.only(top: 1.5),
|
|
||||||
child: Text(widget.label,
|
|
||||||
style: themeData.textTheme.textStyle),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Padding(
|
|
||||||
padding: const EdgeInsets.only(right: 11),
|
|
||||||
child: widget.content ?? Container(),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Loading…
Reference in new issue