Skip to content
This repository has been archived by the owner on Jan 9, 2024. It is now read-only.

Commit

Permalink
feat: initial screen (#9)
Browse files Browse the repository at this point in the history
RuiMiguel authored Nov 22, 2023
1 parent 36e3582 commit a472528
Showing 31 changed files with 835 additions and 82 deletions.
4 changes: 2 additions & 2 deletions lib/app/view/app.dart
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import 'package:api_client/api_client.dart';
import 'package:dash_ai_search/counter/counter.dart';
import 'package:dash_ai_search/home/home.dart';
import 'package:dash_ai_search/l10n/l10n.dart';
import 'package:flutter/material.dart';

@@ -22,7 +22,7 @@ class App extends StatelessWidget {
),
localizationsDelegates: AppLocalizations.localizationsDelegates,
supportedLocales: AppLocalizations.supportedLocales,
home: const CounterPage(),
home: const HomePage(),
);
}
}
1 change: 0 additions & 1 deletion lib/counter/counter.dart

This file was deleted.

53 changes: 0 additions & 53 deletions lib/counter/view/counter_page.dart

This file was deleted.

2 changes: 2 additions & 0 deletions lib/home/home.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
export 'view/home_page.dart';
export 'widgets/widgets.dart';
61 changes: 61 additions & 0 deletions lib/home/view/home_page.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
import 'package:app_ui/app_ui.dart';
import 'package:dash_ai_search/home/home.dart';
import 'package:flutter/material.dart';

class HomePage extends StatelessWidget {
const HomePage({super.key});

@override
Widget build(BuildContext context) {
return const Scaffold(
backgroundColor: Color(0xFFF8FAFF),
body: Stack(
children: [
Positioned(
top: 0,
bottom: 0,
child: Background(),
),
Positioned(
top: 40,
left: 48,
child: Logo(),
),
WelcomeView(),
Positioned(
bottom: 50,
left: 50,
child: DashAnimation(),
),
],
),
);
}
}

class DashAnimation extends StatelessWidget {
@visibleForTesting
const DashAnimation({super.key});

static const dashSize = Size(800, 800);

@override
Widget build(BuildContext context) {
final screenSize = MediaQuery.sizeOf(context);

return Container(
alignment: Alignment.center,
height: screenSize.height / 3,
width: screenSize.height / 3,
child: const AnimatedSprite(
showLoadingIndicator: false,
sprites: Sprites(
asset: 'dash_animation.png',
size: dashSize,
frames: 34,
stepTime: 0.07,
),
),
);
}
}
141 changes: 141 additions & 0 deletions lib/home/widgets/background.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,141 @@
import 'package:flutter/material.dart';
import 'package:path_drawing/path_drawing.dart';

class Background extends StatelessWidget {
const Background({super.key});

@override
Widget build(BuildContext context) {
const leftOffset = -50.0;
const baseRadius = 303.0;
const baseMediumRadius = 255.0;
const baseSmallRadius = 185.0;
const horizontalOffset = baseRadius * 2;

return const SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
children: [
Circle(
offset: Offset(leftOffset, 0),
),
Circle(
offset: Offset(horizontalOffset + leftOffset, 0),
child: Circle(
offset: Offset(horizontalOffset + leftOffset, 0),
radius: baseMediumRadius,
borderColor: Color(0xFFDDE2F6),
child: Circle(
offset: Offset(horizontalOffset + leftOffset, 0),
radius: baseSmallRadius,
borderColor: Color(0xFFDDE2F6),
dotted: true,
),
),
),
Circle(
offset: Offset(horizontalOffset * 2 + leftOffset, 0),
),
Circle(
offset: Offset(horizontalOffset * 3 + leftOffset, 0),
),
],
),
);
}
}

class Circle extends StatelessWidget {
@visibleForTesting
const Circle({
this.offset = Offset.zero,
this.radius = 303,
this.borderColor = Colors.white,
this.dotted = false,
this.child,
super.key,
});

final Offset offset;
final double radius;
final Color borderColor;
final bool dotted;
final Widget? child;

@override
Widget build(BuildContext context) {
return CustomPaint(
painter: CirclePainter(
offset: offset,
radius: radius,
borderColor: borderColor,
dotted: dotted,
),
child: child,
);
}
}

class CirclePainter extends CustomPainter {
CirclePainter({
required this.offset,
required this.radius,
required this.borderColor,
required this.dotted,
}) {
_paintCircle = Paint()
..color = Colors.white
..style = PaintingStyle.fill;
_paintBorder = Paint()
..color = borderColor
..strokeWidth = 2
..strokeCap = StrokeCap.butt
..style = PaintingStyle.stroke;
}

final Offset offset;
final double radius;
final Color borderColor;
final bool dotted;

late final Paint _paintCircle;
late final Paint _paintBorder;

@override
void paint(Canvas canvas, Size size) {
canvas.drawCircle(
offset,
radius,
_paintCircle,
);

if (dotted) {
const dashPattern = <double>[4, 4];
final s = radius * 2;

var path = Path()
..addRRect(
RRect.fromRectAndRadius(
Rect.fromLTWH(
offset.dx - s / 2,
offset.dy / 2 - s / 2,
s,
s,
),
Radius.circular(s / 2),
),
);
path = dashPath(path, dashArray: CircularIntervalList(dashPattern));
canvas.drawPath(path, _paintBorder);
} else {
canvas.drawCircle(
offset,
radius,
_paintBorder,
);
}
}

@override
bool shouldRepaint(CustomPainter oldDelegate) => false;
}
36 changes: 36 additions & 0 deletions lib/home/widgets/logo.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
import 'package:app_ui/app_ui.dart';
import 'package:dash_ai_search/l10n/l10n.dart';
import 'package:flutter/material.dart';

class Logo extends StatelessWidget {
const Logo({super.key});

@override
Widget build(BuildContext context) {
final l10n = context.l10n;

return Row(
children: [
Text(
l10n.vertexAI,
style: const TextStyle(
fontSize: 18,
fontWeight: FontWeight.w400,
color: Colors.black,
),
),
const SizedBox(width: 4),
vertexIcons.asterisk.image(),
const SizedBox(width: 4),
Text(
l10n.flutter,
style: const TextStyle(
fontSize: 18,
fontWeight: FontWeight.w400,
color: Colors.black,
),
),
],
);
}
}
36 changes: 36 additions & 0 deletions lib/home/widgets/welcome_view.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
import 'package:app_ui/app_ui.dart';
import 'package:dash_ai_search/l10n/l10n.dart';
import 'package:flutter/material.dart';

class WelcomeView extends StatelessWidget {
const WelcomeView({super.key});

@override
Widget build(BuildContext context) {
final l10n = context.l10n;

return Center(
child: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
l10n.initialScreenTitle,
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 72,
fontWeight: FontWeight.w700,
color: Color(0xFF020F30),
),
),
const SizedBox(height: 40),
CTAButton(
icon: vertexIcons.arrowForward.image(),
label: l10n.startAsking,
),
],
),
),
);
}
}
3 changes: 3 additions & 0 deletions lib/home/widgets/widgets.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
export 'background.dart';
export 'logo.dart';
export 'welcome_view.dart';
18 changes: 15 additions & 3 deletions lib/l10n/arb/app_en.arb
Original file line number Diff line number Diff line change
@@ -1,7 +1,19 @@
{
"@@locale": "en",
"counterAppBarTitle": "Counter",
"@counterAppBarTitle": {
"description": "Text shown in the AppBar of the Counter Page"
"vertexAI": "Vertex AI",
"@vertexAI": {
"description": "Vertex AI text on logo"
},
"flutter": "Flutter",
"@flutter": {
"description": "Flutter text on logo"
},
"initialScreenTitle": "Ask a question, get \nthe right answer, with \nGoogle Vertex AI",
"@initialScreenTitle": {
"description": "Title shown on Initial screen"
},
"startAsking": "Start asking",
"@startAsking": {
"description": "Button text for start asking"
}
}
7 changes: 0 additions & 7 deletions lib/l10n/arb/app_es.arb

This file was deleted.

Binary file added packages/app_ui/assets/icons/arrow_forward.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added packages/app_ui/assets/icons/asterisk.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
5 changes: 5 additions & 0 deletions packages/app_ui/lib/app_ui.dart
Original file line number Diff line number Diff line change
@@ -1 +1,6 @@
import 'package:app_ui/src/generated/assets.gen.dart';

export 'src/widgets/widgets.dart';

/// Global reference to actual app_ui icons.
const vertexIcons = Assets.icons;
Loading

0 comments on commit a472528

Please sign in to comment.