msb-public
/
pinball
mirror of https://github.com/flutter/pinball.git
1
0
Code Issues Projects Releases Wiki Activity

refactor: improve HowToPlayDialog and reuse existing components (#281)

Browse Source
pull/287/head
Jorge Coca 3 years ago committed by GitHub
parent 3fbb2564cc
commit d748188286
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 43 additions and 110 deletions
Show Stats Download Patch File Download Diff File

1
lib/how_to_play/how_to_play.dart
Unescape View File

@ -0,0 +1 @@
export 'widgets/widgets.dart';

130
lib/start_game/widgets/how_to_play_dialog.dart → lib/how_to_play/widgets/how_to_play_dialog.dart
Unescape View File

@ -8,7 +8,6 @@ import 'package:pinball/l10n/l10n.dart';
import 'package:pinball_ui/pinball_ui.dart';
import 'package:platform_helper/platform_helper.dart';
@visibleForTesting
enum Control {
left,
right,
@ -51,18 +50,10 @@ extension on Control {
}
Future<void> showHowToPlayDialog(BuildContext context) {
final height = MediaQuery.of(context).size.height * 0.5;
return showDialog<void>(
context: context,
builder: (context) {
return Center(
child: SizedBox(
height: height,
width: height * 1.4,
child: HowToPlayDialog(),
),
);
},
barrierDismissible: false,
builder: (_) => HowToPlayDialog(),
);
}
@ -100,9 +91,11 @@ class _HowToPlayDialogState extends State<HowToPlayDialog> {
@override
Widget build(BuildContext context) {
final isMobile = widget.platformHelper.isMobile;
return PixelatedDecoration(
header: const _HowToPlayHeader(),
body: isMobile ? const _MobileBody() : const _DesktopBody(),
final l10n = context.l10n;
return PinballDialog(
title: l10n.howToPlay,
subtitle: l10n.tipsForFlips,
child: isMobile ? const _MobileBody() : const _DesktopBody(),
);
}
}
@ -137,26 +130,20 @@ class _MobileLaunchControls extends StatelessWidget {
@override
Widget build(BuildContext context) {
final l10n = context.l10n;
final textStyle = Theme.of(context)
final headline3 = Theme.of(context)
.textTheme
.headline3!
.copyWith(color: PinballColors.white);
return Column(
children: [
Text(
l10n.tapAndHoldRocket,
style: textStyle,
),
Text(l10n.tapAndHoldRocket, style: headline3),
Text.rich(
TextSpan(
children: [
TextSpan(
text: '${l10n.to} ',
style: textStyle,
),
TextSpan(text: '${l10n.to} ', style: headline3),
TextSpan(
text: l10n.launch,
style: textStyle.copyWith(color: PinballColors.blue),
style: headline3.copyWith(color: PinballColors.blue),
),
],
),
@ -172,26 +159,20 @@ class _MobileFlipperControls extends StatelessWidget {
@override
Widget build(BuildContext context) {
final l10n = context.l10n;
final textStyle = Theme.of(context)
final headline3 = Theme.of(context)
.textTheme
.headline3!
.copyWith(color: PinballColors.white);
return Column(
children: [
Text(
l10n.tapLeftRightScreen,
style: textStyle,
),
Text(l10n.tapLeftRightScreen, style: headline3),
Text.rich(
TextSpan(
children: [
TextSpan(
text: '${l10n.to} ',
style: textStyle,
),
TextSpan(text: '${l10n.to} ', style: headline3),
TextSpan(
text: l10n.flip,
style: textStyle.copyWith(color: PinballColors.orange),
style: headline3.copyWith(color: PinballColors.orange),
),
],
),
@ -206,55 +187,23 @@ class _DesktopBody extends StatelessWidget {
@override
Widget build(BuildContext context) {
const spacing = SizedBox(height: 16);
return ListView(
children: const [
spacing,
SizedBox(height: 16),
_DesktopLaunchControls(),
spacing,
SizedBox(height: 16),
_DesktopFlipperControls(),
],
);
}
}
class _HowToPlayHeader extends StatelessWidget {
const _HowToPlayHeader({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final l10n = context.l10n;
final textStyle = Theme.of(context).textTheme.headline3?.copyWith(
color: PinballColors.darkBlue,
);
return FittedBox(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
l10n.howToPlay,
style: textStyle?.copyWith(
fontWeight: FontWeight.bold,
),
),
Text(
l10n.tipsForFlips,
style: textStyle,
),
],
),
);
}
}
class _DesktopLaunchControls extends StatelessWidget {
const _DesktopLaunchControls({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final l10n = context.l10n;
const spacing = SizedBox(width: 10);
return Column(
children: [
Text(
@ -264,11 +213,11 @@ class _DesktopLaunchControls extends StatelessWidget {
const SizedBox(height: 10),
Wrap(
children: const [
KeyButton(control: Control.down),
spacing,
KeyButton(control: Control.space),
spacing,
KeyButton(control: Control.s),
_KeyButton(control: Control.down),
SizedBox(width: 10),
_KeyButton(control: Control.space),
SizedBox(width: 10),
_KeyButton(control: Control.s),
],
)
],
@ -282,8 +231,6 @@ class _DesktopFlipperControls extends StatelessWidget {
@override
Widget build(BuildContext context) {
final l10n = context.l10n;
const rowSpacing = SizedBox(width: 20);
return Column(
children: [
Text(
@ -297,17 +244,17 @@ class _DesktopFlipperControls extends StatelessWidget {
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: const [
KeyButton(control: Control.left),
rowSpacing,
KeyButton(control: Control.right),
_KeyButton(control: Control.left),
SizedBox(width: 20),
_KeyButton(control: Control.right),
],
),
const SizedBox(height: 8),
Wrap(
children: const [
KeyButton(control: Control.a),
rowSpacing,
KeyButton(control: Control.d),
_KeyButton(control: Control.a),
SizedBox(width: 20),
_KeyButton(control: Control.d),
],
)
],
@ -317,29 +264,24 @@ class _DesktopFlipperControls extends StatelessWidget {
}
}
@visibleForTesting
class KeyButton extends StatelessWidget {
const KeyButton({
Key? key,
required Control control,
}) : _control = control,
super(key: key);
class _KeyButton extends StatelessWidget {
const _KeyButton({Key? key, required this.control}) : super(key: key);
final Control _control;
final Control control;
@override
Widget build(BuildContext context) {
final textTheme = Theme.of(context).textTheme;
final textStyle =
_control.isArrow ? textTheme.headline1 : textTheme.headline3;
control.isArrow ? textTheme.headline1 : textTheme.headline3;
const height = 60.0;
final width = _control.isSpace ? height * 2.83 : height;
final width = control.isSpace ? height * 2.83 : height;
return DecoratedBox(
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
image: AssetImage(
_control.isSpace
control.isSpace
? Assets.images.components.space.keyName
: Assets.images.components.key.keyName,
),
@ -350,9 +292,9 @@ class KeyButton extends StatelessWidget {
height: height,
child: Center(
child: RotatedBox(
quarterTurns: _control.isDown ? 1 : 0,
quarterTurns: control.isDown ? 1 : 0,
child: Text(
_control.getCharacter(context),
control.getCharacter(context),
style: textStyle?.copyWith(color: PinballColors.white),
),
),

0
lib/start_game/widgets/widgets.dart → lib/how_to_play/widgets/widgets.dart
Unescape View File

2
lib/select_character/view/character_selection_page.dart
Unescape View File

@ -1,9 +1,9 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:pinball/how_to_play/how_to_play.dart';
import 'package:pinball/l10n/l10n.dart';
import 'package:pinball/select_character/cubit/character_theme_cubit.dart';
import 'package:pinball/select_character/select_character.dart';
import 'package:pinball/start_game/start_game.dart';
import 'package:pinball_theme/pinball_theme.dart';
import 'package:pinball_ui/pinball_ui.dart';

1
lib/start_game/start_game.dart
Unescape View File

@ -1,2 +1 @@
export 'bloc/start_game_bloc.dart';
export 'widgets/widgets.dart';

17
test/start_game/widgets/how_to_play_dialog_test.dart → test/how_to_play/how_to_play_dialog_test.dart
Unescape View File

@ -1,13 +1,11 @@
// ignore_for_file: prefer_const_constructors
import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:mocktail/mocktail.dart';
import 'package:pinball/how_to_play/how_to_play.dart';
import 'package:pinball/l10n/l10n.dart';
import 'package:pinball/start_game/start_game.dart';
import 'package:platform_helper/platform_helper.dart';
import '../../helpers/helpers.dart';
import '../helpers/helpers.dart';
class MockPlatformHelper extends Mock implements PlatformHelper {}
@ -17,7 +15,7 @@ void main() {
late PlatformHelper platformHelper;
setUp(() async {
l10n = await AppLocalizations.delegate.load(Locale('en'));
l10n = await AppLocalizations.delegate.load(const Locale('en'));
platformHelper = MockPlatformHelper();
});
@ -40,7 +38,7 @@ void main() {
expect(find.text(l10n.tipsForFlips), findsOneWidget);
expect(find.text(l10n.launchControls), findsOneWidget);
expect(find.text(l10n.flipperControls), findsOneWidget);
expect(find.byType(KeyButton), findsNWidgets(7));
expect(find.byType(RotatedBox), findsNWidgets(7)); // controls
});
testWidgets('displays content for mobile', (tester) async {
@ -76,11 +74,4 @@ void main() {
expect(find.byType(HowToPlayDialog), findsNothing);
});
});
group('KeyButton', () {
testWidgets('renders correctly', (tester) async {
await tester.pumpApp(KeyButton(control: Control.a));
expect(find.text('A'), findsOneWidget);
});
});
}

2
test/select_character/view/character_selection_page_test.dart
Unescape View File

@ -2,8 +2,8 @@ import 'package:bloc_test/bloc_test.dart';
import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:mocktail/mocktail.dart';
import 'package:pinball/how_to_play/how_to_play.dart';
import 'package:pinball/select_character/select_character.dart';
import 'package:pinball/start_game/start_game.dart';
import 'package:pinball_theme/pinball_theme.dart';
import 'package:pinball_ui/pinball_ui.dart';

Write Preview
Loading…
Cancel
Save