mirror of https://github.com/flutter/pinball.git
parent
1081b46ae5
commit
96298d6017
@ -1,18 +0,0 @@
|
||||
name: app_ui
|
||||
|
||||
on:
|
||||
push:
|
||||
paths:
|
||||
- "packages/app_ui/**"
|
||||
- ".github/workflows/app_ui.yaml"
|
||||
|
||||
pull_request:
|
||||
paths:
|
||||
- "packages/app_ui/**"
|
||||
- ".github/workflows/app_ui.yaml"
|
||||
|
||||
jobs:
|
||||
build:
|
||||
uses: VeryGoodOpenSource/very_good_workflows/.github/workflows/flutter_package.yml@v1
|
||||
with:
|
||||
working_directory: packages/app_ui
|
@ -0,0 +1,18 @@
|
||||
name: pinball_ui
|
||||
|
||||
on:
|
||||
push:
|
||||
paths:
|
||||
- "packages/pinball_ui/**"
|
||||
- ".github/workflows/pinball_ui.yaml"
|
||||
|
||||
pull_request:
|
||||
paths:
|
||||
- "packages/pinball_ui/**"
|
||||
- ".github/workflows/pinball_ui.yaml"
|
||||
|
||||
jobs:
|
||||
build:
|
||||
uses: VeryGoodOpenSource/very_good_workflows/.github/workflows/flutter_package.yml@v1
|
||||
with:
|
||||
working_directory: packages/pinball_ui
|
@ -1 +0,0 @@
|
||||
export 'dialog_decoration.dart';
|
@ -1,73 +0,0 @@
|
||||
import 'package:app_ui/gen/gen.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// {@template dialog_background}
|
||||
/// A dialog decoration with pixel looking background.
|
||||
///
|
||||
/// Requires the header [Widget] and body [Widget], which are displayed on the
|
||||
/// decoration.
|
||||
/// {@endtemplate}
|
||||
class DialogDecoration extends StatelessWidget {
|
||||
/// {@macro dialog_background}
|
||||
const DialogDecoration({
|
||||
Key? key,
|
||||
required Widget header,
|
||||
required Widget body,
|
||||
}) : _header = header,
|
||||
_body = body,
|
||||
super(key: key);
|
||||
|
||||
final Widget _header;
|
||||
final Widget _body;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
const radius = BorderRadius.all(Radius.circular(12));
|
||||
const boardWidth = 5.0;
|
||||
|
||||
return LayoutBuilder(
|
||||
builder: (context, constraints) {
|
||||
final gameWidgetWidth = constraints.maxHeight * 9 / 16;
|
||||
|
||||
return Center(
|
||||
child: SizedBox(
|
||||
height: gameWidgetWidth,
|
||||
width: gameWidgetWidth,
|
||||
child: DecoratedBox(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: radius,
|
||||
border: Border.all(
|
||||
color: Colors.white,
|
||||
width: boardWidth,
|
||||
),
|
||||
image: DecorationImage(
|
||||
fit: BoxFit.cover,
|
||||
image: AssetImage(
|
||||
Assets.images.dialog.background.keyName,
|
||||
),
|
||||
),
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(boardWidth - 1),
|
||||
child: ClipRRect(
|
||||
borderRadius: radius,
|
||||
child: Column(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Center(child: _header),
|
||||
),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: _body,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
@ -1,3 +1,3 @@
|
||||
library app_ui;
|
||||
library pinball_ui;
|
||||
|
||||
export 'src/dialog/dialog.dart';
|
@ -0,0 +1 @@
|
||||
export 'pinball_dialog_layout.dart';
|
@ -0,0 +1,94 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:pinball_ui/gen/gen.dart';
|
||||
|
||||
/// {@template pinball_dialog_layout}
|
||||
/// A dialog decoration with pixel looking background.
|
||||
///
|
||||
/// Requires the header [Widget] and body [Widget], which are displayed on the
|
||||
/// decoration.
|
||||
/// {@endtemplate}
|
||||
class PinballDialogLayout extends StatelessWidget {
|
||||
/// {@macro pinball_dialog_layout}
|
||||
const PinballDialogLayout({
|
||||
Key? key,
|
||||
required Widget header,
|
||||
required Widget body,
|
||||
}) : _header = header,
|
||||
_body = body,
|
||||
super(key: key);
|
||||
|
||||
final Widget _header;
|
||||
final Widget _body;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return LayoutBuilder(
|
||||
builder: (context, constraints) {
|
||||
final gameWidgetWidth = constraints.maxHeight * 9 / 16;
|
||||
|
||||
return Center(
|
||||
child: SizedBox(
|
||||
height: gameWidgetWidth,
|
||||
width: gameWidgetWidth,
|
||||
child: _DialogDecoration(
|
||||
header: _header,
|
||||
body: _body,
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _DialogDecoration extends StatelessWidget {
|
||||
const _DialogDecoration({
|
||||
Key? key,
|
||||
required Widget header,
|
||||
required Widget body,
|
||||
}) : _header = header,
|
||||
_body = body,
|
||||
super(key: key);
|
||||
|
||||
final Widget _header;
|
||||
final Widget _body;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
const radius = BorderRadius.all(Radius.circular(12));
|
||||
const boardWidth = 5.0;
|
||||
|
||||
return DecoratedBox(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: radius,
|
||||
border: Border.all(
|
||||
color: Colors.white,
|
||||
width: boardWidth,
|
||||
),
|
||||
image: DecorationImage(
|
||||
fit: BoxFit.cover,
|
||||
image: AssetImage(
|
||||
Assets.images.dialog.background.keyName,
|
||||
),
|
||||
),
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(boardWidth - 1),
|
||||
child: ClipRRect(
|
||||
borderRadius: radius,
|
||||
child: Column(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Center(child: _header),
|
||||
),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: _body,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
@ -1,4 +1,4 @@
|
||||
name: app_ui
|
||||
name: pinball_ui
|
||||
description: App UI Component Library
|
||||
version: 1.0.0+1
|
||||
publish_to: none
|
@ -1,18 +1,18 @@
|
||||
// ignore_for_file: prefer_const_constructors
|
||||
|
||||
import 'package:app_ui/app_ui.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_test/flutter_test.dart';
|
||||
import 'package:pinball_ui/pinball_ui.dart';
|
||||
|
||||
void main() {
|
||||
group('DialogDecoration', () {
|
||||
group('PinballDialogLayout', () {
|
||||
testWidgets('renders header and body', (tester) async {
|
||||
const headerText = 'header';
|
||||
const bodyText = 'body';
|
||||
|
||||
await tester.pumpWidget(
|
||||
MaterialApp(
|
||||
home: DialogDecoration(
|
||||
home: PinballDialogLayout(
|
||||
header: Text(headerText),
|
||||
body: Text(bodyText),
|
||||
),
|
Loading…
Reference in new issue