Skip to content

Commit

Permalink
feat: platform scaffold
Browse files Browse the repository at this point in the history
  • Loading branch information
@KRTirtho
KRTirtho committed Oct 29, 2022
1 parent cf2ac7a commit f40dc03
Show file tree
Hide file tree
Showing 5 changed files with 244 additions and 243 deletions.
258 changes: 127 additions & 131 deletions example/lib/main.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,137 +100,133 @@ class _MyHomePageState extends State<MyHomePage> {
PlatformTab(
label: "Widgets",
icon: const Icon(Icons.collections_bookmark_rounded),
): Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
PlatformFilledButton(
child: const Text('Android'),
onPressed: () =>
widget.onChange(TargetPlatform.android),
),
PlatformFilledButton(
child: const Text('iOS'),
onPressed: () => widget.onChange(TargetPlatform.iOS),
),
PlatformFilledButton(
child: const Text('Linux'),
onPressed: () =>
widget.onChange(TargetPlatform.linux),
),
PlatformFilledButton(
child: const Text('MacOS'),
onPressed: () =>
widget.onChange(TargetPlatform.macOS),
),
PlatformFilledButton(
child: const Text('Windows'),
onPressed: () =>
widget.onChange(TargetPlatform.windows),
),
],
),
const Text(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.headline4,
),
PlatformFilledButton(
child: const Text("Filled Button"),
onPressed: () {
setState(() {
_counter++;
});
},
),
PlatformTextButton(
child: const Text("Text Button"),
onPressed: () {
setState(() {
_counter++;
});
},
),
PlatformIconButton(
icon: const Icon(Icons.star_border_rounded),
onPressed: () {},
),
PlatformSwitch(
value: checked,
onChanged: (value) {
setState(() {
checked = value;
});
},
activeThumbColor: Colors.red,
activeTrackColor: Colors.red[800],
inactiveTrackColor: Colors.white,
inactiveThumbColor: Colors.green,
),
const PlatformTextField(
padding: EdgeInsets.all(8),
placeholder: "Placeholder",
label: "Label",
backgroundColor: Colors.blue,
focusedBackgroundColor: Colors.amber,
),
PlatformDropDownMenu(
onChanged: (value) {},
dropdownColor: Colors.grey,
elevation: 20,
items: [
PlatformDropDownMenuItem(
child: const Text("LOL"),
value: "LOL",
),
PlatformDropDownMenuItem(
child: const Text("Cool"),
value: "Cool",
),
PlatformDropDownMenuItem(
child: const Text("Foul"),
value: "Foul",
),
],
),
PlatformListTile(
title: const Text("Title"),
subtitle: const Text("Subtitle"),
leading: const Icon(Icons.star_border_rounded),
trailing: const Icon(Icons.star_border_rounded),
onTap: () {
print("Tapped");
},
onLongPress: () {
print("Long Pressed");
},
),
PlatformListTile(
title: const Text("Title"),
subtitle: const Text("Subtitle"),
leading: const Icon(Icons.accessibility_outlined),
trailing: const Icon(
Icons.airline_seat_legroom_reduced_outlined),
onTap: () {
print("Tapped");
},
onLongPress: () {
print("Long Pressed");
},
),
PlatformTooltip(
message:
"Really Wonderful ${Theme.of(context).platform.name}",
child: const Text("Hover/Long-Press for Tooltip"),
),
const Text("Hover/Long-Press for Popup Menu"),
],
),
): Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
PlatformFilledButton(
child: const Text('Android'),
onPressed: () =>
widget.onChange(TargetPlatform.android),
),
PlatformFilledButton(
child: const Text('iOS'),
onPressed: () => widget.onChange(TargetPlatform.iOS),
),
PlatformFilledButton(
child: const Text('Linux'),
onPressed: () => widget.onChange(TargetPlatform.linux),
),
PlatformFilledButton(
child: const Text('MacOS'),
onPressed: () => widget.onChange(TargetPlatform.macOS),
),
PlatformFilledButton(
child: const Text('Windows'),
onPressed: () =>
widget.onChange(TargetPlatform.windows),
),
],
),
const Text(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.headline4,
),
PlatformFilledButton(
child: const Text("Filled Button"),
onPressed: () {
setState(() {
_counter++;
});
},
),
PlatformTextButton(
child: const Text("Text Button"),
onPressed: () {
setState(() {
_counter++;
});
},
),
PlatformIconButton(
icon: const Icon(Icons.star_border_rounded),
onPressed: () {},
),
PlatformSwitch(
value: checked,
onChanged: (value) {
setState(() {
checked = value;
});
},
activeThumbColor: Colors.red,
activeTrackColor: Colors.red[800],
inactiveTrackColor: Colors.white,
inactiveThumbColor: Colors.green,
),
const PlatformTextField(
padding: EdgeInsets.all(8),
placeholder: "Placeholder",
label: "Label",
backgroundColor: Colors.blue,
focusedBackgroundColor: Colors.amber,
),
PlatformDropDownMenu(
onChanged: (value) {},
dropdownColor: Colors.grey,
elevation: 20,
items: [
PlatformDropDownMenuItem(
child: const Text("LOL"),
value: "LOL",
),
PlatformDropDownMenuItem(
child: const Text("Cool"),
value: "Cool",
),
PlatformDropDownMenuItem(
child: const Text("Foul"),
value: "Foul",
),
],
),
PlatformListTile(
title: const Text("Title"),
subtitle: const Text("Subtitle"),
leading: const Icon(Icons.star_border_rounded),
trailing: const Icon(Icons.star_border_rounded),
onTap: () {
print("Tapped");
},
onLongPress: () {
print("Long Pressed");
},
),
PlatformListTile(
title: const Text("Title"),
subtitle: const Text("Subtitle"),
leading: const Icon(Icons.accessibility_outlined),
trailing:
const Icon(Icons.airline_seat_legroom_reduced_outlined),
onTap: () {
print("Tapped");
},
onLongPress: () {
print("Long Pressed");
},
),
PlatformTooltip(
message:
"Really Wonderful ${Theme.of(context).platform.name}",
child: const Text("Hover/Long-Press for Tooltip"),
),
const Text("Hover/Long-Press for Popup Menu"),
],
),
PlatformTab(
label: "Apple's HIG",
Expand Down
10 changes: 10 additions & 0 deletions lib/src/platform_property.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,16 @@ class PlatformProperty<T> {
}
}

