Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: adding different frames to NesDialos #137

Merged
merged 2 commits into from
Mar 15, 2024
Merged

feat: adding different frames to NesDialos #137

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
eb191dc
changelog
erickzanardo Mar 13, 2024
b1e1c4e
Merge branch 'main' into feat/window-dialogs
erickzanardo Mar 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
# 0.20.0
- feat: adding different frames to `NesDialog`s

# 0.19.0
- feat: adding `NesSectionHeader`
- feat: adding `NesIcons16.check`
Expand All @@ -9,7 +12,6 @@
- feat: adding `NesIcons16.rightArrowIndicator`
- feat: adding `NesIcons16.topArrowIndicator`
- feat: adding `NesIcons16.bottomArrowIndicator`
- feat: adding frame customization to `NesDialog`

# 0.18.0
- feat: add `NesIcons.wrench`
Expand Down
85 changes: 84 additions & 1 deletion example/lib/gallery/sections/dialogs.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ class DialogsSection extends StatelessWidget {
style: theme.textTheme.displayMedium,
),
const SizedBox(height: 16),
Row(
Wrap(
children: [
NesButton(
type: NesButtonType.normal,
Expand Down Expand Up @@ -58,6 +58,89 @@ class DialogsSection extends StatelessWidget {
),
],
),
const SizedBox(height: 16),
Text(
'Dialogs with NesWindowDialogFrame',
style: theme.textTheme.displayMedium,
),
const SizedBox(height: 16),
Wrap(
children: [
NesButton(
type: NesButtonType.normal,
child: const Text('Plain'),
onPressed: () {
NesDialog.show<void>(
context: context,
builder: (_) => const Text('Hello World'),
frame: const NesWindowDialogFrame(),
);
},
),
const SizedBox(width: 16),
NesButton(
type: NesButtonType.normal,
child: const Text('Confirmation'),
onPressed: () {
NesConfirmDialog.show(
context: context,
frame: const NesWindowDialogFrame(),
);
},
),
const SizedBox(width: 16),
NesButton(
type: NesButtonType.normal,
child: const Text('Input'),
onPressed: () async {
void showSnack(String? inputData) {
if (inputData != null) {
NesSnackbar.show(
context,
text: inputData,
);
}
}

final inputData = await NesInputDialog.show(
context: context,
message: 'What is the coolest NES game?',
frame: const NesWindowDialogFrame(),
);
showSnack(inputData);
},
),
const SizedBox(width: 16),
NesButton(
type: NesButtonType.normal,
child: const Text('Plain with icon'),
onPressed: () {
NesDialog.show<void>(
context: context,
builder: (_) => const Text('Hello World'),
frame: NesWindowDialogFrame(
leftIcon: NesIcons.bell,
),
);
},
),
const SizedBox(width: 16),
NesButton(
type: NesButtonType.normal,
child: const Text('Plain with icon and title'),
onPressed: () {
NesDialog.show<void>(
context: context,
builder: (_) => const Text('Hello World'),
frame: NesWindowDialogFrame(
leftIcon: NesIcons.bell,
title: 'Hello',
),
);
},
),
],
),
],
);
}
Expand Down
2 changes: 2 additions & 0 deletions lib/src/widgets/dialogs/nes_confirm_dialog.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@ class NesConfirmDialog extends StatelessWidget {
String confirmLabel = 'Yes',
String cancelLabel = 'No',
String message = 'Are you sure?',
NesDialogFrame frame = const NesBasicDialogFrame(),
}) {
return NesDialog.show<bool>(
context: context,
Expand All @@ -44,6 +45,7 @@ class NesConfirmDialog extends StatelessWidget {
cancelLabel: cancelLabel,
message: message,
),
frame: frame,
);
}

Expand Down
104 changes: 80 additions & 24 deletions lib/src/widgets/dialogs/nes_dialog.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,39 @@ import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:nes_ui/nes_ui.dart';

