Files
dragon_ledger/lib/Pages/home_page.dart

118 lines
3.5 KiB
Dart

import 'package:dropdown_search/dropdown_search.dart';
import 'package:flutter/material.dart';
import 'package:flutter_expandable_fab/flutter_expandable_fab.dart';
import 'package:routemaster/routemaster.dart';
/// Eine Seite, die als Container für die verschiedenen Tabs der App dient.
///
/// Diese Seite enthält eine App-Bar mit einer Kontoauswahl sowie ein
/// Bottom-Navigation-Bar für die Navigation zwischen
/// Dashboard, Verlauf und Einstellungen.
class HomePage extends StatefulWidget {
/// Erstellt eine neue Instanz der HomePage.
const HomePage({super.key});
@override
State<HomePage> createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
String selected = 'Konto 1';
@override
Widget build(final BuildContext context) {
final TabPageState tabPage = TabPage.of(context);
return Scaffold(
appBar: AppBar(
centerTitle: true,
titleSpacing: 0,
title: Padding(
padding: const EdgeInsets.symmetric(horizontal: 12),
child: _accountSelect(),
),
),
body: SafeArea(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
child: TabBarView(
controller: tabPage.controller,
children: <Widget>[
for (final PageStack stack in tabPage.stacks)
PageStackNavigator(stack: stack),
],
),
),
),
bottomNavigationBar: _bottomNav(tabPage),
floatingActionButtonLocation: ExpandableFab.location,
floatingActionButton: _floatingActionButton(),
);
}
Widget _bottomNav(final TabPageState tabPage) => BottomNavigationBar(
currentIndex: tabPage.index,
onTap: tabPage.controller.animateTo,
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(icon: Icon(Icons.dashboard), label: 'Dashboard'),
BottomNavigationBarItem(icon: Icon(Icons.history), label: 'Verlauf'),
BottomNavigationBarItem(
icon: Icon(Icons.settings),
label: 'Einstellungen',
),
],
);
Widget _accountSelect() => DropdownSearch<String>(
items: (final String filter, final LoadProps? infiniteScrollProps) =>
<String>['Konto 1', 'Konto 2', 'Konto 3', 'Konto 4'],
selectedItem: selected,
onChanged: (final String? value) => setState(() => selected = value!),
popupProps: const PopupProps<String>.menu(
showSearchBox: true,
searchFieldProps: TextFieldProps(
decoration: InputDecoration(
hintText: 'Suchen...',
contentPadding: EdgeInsets.symmetric(horizontal: 12, vertical: 8),
),
),
),
);
Widget _floatingActionButton() => ExpandableFab(
openButtonBuilder: RotateFloatingActionButtonBuilder(
child: const Icon(Icons.add),
),
type: ExpandableFabType.up,
childrenAnimation: ExpandableFabAnimation.none,
distance: 70,
children: const <Widget>[
Row(
children: <Widget>[
Text('Neue Transaktion'),
SizedBox(width: 20),
FloatingActionButton.small(
heroTag: null,
onPressed: null,
child: Icon(Icons.add),
),
],
),
Row(
children: <Widget>[
Text('Neues Konto'),
SizedBox(width: 20),
FloatingActionButton.small(
heroTag: null,
onPressed: null,
child: Icon(Icons.account_balance_wallet),
),
],
),
],
);
}