diff --git a/CHANGELOG.md b/CHANGELOG.md index 58278dd2..743c60a4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,4 +1,9 @@ +## [0.0.3] + +* Implemented the `Switch` widget + ## [0.0.2] + * `Scaffold` widget * Fix `Typography` so that text color is shown appropriately based on Brightness diff --git a/example/lib/main.dart b/example/lib/main.dart index 3894cc46..d7c40abd 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -32,20 +32,30 @@ class MyApp extends StatelessWidget { } } -class Demo extends StatelessWidget { +class Demo extends StatefulWidget { + @override + _DemoState createState() => _DemoState(); +} + +class _DemoState extends State { + + bool value = false; + @override Widget build(BuildContext context) { return Scaffold( sidebar: Center( child: Text('Sidebar'), ), - body: Center( - child: Container( - height: 50.0, - width: 50.0, - color: context.style.primaryColor, - ), + body: Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Switch( + value: value, + onChanged: (v) => setState(() => value = v), + ), + ], ), ); } -} +} \ No newline at end of file diff --git a/lib/macos_ui.dart b/lib/macos_ui.dart index e5464ea6..ae8033d0 100644 --- a/lib/macos_ui.dart +++ b/lib/macos_ui.dart @@ -20,3 +20,4 @@ export 'src/util.dart'; export 'src/styles/theme.dart'; export 'src/styles/typography.dart'; export 'src/layout/scaffold.dart'; +export 'src/buttons/switch.dart'; \ No newline at end of file diff --git a/lib/src/buttons/switch.dart b/lib/src/buttons/switch.dart new file mode 100644 index 00000000..89344ea4 --- /dev/null +++ b/lib/src/buttons/switch.dart @@ -0,0 +1,73 @@ +import 'package:flutter/gestures.dart'; +import 'package:macos_ui/macos_ui.dart'; + +import 'package:flutter/cupertino.dart' as c; + +/// A switch is a visual toggle between two mutually exclusive +/// states — on and off. A switch shows that it's on when the +/// accent color is visible and off when the switch appears colorless. +class Switch extends StatelessWidget { + const Switch({ + Key? key, + required this.value, + required this.onChanged, + this.dragStartBehavior = DragStartBehavior.start, + this.activeColor, + this.trackColor, + }) : super(key: key); + + /// Whether this switch is on or off. + /// + /// Must not be null. + final bool value; + + /// Called when the user toggles with switch on or off. + /// + /// The switch passes the new value to the callback but does not actually + /// change state until the parent widget rebuilds the switch with the new + /// value. + /// + /// If null, the switch will be displayed as disabled, which has a reduced opacity. + /// + /// The callback provided to onChanged should update the state of the parent + /// [StatefulWidget] using the [State.setState] method, so that the parent + /// gets rebuilt; for example: + /// + /// ```dart + /// Switch( + /// value: _giveVerse, + /// onChanged: (bool newValue) { + /// setState(() { + /// _giveVerse = newValue; + /// }); + /// }, + /// ) + /// ``` + final ValueChanged? onChanged; + + /// {@macro flutter.cupertino.CupertinoSwitch.dragStartBehavior} + final DragStartBehavior dragStartBehavior; + + /// The color to use when this switch is on. + /// + /// Defaults to [Style.primaryColor] when null. + final Color? activeColor; + + /// The color to use for the background when the switch is off. + /// + /// Defaults to [CupertinoColors.secondarySystemFill] when null. + final Color? trackColor; + + @override + Widget build(BuildContext context) { + return c.CupertinoSwitch( + value: value, + onChanged: onChanged, + dragStartBehavior: dragStartBehavior, + activeColor: activeColor ?? + context.maybeStyle?.primaryColor ?? + CupertinoColors.activeBlue, + trackColor: trackColor, + ); + } +} diff --git a/lib/src/styles/theme.dart b/lib/src/styles/theme.dart index ed10d265..15eca846 100644 --- a/lib/src/styles/theme.dart +++ b/lib/src/styles/theme.dart @@ -19,10 +19,10 @@ class MacosTheme extends InheritedWidget { .build(); } - static Style maybeOf(BuildContext context) { + static Style? maybeOf(BuildContext context) { return context - .dependOnInheritedWidgetOfExactType()! - .style + .dependOnInheritedWidgetOfExactType() + ?.style .build(); } diff --git a/pubspec.yaml b/pubspec.yaml index 4cfe9179..f2e8a57d 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,6 +1,6 @@ name: macos_ui description: Implements Apple's macOS Design System in Flutter. Based on the official documentation. -version: 0.0.2 +version: 0.0.3 homepage: 'https://github.com/GroovinChip/macos_ui' environment: