Skip to content

Commit

Permalink
Feat/add transaction component (#12)
Browse files Browse the repository at this point in the history
  • Loading branch information
@Ahnitam
Ahnitam authored Oct 13, 2022
1 parent fe430c5 commit a9756c3
Show file tree
Hide file tree
Showing 5 changed files with 239 additions and 2 deletions.
64 changes: 64 additions & 0 deletions lib/components/button_option_badge.dart
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
import 'package:app_flutter/configs/themes.dart';
import 'package:badges/badges.dart';
import 'package:flutter/material.dart';

class ButtonOptionBadge extends StatelessWidget {
final IconData iconData;
final String text;
final int badgeCount;
final Function()? onPressed;

const ButtonOptionBadge({
super.key,
required this.iconData,
required this.text,
this.badgeCount = 0,
this.onPressed,
});

@override
Widget build(BuildContext context) {
return InkWell(
onTap: onPressed,
highlightColor: Colors.transparent,
borderRadius: BorderRadius.circular(20),
child: Ink(
width: 90,
height: 90,
padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 10),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(
child: Badge(
showBadge: badgeCount > 0,
badgeColor: red,
badgeContent: Text(
badgeCount < 10 ? "0$badgeCount" : "$badgeCount",
style: const TextStyle(
color: Colors.white,
fontSize: 10,
fontWeight: FontWeight.w800,
),
),
child: Icon(iconData, size: 35),
),
),
const SizedBox(height: 4),
Text(
text,
maxLines: 2,
textAlign: TextAlign.center,
style: const TextStyle(
color: grey,
fontWeight: FontWeight.w800,
fontSize: 10,
),
),
],
),
),
);
}
}
137 changes: 137 additions & 0 deletions lib/components/transaction_painel.dart
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,137 @@
import 'package:app_flutter/components/button_option_badge.dart';
import 'package:app_flutter/configs/themes.dart';
import 'package:flutter/material.dart';

class TransactionPainel extends StatelessWidget {
const TransactionPainel({
super.key,
this.radius = 20,
required this.icon,
required this.title,
});

final double radius;
final IconData icon;
final String title;
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 10),
child: Ink(
width: double.infinity,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(radius),
boxShadow: const [
BoxShadow(
color: Color.fromRGBO(0, 0, 0, 0.05),
blurRadius: 20,
),
],
),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Ink(
decoration: BoxDecoration(
color: lightGrey,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(radius),
topRight: Radius.circular(radius),
),
),
child: Padding(
padding: const EdgeInsets.only(
left: 20,
top: 10,
bottom: 10,
right: 10,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
Icon(
icon,
color: Colors.black,
size: 32,
),
const SizedBox(width: 10),
Text(
title,
style: const TextStyle(
color: Colors.black,
fontSize: 20,
fontFamily: "Avenir",
fontWeight: FontWeight.w800,
),
),
],
),
InkWell(
borderRadius: BorderRadius.circular(20),
onTap: () {},
child: Padding(
padding: const EdgeInsets.symmetric(
vertical: 10,
horizontal: 10,
),
child: Row(
children: const [
Text(
'Mostrar Tudo',
style: TextStyle(
color: grey,
fontSize: 14,
fontFamily: "Avenir",
fontWeight: FontWeight.w800,
),
),
SizedBox(width: 10),
Icon(
Icons.arrow_forward_ios_rounded,
color: grey,
size: 18,
),
],
),
),
),
],
),
),
),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 20),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ButtonOptionBadge(
iconData: Icons.book_rounded,
text: 'Pedidos Recebidos',
onPressed: () {},
badgeCount: 10,
),
ButtonOptionBadge(
iconData: Icons.book_rounded,
text: 'Pedidos Feitos',
onPressed: () {},
badgeCount: 9,
),
ButtonOptionBadge(
iconData: Icons.book_rounded,
text: 'Andamento',
onPressed: () {},
),
],
),
),
],
),
),
);
}
}
7 changes: 7 additions & 0 deletions pubspec.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,13 @@ packages:
url: "https://pub.dartlang.org"
source: hosted
version: "2.9.0"
badges:
dependency: "direct main"
description:
name: badges
url: "https://pub.dartlang.org"
source: hosted
version: "2.0.3"
boolean_selector:
dependency: transitive
description:
Expand Down
1 change: 1 addition & 0 deletions pubspec.yaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,7 @@ dependencies:
cloud_firestore: ^3.4.8
firebase_storage: ^10.3.8
page_transition: ^2.0.9
badges: ^2.0.3

dev_dependencies:
flutter_test:
Expand Down
32 changes: 30 additions & 2 deletions storybook/main.dart
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,11 @@
import 'package:app_flutter/components/bottom_menu.dart';
import 'package:app_flutter/components/button_action.dart';
import 'package:app_flutter/components/button_option.dart';
import 'package:app_flutter/components/button_option_badge.dart';
import 'package:app_flutter/components/cards/book_card.dart';
import 'package:app_flutter/components/cards/genrer_card.dart';
import 'package:app_flutter/components/header.dart';
import 'package:app_flutter/components/transaction_painel.dart';
import 'package:app_flutter/configs/themes.dart';
import 'package:app_flutter/pages/home_page.dart';
import 'package:app_flutter/pages/login_page.dart';
Expand Down Expand Up @@ -121,8 +123,34 @@ class _StorybookAppState extends State<StorybookApp> {
builder: (context) => const FilterOptionStories(),
),
Story(
name: 'Components/ProfileInfo',
builder: (context) => const ProfileInfoStories()),
name: 'Components/ProfileInfo',
builder: (context) => const ProfileInfoStories(),
),
Story(
name: 'Components/TansactionPainel',
builder: (context) => const Scaffold(
backgroundColor: lightGrey,
body: Center(
child: TransactionPainel(
icon: Icons.swap_horizontal_circle_rounded,
title: 'Trocas',
),
),
),
),
Story(
name: 'Components/ButtonOptionBadge',
builder: (context) => Scaffold(
backgroundColor: lightGrey,
body: Center(
child: ButtonOptionBadge(
onPressed: () {},
iconData: Icons.book_rounded,
text: 'Pedidos Recebidos',
),
),
),
),
],
);
}

0 comments on commit a9756c3

Please sign in to comment.