/// {@template nes_dialog_frame}
/// A class with information about the styel of a dialog frame.
/// {@endtemplate}
sealed class NesDialogFrame {
const NesDialogFrame();
}

/// {@template nes_basic_dialog_frame}
/// A dialog frame with a basic style.
/// Which is the default style for a dialog.
/// {@endtemplate}
class NesBasicDialogFrame extends NesDialogFrame {
/// {@macro nes_basic_dialog_frame}
const NesBasicDialogFrame();
}

/// {@template nes_window_dialog_frame}
/// A dialog frame with a window style, using [NesWindow].
/// {@endtemplate}
class NesWindowDialogFrame extends NesDialogFrame {
/// {@macro nes_window_dialog_frame}
const NesWindowDialogFrame({
this.leftIcon,
this.title,
});

/// The window leftIcon.
final NesIconData? leftIcon;

/// The window title.
final String? title;
}

class _CloseDialogIntent extends Intent {
const _CloseDialogIntent();
}
Expand All @@ -15,16 +48,21 @@ class NesDialog extends StatelessWidget {
/// {@macro nes_confirm_dialog}
const NesDialog({
required this.child,
this.frame = const NesBasicDialogFrame(),
super.key,
});

/// The dialog child.
final Widget child;

/// The dialog frame, defaults to [NesBasicDialogFrame].
final NesDialogFrame frame;

/// A shortcut method that can be used to show this dialog.
static Future<T?> show<T>({
required BuildContext context,
required WidgetBuilder builder,
NesDialogFrame frame = const NesBasicDialogFrame(),
}) {
final nesTheme = context.nesThemeExtension<NesTheme>();

Expand All @@ -51,6 +89,7 @@ class NesDialog extends StatelessWidget {
},
pageBuilder: (_, __, ___) {
final dialog = NesDialog(
frame: frame,
child: builder(context),
);

Expand Down Expand Up @@ -89,32 +128,49 @@ class NesDialog extends StatelessWidget {
child: IntrinsicWidth(
stepHeight: 0.56,
child: SizedBox.expand(
child: Stack(
clipBehavior: Clip.none,
children: [
NesContainer(
child: Padding(
padding: const EdgeInsets.all(16),
child: Center(
child: child,
child: Builder(
builder: (context) {
return switch (frame) {
NesBasicDialogFrame() => Stack(
clipBehavior: Clip.none,
children: [
NesContainer(
child: Padding(
padding: const EdgeInsets.all(16),
child: Center(
child: child,
),
),
),
Positioned(
right: -8,
top: -8,
child: NesButton(
type: NesButtonType.error,
onPressed: () {
Navigator.of(context).pop();
},
child: NesIcon(
size: const Size(16, 16),
iconData: NesIcons.close,
),
),
),
],
),
),
),
Positioned(
right: -8,
top: -8,
child: NesButton(
type: NesButtonType.error,
onPressed: () {
Navigator.of(context).pop();
},
child: NesIcon(
size: const Size(16, 16),
iconData: NesIcons.close,
NesWindowDialogFrame() => NesWindow(
title: (frame as NesWindowDialogFrame).title ?? '',
icon: (frame as NesWindowDialogFrame).leftIcon,
onClose: () {
Navigator.of(context).pop();
},
child: Padding(
padding: const EdgeInsets.all(8),
child: child,
),
),
),
),
],
};
},
),
),
),
Expand Down
2 changes: 2 additions & 0 deletions lib/src/widgets/dialogs/nes_input_dialog.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ class NesInputDialog extends StatefulWidget {
required String message,
String inputLabel = 'Ok',
String cancelLabel = 'Cancel',
NesDialogFrame frame = const NesBasicDialogFrame(),
}) {
return NesDialog.show<String?>(
context: context,
Expand All @@ -43,6 +44,7 @@ class NesInputDialog extends StatefulWidget {
cancelLabel: cancelLabel,
message: message,
),
frame: frame,
);
}

Expand Down