pix_bb 3.0.1
pix_bb: ^3.0.1 copied to clipboard
Interface versátil e robusta para integração com a API de Pix do Banco do Brasil em apps Flutter e Dart.
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:intl/intl.dart';
import 'package:pix_bb/pix_bb.dart';
import 'credentials.dart';
void main() {
runApp(const PixBBExample());
}
class PixBBExample extends StatelessWidget {
const PixBBExample({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Pix BB Premium',
debugShowCheckedModeBanner: false,
theme: ThemeData(
useMaterial3: true,
colorScheme: ColorScheme.fromSeed(
seedColor: const Color(0xFF0038A8), // Azul BB
primary: const Color(0xFF0038A8),
secondary: const Color(0xFFFCED00), // Amarelo BB
surface: Colors.white,
surfaceContainer: const Color(0xFFF5F7FA),
),
textTheme: GoogleFonts.outfitTextTheme(),
cardTheme: CardThemeData(
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
side: BorderSide(color: Colors.grey.shade200),
),
color: Colors.white,
),
inputDecorationTheme: InputDecorationTheme(
filled: true,
fillColor: Colors.grey.shade50,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(16),
borderSide: BorderSide.none,
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(16),
borderSide: BorderSide.none,
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(16),
borderSide: const BorderSide(color: Color(0xFF0038A8), width: 2),
),
),
),
home: const ConfigScreen(),
);
}
}
class ConfigScreen extends StatefulWidget {
const ConfigScreen({super.key});
@override
State<ConfigScreen> createState() => _ConfigScreenState();
}
class _ConfigScreenState extends State<ConfigScreen> {
final _basicKeyController = TextEditingController(text: Credentials.BASIC_KEY);
final _devAppKeyController =
TextEditingController(text: Credentials.DEVELOPER_APPLICATION_KEY);
Ambiente _ambiente = Ambiente.homologacao;
bool get _isValid =>
_basicKeyController.text.isNotEmpty &&
_devAppKeyController.text.isNotEmpty;
void _proceed() {
if (!_isValid) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Por favor, preencha todos os campos')),
);
return;
}
final pixBB = PixBB(
ambiente: _ambiente,
basicKey: _basicKeyController.text.trim(),
developerApplicationKey: _devAppKeyController.text.trim(),
);
Navigator.push(
context,
MaterialPageRoute(builder: (context) => DashboardScreen(pixBB: pixBB)),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
Theme.of(context).colorScheme.primary,
Theme.of(context).colorScheme.primary.withValues(alpha: 0.8),
],
),
),
child: SafeArea(
child: Center(
child: SingleChildScrollView(
padding: const EdgeInsets.all(24.0),
child: Card(
elevation: 12,
shadowColor: Colors.black26,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(32),
),
child: Padding(
padding: const EdgeInsets.all(32.0),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Theme.of(
context,
).colorScheme.primary.withValues(alpha: 0.1),
shape: BoxShape.circle,
),
child: Icon(
Icons.account_balance_wallet_rounded,
size: 48,
color: Theme.of(context).colorScheme.primary,
),
),
const SizedBox(height: 24),
Text(
'Configuração Pix BB',
style: Theme.of(
context,
).textTheme.headlineSmall?.copyWith(
fontWeight: FontWeight.bold,
color: Theme.of(context).colorScheme.primary,
),
),
const SizedBox(height: 8),
Text(
'Insira suas credenciais para começar',
textAlign: TextAlign.center,
style: Theme.of(context).textTheme.bodyMedium?.copyWith(
color: Colors.grey.shade600,
),
),
const SizedBox(height: 32),
TextField(
controller: _basicKeyController,
decoration: const InputDecoration(
labelText: 'Basic Key',
prefixIcon: Icon(Icons.key_rounded),
),
),
const SizedBox(height: 16),
TextField(
controller: _devAppKeyController,
decoration: const InputDecoration(
labelText: 'Developer App Key',
prefixIcon: Icon(Icons.apps_rounded),
),
),
const SizedBox(height: 24),
Row(
children: [
Expanded(
child: _AmbienteButton(
label: 'Homologação',
isSelected: _ambiente == Ambiente.homologacao,
onTap:
() => setState(
() => _ambiente = Ambiente.homologacao,
),
),
),
const SizedBox(width: 12),
Expanded(
child: _AmbienteButton(
label: 'Produção',
isSelected: _ambiente == Ambiente.producao,
onTap:
() => setState(
() => _ambiente = Ambiente.producao,
),
),
),
],
),
const SizedBox(height: 32),
SizedBox(
width: double.infinity,
height: 56,
child: ElevatedButton(
onPressed: _proceed,
style: ElevatedButton.styleFrom(
backgroundColor:
Theme.of(context).colorScheme.primary,
foregroundColor: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
),
elevation: 0,
),
child: const Text(
'Acessar Dashboard',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
),
),
],
),
),
),
),
),
),
),
);
}
}
class _AmbienteButton extends StatelessWidget {
final String label;
final bool isSelected;
final VoidCallback onTap;
const _AmbienteButton({
required this.label,
required this.isSelected,
required this.onTap,
});
@override
Widget build(BuildContext context) {
return InkWell(
onTap: onTap,
borderRadius: BorderRadius.circular(12),
child: AnimatedContainer(
duration: const Duration(milliseconds: 200),
padding: const EdgeInsets.symmetric(vertical: 12),
decoration: BoxDecoration(
color:
isSelected
? Theme.of(context).colorScheme.primary
: Colors.grey.shade100,
borderRadius: BorderRadius.circular(12),
border: Border.all(
color:
isSelected
? Theme.of(context).colorScheme.primary
: Colors.grey.shade300,
),
),
child: Center(
child: Text(
label,
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.bold,
color: isSelected ? Colors.white : Colors.grey.shade700,
),
),
),
),
);
}
}
class DashboardScreen extends StatefulWidget {
final PixBB pixBB;
const DashboardScreen({super.key, required this.pixBB});
@override
State<DashboardScreen> createState() => _DashboardScreenState();
}
class _DashboardScreenState extends State<DashboardScreen> {
List<Pix> _transactions = [];
bool _isLoading = false;
String? _error;
Token? _token;
@override
void initState() {
super.initState();
_refresh();
}
Future<void> _refresh() async {
setState(() {
_isLoading = true;
_error = null;
});
try {
final token = await widget.pixBB.getToken();
final transactions = await widget.pixBB.fetchTransactions(
token: token,
dateTimeRange: DateTimeRange(
start: DateTime.now().subtract(const Duration(days: 4)),
end: DateTime.now(),
),
);
setState(() {
_token = token;
_transactions = transactions;
_isLoading = false;
});
} catch (e) {
setState(() {
_error = e.toString();
_isLoading = false;
});
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFFF5F7FA),
appBar: AppBar(
title: const Text(
'Dashboard Pix BB',
style: TextStyle(fontWeight: FontWeight.bold),
),
backgroundColor: Colors.transparent,
elevation: 0,
actions: [
IconButton(
onPressed: _refresh,
icon: const Icon(Icons.refresh_rounded),
),
],
),
body:
_isLoading
? const Center(child: CircularProgressIndicator())
: _error != null
? Center(
child: Padding(
padding: const EdgeInsets.all(32.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(
Icons.error_outline_rounded,
size: 64,
color: Colors.red,
),
const SizedBox(height: 16),
Text(
'Ops! Algo deu errado',
style: Theme.of(context).textTheme.titleLarge?.copyWith(
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 8),
Text(
_error!,
textAlign: TextAlign.center,
style: const TextStyle(color: Colors.grey),
),
const SizedBox(height: 24),
ElevatedButton(
onPressed: _refresh,
child: const Text('Tentar Novamente'),
),
],
),
),
)
: CustomScrollView(
slivers: [
SliverToBoxAdapter(
child: Padding(
padding: const EdgeInsets.all(24.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildInfoCard(),
const SizedBox(height: 32),
Text(
'Últimas Transações',
style: Theme.of(context).textTheme.titleLarge
?.copyWith(fontWeight: FontWeight.bold),
),
],
),
),
),
_transactions.isEmpty
? SliverFillRemaining(
hasScrollBody: false,
child: Center(
child: Text(
'Nenhuma transação encontrada nos últimos 4 dias',
style: TextStyle(color: Colors.grey.shade600),
),
),
)
: SliverPadding(
padding: const EdgeInsets.symmetric(horizontal: 24),
sliver: SliverList(
delegate: SliverChildBuilderDelegate((
context,
index,
) {
final transaction = _transactions[index];
return _TransactionCard(transaction: transaction);
}, childCount: _transactions.length),
),
),
const SliverToBoxAdapter(child: SizedBox(height: 24)),
],
),
);
}
Widget _buildInfoCard() {
return Card(
color: Theme.of(context).colorScheme.primary,
child: Padding(
padding: const EdgeInsets.all(24.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Row(
children: [
Icon(Icons.shield_rounded, color: Colors.white70, size: 20),
SizedBox(width: 8),
Text(
'Status da Conexão',
style: TextStyle(
color: Colors.white70,
fontWeight: FontWeight.w500,
),
),
],
),
const SizedBox(height: 16),
Text(
'Token Ativo',
style: Theme.of(context).textTheme.titleLarge?.copyWith(
color: Colors.white,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 4),
Text(
_token?.scope ?? 'Sem escopo definido',
style: const TextStyle(color: Colors.white60, fontSize: 12),
),
const SizedBox(height: 24),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
_buildMiniBadge(
'Transações: ${_transactions.length}',
Colors.white24,
),
_buildMiniBadge(
'Expira em: ${_token?.expiresIn ?? 0}s',
Colors.white24,
),
],
),
],
),
),
);
}
Widget _buildMiniBadge(String text, Color color) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration(
color: color,
borderRadius: BorderRadius.circular(30),
),
child: Text(
text,
style: const TextStyle(
color: Colors.white,
fontSize: 10,
fontWeight: FontWeight.bold,
),
),
);
}
}
class _TransactionCard extends StatelessWidget {
final Pix transaction;
const _TransactionCard({required this.transaction});
@override
Widget build(BuildContext context) {
final curFormat = NumberFormat.simpleCurrency(locale: 'pt_BR');
final dateFormat = DateFormat('dd/MM HH:mm');
final double valor = double.tryParse(transaction.valor) ?? 0.0;
final DateTime data =
DateTime.tryParse(transaction.horario) ?? DateTime.now();
return Container(
margin: const EdgeInsets.only(bottom: 12),
child: Card(
child: ListTile(
contentPadding: const EdgeInsets.symmetric(
horizontal: 20,
vertical: 8,
),
leading: Container(
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: Colors.green.shade50,
shape: BoxShape.circle,
),
child: const Icon(
Icons.arrow_downward_rounded,
color: Colors.green,
),
),
title: Text(
transaction.pagador.nome,
style: const TextStyle(fontWeight: FontWeight.bold),
),
subtitle: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
dateFormat.format(data),
style: TextStyle(color: Colors.grey.shade500, fontSize: 12),
),
const SizedBox(height: 4),
Text(
'ID: ${transaction.txid}',
style: TextStyle(color: Colors.grey.shade400, fontSize: 10),
),
],
),
trailing: Text(
curFormat.format(valor),
style: const TextStyle(
fontWeight: FontWeight.w900,
fontSize: 16,
color: Color(0xFF2E3A59),
),
),
onTap: () => _showDetails(context),
),
),
);
}
void _showDetails(BuildContext context) {
showModalBottomSheet(
context: context,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.vertical(top: Radius.circular(32)),
),
builder: (context) {
return Padding(
padding: const EdgeInsets.all(32.0),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Center(
child: Container(
width: 40,
height: 4,
decoration: BoxDecoration(
color: Colors.grey.shade300,
borderRadius: BorderRadius.circular(10),
),
),
),
const SizedBox(height: 32),
const Text(
'Detalhes da Transação',
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
),
const SizedBox(height: 24),
_DetailItem(label: 'Pagador', value: transaction.pagador.nome),
_DetailItem(
label: 'CPF/CNPJ',
value:
transaction.pagador.cpf ??
transaction.pagador.cnpj ??
'---',
),
_DetailItem(label: 'Valor', value: 'R\$ ${transaction.valor}'),
_DetailItem(label: 'Data/Hora', value: transaction.horario),
_DetailItem(
label: 'End-to-End ID',
value: transaction.endToEndId ?? '---',
),
_DetailItem(label: 'TXID', value: transaction.txid ?? '---'),
const SizedBox(height: 32),
SizedBox(
width: double.infinity,
child: TextButton(
onPressed: () => Navigator.pop(context),
child: const Text('Fechar'),
),
),
],
),
);
},
);
}
}
class _DetailItem extends StatelessWidget {
final String label;
final String value;
const _DetailItem({required this.label, required this.value});
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.only(bottom: 16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
label.toUpperCase(),
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.bold,
color: Colors.grey.shade500,
letterSpacing: 1.2,
),
),
const SizedBox(height: 4),
Text(
value,
style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w600),
),
],
),
);
}
}