factory PlatformProperty.all(T value) {
return PlatformProperty(
android: value,
ios: value,
macos: value,
linux: value,
windows: value,
);
}

factory PlatformProperty.byPlatformGroup({
required T mobile,
required T desktop,
Expand Down
65 changes: 17 additions & 48 deletions lib/src/platform_scaffold.dart
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import 'package:fluent_ui/fluent_ui.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:macos_ui/macos_ui.dart';
import 'package:platform_ui/src/platform_app_bar.dart';
import 'package:platform_ui/src/platform_mixin.dart';
import 'package:platform_ui/platform_ui.dart';

class PlatformScaffold extends StatelessWidget with PlatformMixin<Widget> {
class PlatformScaffold extends StatelessWidget {
final bool extendBody;
final bool extendBodyBehindAppBar;
final PreferredSizeWidget? appBar;
Expand All @@ -20,7 +20,7 @@ class PlatformScaffold extends StatelessWidget with PlatformMixin<Widget> {
final Widget? endDrawer;
final DrawerCallback? onEndDrawerChanged;
final Color? drawerScrimColor;
final Color? backgroundColor;
final PlatformProperty<Color>? backgroundColor;
final Widget? bottomNavigationBar;
final Widget? bottomSheet;
final bool? resizeToAvoidBottomInset;
Expand Down Expand Up @@ -58,8 +58,20 @@ class PlatformScaffold extends StatelessWidget with PlatformMixin<Widget> {
this.endDrawerEnableOpenDragGesture = true,
this.restorationId,
}) : super(key: key);

@override
Widget android(context) {
Widget build(BuildContext context) {
final backgroundColor = (this.backgroundColor ??
PlatformProperty(
android: Theme.of(context).scaffoldBackgroundColor,
ios: CupertinoTheme.of(context).scaffoldBackgroundColor,
macos: MacosTheme.of(context).canvasColor,
windows: Theme.of(context).platform == TargetPlatform.windows
? FluentTheme.of(context).scaffoldBackgroundColor
: Theme.of(context).scaffoldBackgroundColor,
linux: Theme.of(context).scaffoldBackgroundColor,
))
.resolve(Theme.of(context).platform);
return Scaffold(
extendBody: extendBody,
extendBodyBehindAppBar: extendBodyBehindAppBar,
Expand Down Expand Up @@ -87,47 +99,4 @@ class PlatformScaffold extends StatelessWidget with PlatformMixin<Widget> {
restorationId: restorationId,
);
}

@override
Widget ios(context) {
return CupertinoPageScaffold(
// TODO: Do something for [CuopertinoNavBar]
backgroundColor: backgroundColor,
navigationBar: appBar is ObstructingPreferredSizeWidget
? appBar as ObstructingPreferredSizeWidget
: null,
resizeToAvoidBottomInset: resizeToAvoidBottomInset ?? true,
child: body,
);
}

@override
Widget linux(context) {
return android(context);
}

@override
Widget macos(context) {
return MacosScaffold(
toolBar: (appBar is PlatformAppBar)
? (appBar as PlatformAppBar).macos(context) as ToolBar
: null,
backgroundColor: backgroundColor,
children: [
ContentArea(
builder: (context, scrollController) => body,
),
],
);
}

@override
Widget windows(context) {
return android(context);
}

@override
Widget build(BuildContext context) {
return getPlatformType(context);
}
}
Loading

0 comments on commit f40dc03

Please sign in to comment.