Skip to content

Commit

Permalink
Merge branch 'main' into feature/currency_selector
Browse files Browse the repository at this point in the history
  • Loading branch information
@lucaantonelli
lucaantonelli authored Feb 25, 2024
2 parents d824401 + 830e80c commit 57facf8
Show file tree
Hide file tree
Showing 13 changed files with 368 additions and 437 deletions.
1 change: 0 additions & 1 deletion lib/constants/constants.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,6 @@ const categoryColorList = [
category7,
category8,
category9,
category10,
];

const darkCategoryColorList = [
Expand Down
8 changes: 3 additions & 5 deletions lib/constants/style.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,10 +41,9 @@ const category3 = Color(0xFFFF4754);
const category4 = Color(0xFFD336B6);
const category5 = Color(0xFF7236D3);
const category6 = Color(0xFF2675E3);
const category7 = Color(0xFF16ADDF);//inesistente sul figma
const category8 = Color(0xFF12BFCE);
const category9 = Color(0xFF12BA95);
const category10 = Color(0xFF0BC11D);
const category7 = Color(0xFF12BFCE);
const category8 = Color(0xFF12BA95);
const category9 = Color(0xFF0BC11D);

const account1 = Color(0xFFFFB703);
const account2 = Color(0xFFFB8500);
Expand Down Expand Up @@ -81,7 +80,6 @@ const darkCategory6 = Color(0xFF1B6BD9);
const darkCategory7 = Color(0xFF0FB1C0);
const darkCategory8 = Color(0xFF0EB38F);
const darkCategory9 = Color(0xFF0AAF1A);
// const darkCategory10 = Color(0xFF);

const darkAccount1 = Color(0xFFE0A30C);
const darkAccount2 = Color(0xFFDC7807);
Expand Down
7 changes: 4 additions & 3 deletions lib/custom_widgets/account_modal.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import 'dart:ui';
import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

import '../constants/functions.dart';
import '../providers/currency_provider.dart';
import 'line_chart.dart';
Expand Down Expand Up @@ -61,7 +62,7 @@ class AccountDialog extends ConsumerWidget with Functions {
padding: EdgeInsets.all(8.0),
),
LineChartWidget(
line1Data: [
lineData: [
FlSpot(0, 3),
FlSpot(1, 1.3),
FlSpot(2, -2),
Expand All @@ -80,9 +81,9 @@ class AccountDialog extends ConsumerWidget with Functions {
FlSpot(15, -4.5),
FlSpot(16, 2.5),
],
colorLine1Data: Color(0xffffffff),
lineColor: Color(0xffffffff),
line2Data: <FlSpot>[],
colorLine2Data: Color(0xffffffff),
line2Color: Color(0xffffffff),
colorBackground: Color(0xff356CA3),
period: Period.month,
),
Expand Down
153 changes: 74 additions & 79 deletions lib/custom_widgets/line_chart.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,39 +4,36 @@ import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';

enum Period {
month,
year
}
enum Period { month, year }

//This class can be used when we need to draw a line chart with one or two lines
class LineChartWidget extends StatefulWidget {
final List<FlSpot> line1Data; //this should be a list of Flspot(x,y)
final Color colorLine1Data;
final List<FlSpot> lineData; //this should be a list of Flspot(x,y)
final Color? lineColor;

final List<FlSpot> line2Data; //this should be a list of Flspot(x,y), if you only need one just put an empty list
final Color colorLine2Data;
final List<FlSpot> line2Data; //this should be a list of Flspot(x,y)
final Color? line2Color;

// Used to decide the bottom label
final Period period;
final int currentMonthDays = DateUtils.getDaysInMonth(DateTime.now().year, DateTime.now().month);
final int nXLabel = 10;
final double minY;
final Color colorBackground;

final Color? colorBackground;
LineChartWidget({
super.key,
required this.line1Data,
required this.colorLine1Data,
required this.line2Data,
required this.colorLine2Data,
required this.colorBackground,
required this.lineData,
this.lineColor,
this.line2Data = const [],
this.line2Color,
this.colorBackground,
this.period = Period.month,
int nXLabel = 10,
double? minY,
}) : minY = minY ?? calculateMinY(line1Data, line2Data);
}) : minY = minY ?? calculateMinY(lineData, line2Data);

static double calculateMinY(List<FlSpot> line1Data, List<FlSpot> line2Data){
static double calculateMinY(List<FlSpot> line1Data, List<FlSpot> line2Data) {
if (line1Data.isEmpty && line2Data.isEmpty) {
return 0;
}
Expand All @@ -46,45 +43,34 @@ class LineChartWidget extends StatefulWidget {

@override
State<LineChartWidget> createState() => _LineChartSample2State();

}

class _LineChartSample2State extends State<LineChartWidget> {
_LineChartSample2State();

@override
Widget build(BuildContext context) {
final ThemeData themeData = Theme.of(context);
return Stack(
children: [
AspectRatio(
aspectRatio: 2,
child: DecoratedBox(
decoration: BoxDecoration(
borderRadius: const BorderRadius.all(
Radius.circular(18),
),
color: widget.colorBackground,
color: widget.colorBackground ?? themeData.colorScheme.tertiary,
),
child: Padding(
padding: const EdgeInsets.only(top: 24),
child: Builder(
builder: (context) {
if(widget.line1Data.length < 2 && widget.line2Data.length < 2){
if (widget.lineData.length < 2 && widget.line2Data.length < 2) {
return Center(
child: RichText(
textAlign: TextAlign.center,
text: TextSpan(
style: DefaultTextStyle.of(context).style,
children: <TextSpan>[
TextSpan(
text: "We are sorry but there are not\nenough data to make the graph",
style: TextStyle(color: Theme.of(context).hintColor),
)
]
)
child: Text(
"We are sorry but there are not\nenough data to make the graph...",
style: TextStyle(color: Theme.of(context).hintColor),
),
); }

);
}
return LineChart(
mainData(),
);
Expand All @@ -98,8 +84,10 @@ class _LineChartSample2State extends State<LineChartWidget> {
}

Widget bottomTitleWidgets(double value, TitleMeta meta) {
final ThemeData themeData = Theme.of(context);
Color lineColor = widget.lineColor ?? themeData.colorScheme.primary;
final style = TextStyle(
color: widget.colorLine1Data.withOpacity(1.0),
color: lineColor,
fontWeight: FontWeight.normal,
fontSize: 8,
);
Expand Down Expand Up @@ -144,9 +132,12 @@ class _LineChartSample2State extends State<LineChartWidget> {
break;
case Period.month:
int step = (widget.currentMonthDays / widget.nXLabel).round();
if(value.toInt() % step == 1 && value.toInt() != widget.currentMonthDays){
text = Text((value + 1).toStringAsFixed(0), style: style,);
}else{
if (value.toInt() % step == 1 && value.toInt() != widget.currentMonthDays) {
text = Text(
(value + 1).toStringAsFixed(0),
style: style,
);
} else {
text = Text('', style: style);
}

Expand All @@ -162,6 +153,10 @@ class _LineChartSample2State extends State<LineChartWidget> {
}

LineChartData mainData() {
final ThemeData themeData = Theme.of(context);
Color lineColor = widget.lineColor ?? themeData.colorScheme.primary;
Color line2Color = widget.line2Color ?? themeData.disabledColor;

return LineChartData(
titlesData: FlTitlesData(
show: true,
Expand All @@ -183,48 +178,43 @@ class _LineChartSample2State extends State<LineChartWidget> {
),
gridData: const FlGridData(show: false),
lineTouchData: LineTouchData(
getTouchedSpotIndicator:
(LineChartBarData barData, List<int> spotIndexes) {
bool allSameX = spotIndexes.toSet().length == 1;
getTouchedSpotIndicator: (LineChartBarData barData, List<int> spotIndexes) {
bool allSameX = spotIndexes.toSet().length == 1;

if(!allSameX){
return [];
}
return spotIndexes.map((spotIndex) {
return TouchedSpotIndicatorData(
const FlLine(
color: Colors.blueGrey,
strokeWidth: 2,
),
FlDotData(
getDotPainter: (spot, percent, barData, index) {
return FlDotCirclePainter(
radius: 2,
color: Colors.grey,
strokeWidth: 2,
strokeColor: Colors.blueGrey
);
},
),
);
}).toList();
if (!allSameX) {
return [];
}
return spotIndexes.map((spotIndex) {
return TouchedSpotIndicatorData(
const FlLine(
color: Colors.blueGrey,
strokeWidth: 2,
),
FlDotData(
getDotPainter: (spot, percent, barData, index) {
return FlDotCirclePainter(
radius: 2, color: Colors.grey, strokeWidth: 2, strokeColor: Colors.blueGrey);
},
),
);
}).toList();
},
touchTooltipData: LineTouchTooltipData(
fitInsideHorizontally: true,
getTooltipItems: (List<LineBarSpot> touchedBarSpots) {
bool allSameX = touchedBarSpots.map((e) => e.x).toSet().length == 1;

if(!allSameX || touchedBarSpots.isEmpty){
if (!allSameX || touchedBarSpots.isEmpty) {
return [];
}

double x = touchedBarSpots[0].x;
DateTime date = widget.period == Period.month ?
DateTime(DateTime.now().year, DateTime.now().month, (x+1).toInt()) :
DateTime(DateTime.now().year, (x+1).toInt(), 1);
String dateFormat = widget.period == Period.month ?
DateFormat(DateFormat.ABBR_MONTH_DAY).format(date) :
DateFormat(DateFormat.ABBR_MONTH).format(date);
DateTime date = widget.period == Period.month
? DateTime(DateTime.now().year, DateTime.now().month, (x + 1).toInt())
: DateTime(DateTime.now().year, (x + 1).toInt(), 1);
String dateFormat = widget.period == Period.month
? DateFormat(DateFormat.ABBR_MONTH_DAY).format(date)
: DateFormat(DateFormat.ABBR_MONTH).format(date);

LineTooltipItem first = LineTooltipItem(
'$dateFormat \n\n',
Expand All @@ -236,7 +226,7 @@ class _LineChartSample2State extends State<LineChartWidget> {
TextSpan(
text: touchedBarSpots[0].y.toString(),
style: TextStyle(
color: widget.colorLine2Data,
color: line2Color,
fontWeight: FontWeight.w900,
),
),
Expand All @@ -255,7 +245,7 @@ class _LineChartSample2State extends State<LineChartWidget> {
TextSpan(
text: flSpot.y.toString(),
style: TextStyle(
color: widget.colorLine1Data,
color: lineColor,
fontWeight: FontWeight.w900,
),
),
Expand All @@ -267,33 +257,38 @@ class _LineChartSample2State extends State<LineChartWidget> {
},
),
),

borderData: FlBorderData(
border: const Border(
bottom: BorderSide(color: Colors.grey, width: 1.0, style: BorderStyle.solid),
),
),
minX: 0,
maxX: widget.period == Period.year ? 11 : widget.currentMonthDays - 1, // if year display 12 month, if mont display the number of days in the month
maxX: widget.period == Period.year
? 11
: widget.currentMonthDays -
1, // if year display 12 month, if mont display the number of days in the month
minY: widget.minY,
lineBarsData: [
LineChartBarData(
spots: widget.line1Data,
spots: widget.lineData,
isCurved: true,
barWidth: 1.5,
isStrokeCapRound: true,
color: widget.colorLine1Data,
color: lineColor,
dotData: const FlDotData(
show: false,
),
belowBarData: BarAreaData(show: true, color: widget.colorLine1Data.withOpacity(0.3)),
belowBarData: BarAreaData(
show: true,
color: lineColor.withOpacity(0.3)),
),
LineChartBarData(
spots: widget.line2Data,
isCurved: true,
barWidth: 1,
isStrokeCapRound: true,
color: widget.colorLine2Data,
color: line2Color,
dotData: const FlDotData(
show: false,
),
Expand Down
8 changes: 4 additions & 4 deletions ...page/widgets/transaction_type_button.dart → ...stom_widgets/transaction_type_button.dart
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

import '../../../constants/style.dart';
import '../../../model/transaction.dart';
import 'accounts_tab.dart';
import 'categories_tab.dart';
import '../constants/style.dart';
import '../model/transaction.dart';
import '../pages/transactions_page/widgets/accounts_tab.dart';
import '../pages/transactions_page/widgets/categories_tab.dart';

final selectedTransactionTypeProvider =
StateProvider.autoDispose<TransactionType>((ref) => TransactionType.income);
Expand Down
Loading

0 comments on commit 57facf8

Please sign in to comment.