Fixed mobile layout
This commit is contained in:
25
.vscode/launch.json
vendored
Normal file
25
.vscode/launch.json
vendored
Normal file
@@ -0,0 +1,25 @@
|
||||
{
|
||||
// Use IntelliSense to learn about possible attributes.
|
||||
// Hover to view descriptions of existing attributes.
|
||||
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"name": "tunas",
|
||||
"request": "launch",
|
||||
"type": "dart"
|
||||
},
|
||||
{
|
||||
"name": "tunas (profile mode)",
|
||||
"request": "launch",
|
||||
"type": "dart",
|
||||
"flutterMode": "profile"
|
||||
},
|
||||
{
|
||||
"name": "tunas (release mode)",
|
||||
"request": "launch",
|
||||
"type": "dart",
|
||||
"flutterMode": "release"
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -202,8 +202,12 @@ class AccountBloc extends Bloc<AccountEvent, AccountState> {
|
||||
accountFound.color = accountToSave.color;
|
||||
accountFound.saving = accountToSave.saving;
|
||||
} catch (e) {
|
||||
if (accounts.isEmpty) {
|
||||
accounts = [accountToSave];
|
||||
} else {
|
||||
accounts.add(accountToSave);
|
||||
}
|
||||
}
|
||||
|
||||
await _metadataRepository.saveAccounts(accounts);
|
||||
return accounts;
|
||||
|
||||
@@ -7,19 +7,19 @@ class BudgetsPage extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
MediaQueryData mediaQuery = MediaQuery.of(context);
|
||||
return Center(
|
||||
child: Container(
|
||||
constraints: const BoxConstraints(
|
||||
maxWidth: 1000
|
||||
),
|
||||
padding: const EdgeInsets.symmetric(vertical: 9, horizontal: 10),
|
||||
margin: const EdgeInsets.symmetric(vertical: 2, horizontal: 10),
|
||||
child: const Column(
|
||||
children: [
|
||||
child: ListView(
|
||||
padding: mediaQuery.padding.copyWith(left: 10.0, right: 10.0, bottom: 100.0),
|
||||
children: const [
|
||||
BudgetsActions(),
|
||||
MonthDistribution()
|
||||
],
|
||||
)
|
||||
]
|
||||
),
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
@@ -8,34 +8,27 @@ class DataPage extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
MediaQueryData mediaQuery = MediaQuery.of(context);
|
||||
return Center(
|
||||
child: Container(
|
||||
constraints: const BoxConstraints(
|
||||
maxWidth: 1000
|
||||
),
|
||||
padding: const EdgeInsets.symmetric(vertical: 9, horizontal: 10),
|
||||
margin: const EdgeInsets.symmetric(vertical: 2, horizontal: 10),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
const Text(
|
||||
child: ListView(
|
||||
padding: mediaQuery.padding.copyWith(left: 10.0, right: 10.0, bottom: 100.0),
|
||||
children: const [
|
||||
Text(
|
||||
'Settings',
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.w900,
|
||||
fontSize: 35,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: ListView(
|
||||
children: const [
|
||||
ImportSettings(),
|
||||
AccountSettings(),
|
||||
CategoriesSettings(),
|
||||
]
|
||||
)
|
||||
),
|
||||
]
|
||||
)
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
@@ -110,6 +110,7 @@ class StatsPage extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
MediaQueryData mediaQuery = MediaQuery.of(context);
|
||||
bool smallVerticalScreen = MediaQuery.sizeOf(context).width < 800;
|
||||
return BlocProvider(
|
||||
create: (context) => ChartBloc(
|
||||
@@ -118,6 +119,7 @@ class StatsPage extends StatelessWidget {
|
||||
),
|
||||
child: BlocBuilder<ChartBloc, ChartState>(
|
||||
builder: (context, state) => ListView(
|
||||
padding: mediaQuery.padding.copyWith(bottom: 100.0),
|
||||
children: [
|
||||
smallVerticalScreen ? _smallScreenHeader(state) : _largeScreenHeader(state),
|
||||
SizedBox(
|
||||
|
||||
@@ -26,7 +26,7 @@ class MonthlyCategoriesTotalChart extends StatelessWidget {
|
||||
);
|
||||
}
|
||||
|
||||
List<BarChartGroupData> _computeBarGroups(double barsSpace, double barsWidth, Map<String, Color> categoriesColors) {
|
||||
List<BarChartGroupData> _computeBarGroups(double barsSpace, double barsWidth, Map<String, Color> categoriesColors, bool smallVerticalScreen) {
|
||||
var a = categoriesMonthlyTotals.entries
|
||||
.map((entry) {
|
||||
return BarChartGroupData(
|
||||
@@ -36,7 +36,7 @@ class MonthlyCategoriesTotalChart extends StatelessWidget {
|
||||
_computeStack(barsWidth, entry.value.positives, categoriesColors),
|
||||
_computeStack(barsWidth, entry.value.negatives, categoriesColors),
|
||||
],
|
||||
showingTooltipIndicators: [0, 1]
|
||||
showingTooltipIndicators: smallVerticalScreen ? [] : [0, 1]
|
||||
);
|
||||
})
|
||||
.toList();
|
||||
@@ -66,6 +66,7 @@ class MonthlyCategoriesTotalChart extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
bool smallVerticalScreen = MediaQuery.sizeOf(context).width < 800;
|
||||
return BlocBuilder<CategoryBloc, CategoryState>(
|
||||
builder: (context, state) => AspectRatio(
|
||||
aspectRatio: 1.66,
|
||||
@@ -77,7 +78,7 @@ class MonthlyCategoriesTotalChart extends StatelessWidget {
|
||||
return BarChart(
|
||||
BarChartData(
|
||||
maxY: _computeMaxValue(),
|
||||
barGroups: _computeBarGroups(barsSpace, barsWidth, state.categoriesColors),
|
||||
barGroups: _computeBarGroups(barsSpace, barsWidth, state.categoriesColors, smallVerticalScreen),
|
||||
titlesData: FlTitlesData(
|
||||
topTitles: const AxisTitles(
|
||||
sideTitles: SideTitles(showTitles: false)
|
||||
|
||||
@@ -8,11 +8,13 @@ class TransactionsPage extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
MediaQueryData mediaQuery = MediaQuery.of(context);
|
||||
return Center(
|
||||
child: ConstrainedBox(
|
||||
child: Container(
|
||||
constraints: const BoxConstraints(
|
||||
maxWidth: 1000
|
||||
),
|
||||
padding: mediaQuery.padding,
|
||||
child: const Column(
|
||||
children: [
|
||||
TransactionsActions(),
|
||||
|
||||
@@ -9,20 +9,17 @@ class TransactionLine extends StatelessWidget {
|
||||
|
||||
const TransactionLine({super.key, required this.transaction, required this.subTotal});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return InkWell(
|
||||
onTap: () => TransactionAddDialog.show(context, transaction),
|
||||
child: MergeSemantics(
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(vertical: 9, horizontal: 10),
|
||||
margin: const EdgeInsets.symmetric(vertical: 2, horizontal: 10),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
List<Widget> _largeScreenLayout(BuildContext context) {
|
||||
return [
|
||||
SizedBox(
|
||||
width: 100,
|
||||
child: Text(DateFormat('dd-MM-yyyy', 'fr_FR').format(transaction.date))
|
||||
child: Text(
|
||||
DateFormat('dd/MM/yyyy', 'fr_FR').format(transaction.date),
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.w300,
|
||||
fontSize: 15
|
||||
)
|
||||
)
|
||||
),
|
||||
Expanded(
|
||||
child: Column(
|
||||
@@ -32,7 +29,10 @@ class TransactionLine extends StatelessWidget {
|
||||
transaction.category,
|
||||
style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 18)
|
||||
),
|
||||
Text(transaction.description),
|
||||
Text(
|
||||
transaction.description,
|
||||
style: const TextStyle(fontWeight: FontWeight.w300, fontSize: 15)
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
@@ -54,13 +54,85 @@ class TransactionLine extends StatelessWidget {
|
||||
Text(
|
||||
NumberFormat('#######.00 €', 'fr_FR').format(subTotal),
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.w300,
|
||||
fontSize: 15,
|
||||
color: subTotal > 0 ? Theme.of(context).colorScheme.primary : Theme.of(context).colorScheme.error
|
||||
)
|
||||
),
|
||||
],
|
||||
),
|
||||
)
|
||||
];
|
||||
}
|
||||
|
||||
List<Widget> _smallScreenLayout(BuildContext context) {
|
||||
return [
|
||||
SizedBox(
|
||||
width: 100,
|
||||
child: Text(
|
||||
DateFormat('dd/MM/yyyy', 'fr_FR').format(transaction.date),
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.w300,
|
||||
fontSize: 15
|
||||
)
|
||||
)
|
||||
),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
transaction.category,
|
||||
style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 18)
|
||||
),
|
||||
Text(
|
||||
transaction.description,
|
||||
style: const TextStyle(fontWeight: FontWeight.w300, fontSize: 15)
|
||||
),
|
||||
Text(
|
||||
transaction.account,
|
||||
style: const TextStyle(fontWeight: FontWeight.w300, fontSize: 15)
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
width: 120,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.end,
|
||||
children: [
|
||||
Text(
|
||||
NumberFormat(transaction.value > 0 ? '+#######.00 €' : '#######.00 €', 'fr_FR').format(transaction.value),
|
||||
style: TextStyle(
|
||||
color: transaction.value > 0 ? Theme.of(context).colorScheme.primary : Theme.of(context).colorScheme.error
|
||||
)
|
||||
),
|
||||
Text(
|
||||
NumberFormat('#######.00 €', 'fr_FR').format(subTotal),
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.w300,
|
||||
fontSize: 15,
|
||||
color: subTotal > 0 ? Theme.of(context).colorScheme.primary : Theme.of(context).colorScheme.error
|
||||
)
|
||||
),
|
||||
],
|
||||
),
|
||||
)
|
||||
];
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
bool smallVerticalScreen = MediaQuery.sizeOf(context).width < 800;
|
||||
return InkWell(
|
||||
onTap: () => TransactionAddDialog.show(context, transaction),
|
||||
child: MergeSemantics(
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(vertical: 9, horizontal: 10),
|
||||
margin: const EdgeInsets.symmetric(vertical: 2, horizontal: 10),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: smallVerticalScreen ? _smallScreenLayout(context) : _largeScreenLayout(context),
|
||||
)
|
||||
)
|
||||
)
|
||||
|
||||
@@ -23,7 +23,7 @@ class TransactionsActions extends StatelessWidget {
|
||||
),
|
||||
FilledButton.icon(
|
||||
onPressed: () => TransactionAddDialog.show(context, null),
|
||||
label: const Text('Add transaction'),
|
||||
label: const Text('Add'),
|
||||
icon: const Icon(
|
||||
Icons.add
|
||||
)
|
||||
|
||||
@@ -3,17 +3,8 @@ import 'package:flutter/material.dart';
|
||||
class TransactionsHeader extends StatelessWidget {
|
||||
const TransactionsHeader({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(vertical: 9, horizontal: 10),
|
||||
margin: const EdgeInsets.symmetric(vertical: 2, horizontal: 10),
|
||||
decoration: const BoxDecoration(
|
||||
border: Border(bottom: BorderSide(color: Colors.black))
|
||||
),
|
||||
child: const Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
List<Widget> _largeScreenLayout() {
|
||||
return const [
|
||||
SizedBox(
|
||||
width: 100,
|
||||
child: Text('Date')
|
||||
@@ -35,8 +26,44 @@ class TransactionsHeader extends StatelessWidget {
|
||||
],
|
||||
),
|
||||
)
|
||||
];
|
||||
}
|
||||
|
||||
List<Widget> _smallScreenLayout() {
|
||||
return const [
|
||||
SizedBox(
|
||||
width: 100,
|
||||
child: Text('Date')
|
||||
),
|
||||
Expanded(
|
||||
child: Text('Description')
|
||||
),
|
||||
SizedBox(
|
||||
width: 120,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.end,
|
||||
children: [
|
||||
Text('Amount'),
|
||||
Text('SubTotal'),
|
||||
],
|
||||
),
|
||||
)
|
||||
];
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
bool smallVerticalScreen = MediaQuery.sizeOf(context).width < 800;
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(vertical: 9, horizontal: 10),
|
||||
margin: const EdgeInsets.symmetric(vertical: 2, horizontal: 10),
|
||||
decoration: const BoxDecoration(
|
||||
border: Border(bottom: BorderSide(color: Colors.black))
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: smallVerticalScreen ? _smallScreenLayout() : _largeScreenLayout(),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user