feat: add profile and setting screen

This commit is contained in:
Syaroful 2024-10-01 14:44:18 +07:00
parent 9e9cc57e54
commit d7a802b244
12 changed files with 411 additions and 21 deletions

View File

@ -1,6 +1,7 @@
import 'package:flutter/material.dart';
class AppColor {
static const Color backgroundColor = Color(0xFFF7F8F8);
static const Color primary = Color(0xFF227267);
static const Color darkGreen = Color(0xFF16423C);
static const Color secondary = Color(0xFF399C8F);

View File

@ -1,6 +1,8 @@
import 'package:agrilink_vocpro/core/constant/app_theme.dart';
import 'package:agrilink_vocpro/features/control/provider/control_provider.dart';
import 'package:agrilink_vocpro/features/home/widgets/graphic_widget.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:provider/provider.dart';
class ControlScreen extends StatelessWidget {
@ -20,7 +22,7 @@ class ControlScreen extends StatelessWidget {
child: ListView(
children: [
ListTile(
title: const Text('Control 1'),
title: Text('Control 1', style: AppTheme.labelMedium),
subtitle: const Text('Control 1 description'),
trailing: Switch(
value: provider.control_1,

View File

@ -1,6 +1,7 @@
import 'package:agrilink_vocpro/features/control/view/control_screen.dart';
import 'package:agrilink_vocpro/features/home/view/home_screen.dart';
import 'package:agrilink_vocpro/features/plants/view/plants_screen.dart';
import 'package:agrilink_vocpro/features/setting/view/setting_screen.dart';
import 'package:flutter/material.dart';
class DashboardProvider extends ChangeNotifier {
@ -18,7 +19,7 @@ class DashboardProvider extends ChangeNotifier {
const HomeScreen(),
const ControlScreen(),
const PlantsScreen(),
const Center(child: Text('Settings')),
const SettingScreen(),
];
List<Widget> get screens => _screens;

View File

@ -1,6 +1,7 @@
import 'package:agrilink_vocpro/core/constant/app_theme.dart';
import 'package:agrilink_vocpro/features/home/pages/humidity/widgets/circle_chart.dart';
import 'package:agrilink_vocpro/features/home/provider/home_provider.dart';
import 'package:agrilink_vocpro/features/home/widgets/graphic_widget.dart';
import 'package:bootstrap_icons/bootstrap_icons.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
@ -66,9 +67,25 @@ class HumidityScreen extends StatelessWidget {
const SizedBox(height: 16),
Padding(
padding: EdgeInsets.only(left: 16.w),
child: const Text('Deskripsi'),
child: const Text('Grafik dalam 7 hari terakhir'),
),
const SizedBox(height: 16),
AspectRatio(
aspectRatio: 2.h,
child: Container(
margin: EdgeInsets.symmetric(horizontal: 16.w),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(16.w),
border: Border.all(
color: Colors.grey.shade300, width: 1.w)),
child: const GarphicWidget()),
),
SizedBox(height: 16.h),
Padding(
padding: EdgeInsets.only(left: 16.w),
child: const Text('Deskripsi'),
),
ListView.builder(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
@ -90,10 +107,10 @@ class HumidityScreen extends StatelessWidget {
children: [
Text(
item.description,
style: AppTheme.hintStyle,
style: AppTheme.labelMedium,
),
SizedBox(height: 8.h),
Text('Tindakan', style: AppTheme.labelMedium),
Text('Tindakan', style: AppTheme.labelSmall),
SizedBox(height: 8.h),
Text(item.action),
],

View File

@ -1,4 +1,5 @@
import 'package:agrilink_vocpro/core/constant/app_theme.dart';
import 'package:agrilink_vocpro/features/home/widgets/graphic_widget.dart';
import 'package:bootstrap_icons/bootstrap_icons.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
@ -41,20 +42,12 @@ class LightScreen extends StatelessWidget {
child: Stack(
fit: StackFit.expand,
children: [
Center(
const Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(BootstrapIcons.sun,
Icon(BootstrapIcons.sun,
size: 32, color: Colors.orange),
Text(
'${value.toStringAsFixed(0)} lux', // Animated percentage text
style: const TextStyle(
fontSize: 28,
fontWeight: FontWeight.bold,
color: Colors.black,
),
),
],
),
),
@ -65,10 +58,10 @@ class LightScreen extends StatelessWidget {
axis: GaugeAxis(
degrees: 360,
min: 0,
max: 5000,
max: 1000,
style: GaugeAxisStyle(
background: Colors.grey.shade100,
thickness: 50,
thickness: 100,
),
progressBar: GaugeBasicProgressBar(
gradient: GaugeAxisGradient(colors: [
@ -82,6 +75,15 @@ class LightScreen extends StatelessWidget {
),
),
const SizedBox(height: 16),
Text(
'${value.toStringAsFixed(0)} lux',
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 28,
fontWeight: FontWeight.bold,
color: Colors.black,
),
),
const SizedBox(height: 16),
Row(
mainAxisAlignment: MainAxisAlignment.center,
@ -99,8 +101,18 @@ class LightScreen extends StatelessWidget {
],
),
SizedBox(height: 16.h),
const Text('Deskripsi'),
const Text('Grafik'),
SizedBox(height: 16.h),
AspectRatio(
aspectRatio: 1.5.h,
child: Container(
decoration: BoxDecoration(
border: Border.all(color: Colors.grey.shade300, width: 1.w),
borderRadius: BorderRadius.circular(16.w),
),
child: const GarphicWidget(),
),
)
// Row(
// mainAxisAlignment: MainAxisAlignment.spaceAround,
// children: [

View File

@ -1,4 +1,5 @@
import 'package:agrilink_vocpro/core/constant/app_theme.dart';
import 'package:agrilink_vocpro/features/home/widgets/graphic_widget.dart';
import 'package:bootstrap_icons/bootstrap_icons.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
@ -100,8 +101,6 @@ class TemperatureScreen extends StatelessWidget {
],
),
SizedBox(height: 16.h),
const Text('Deskripsi'),
SizedBox(height: 16.h),
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
@ -199,6 +198,20 @@ class TemperatureScreen extends StatelessWidget {
),
),
],
),
SizedBox(height: 16.h),
const Text('Grafik'),
SizedBox(height: 16.h),
AspectRatio(
aspectRatio: 1.6.h,
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(16.w),
border: Border.all(color: Colors.grey.shade300, width: 1.w),
),
child: const GarphicWidget(),
),
)
],
),

View File

@ -23,7 +23,7 @@ class _HomeScreenState extends State<HomeScreen> {
appBar: AppBar(
toolbarHeight: 200.h,
elevation: 0,
backgroundColor: Colors.white,
backgroundColor: AppColor.backgroundColor,
scrolledUnderElevation: 0,
flexibleSpace: Padding(
padding: EdgeInsets.symmetric(horizontal: 12.w),

View File

@ -0,0 +1,191 @@
import 'package:agrilink_vocpro/core/constant/app_color.dart';
import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
class GarphicWidget extends StatelessWidget {
const GarphicWidget({super.key, thi});
@override
Widget build(BuildContext context) {
return BarChart(
BarChartData(
barTouchData: barTouchData,
titlesData: titlesData,
borderData: borderData,
barGroups: barGroups,
gridData: const FlGridData(show: false),
alignment: BarChartAlignment.spaceAround,
maxY: 20,
),
);
}
}
BarTouchData get barTouchData => BarTouchData(
enabled: false,
touchTooltipData: BarTouchTooltipData(
getTooltipColor: (group) => Colors.transparent,
tooltipPadding: EdgeInsets.zero,
tooltipMargin: 8,
getTooltipItem: (
BarChartGroupData group,
int groupIndex,
BarChartRodData rod,
int rodIndex,
) {
return BarTooltipItem(
rod.toY.round().toString(),
const TextStyle(
color: AppColor.textDark,
fontWeight: FontWeight.bold,
),
);
},
),
);
Widget getTitles(double value, TitleMeta meta) {
const style = TextStyle(
color: AppColor.textDark,
fontWeight: FontWeight.bold,
fontSize: 14,
);
String text;
switch (value.toInt()) {
case 0:
text = 'Mon';
break;
case 1:
text = 'Tue';
break;
case 2:
text = 'Wed';
break;
case 3:
text = 'Thu';
break;
case 4:
text = 'Fri';
break;
case 5:
text = 'Sat';
break;
case 6:
text = 'Sun';
break;
default:
text = '';
break;
}
return SideTitleWidget(
axisSide: meta.axisSide,
space: 4,
child: Text(text, style: style),
);
}
FlTitlesData get titlesData => const FlTitlesData(
show: true,
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
reservedSize: 30,
getTitlesWidget: getTitles,
),
),
leftTitles: AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
topTitles: AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
rightTitles: AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
);
FlBorderData get borderData => FlBorderData(
show: false,
);
LinearGradient get _barsGradient => const LinearGradient(
colors: [
AppColor.secondary,
AppColor.ternary,
],
begin: Alignment.bottomCenter,
end: Alignment.topCenter,
);
List<BarChartGroupData> get barGroups => [
BarChartGroupData(
x: 0,
barRods: [
BarChartRodData(
toY: 8,
gradient: _barsGradient,
)
],
showingTooltipIndicators: [0],
),
BarChartGroupData(
x: 1,
barRods: [
BarChartRodData(
toY: 10,
gradient: _barsGradient,
)
],
showingTooltipIndicators: [0],
),
BarChartGroupData(
x: 2,
barRods: [
BarChartRodData(
toY: 14,
gradient: _barsGradient,
)
],
showingTooltipIndicators: [0],
),
BarChartGroupData(
x: 3,
barRods: [
BarChartRodData(
toY: 15,
gradient: _barsGradient,
)
],
showingTooltipIndicators: [0],
),
BarChartGroupData(
x: 4,
barRods: [
BarChartRodData(
toY: 13,
gradient: _barsGradient,
)
],
showingTooltipIndicators: [0],
),
BarChartGroupData(
x: 5,
barRods: [
BarChartRodData(
toY: 10,
gradient: _barsGradient,
)
],
showingTooltipIndicators: [0],
),
BarChartGroupData(
x: 6,
barRods: [
BarChartRodData(
toY: 16,
gradient: _barsGradient,
)
],
showingTooltipIndicators: [0],
),
];

View File

@ -0,0 +1,152 @@
import 'dart:io';
import 'package:agrilink_vocpro/core/constant/app_color.dart';
import 'package:agrilink_vocpro/core/constant/app_theme.dart';
import 'package:bootstrap_icons/bootstrap_icons.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
class SettingScreen extends StatelessWidget {
const SettingScreen({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Setting', style: AppTheme.labelMedium),
centerTitle: true,
backgroundColor: Colors.white,
scrolledUnderElevation: 0,
),
body: SafeArea(
child: ListView(
padding: EdgeInsets.all(16.r),
children: [
Row(
children: [
const CircleAvatar(
radius: 30,
backgroundColor: AppColor.secondary,
child: Icon(BootstrapIcons.person_fill, color: Colors.white),
),
SizedBox(width: 8.w),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('User Name', style: AppTheme.labelMedium),
Text('useremail@gmail.com', style: AppTheme.labelSmall)
],
)
],
),
SizedBox(height: 16.h),
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8.r),
),
child: Column(
children: [
ListTile(
tileColor: Colors.white,
title: Text('Account',
style:
AppTheme.labelSmall.copyWith(color: Colors.black87)),
leading: const Icon(BootstrapIcons.person),
trailing: Icon(
Icons.arrow_forward_ios,
size: 16.r,
),
onTap: () {},
),
ListTile(
tileColor: Colors.white,
title: Text('Kebijakan & privasi',
style:
AppTheme.labelSmall.copyWith(color: Colors.black87)),
leading: const Icon(BootstrapIcons.shield_check),
trailing: Icon(
Icons.arrow_forward_ios,
size: 16.r,
),
onTap: () {},
),
ListTile(
tileColor: Colors.white,
title: Text('Syarat & ketentuan',
style:
AppTheme.labelSmall.copyWith(color: Colors.black87)),
leading: const Icon(BootstrapIcons.file_text),
trailing: Icon(
Icons.arrow_forward_ios,
size: 16.r,
),
onTap: () {},
),
ListTile(
tileColor: Colors.white,
title: Text('Logout',
style: AppTheme.labelSmall.copyWith(color: Colors.red)),
leading: const Icon(
BootstrapIcons.box_arrow_right,
color: Colors.red,
),
trailing: Icon(
Icons.arrow_forward_ios,
size: 16.r,
),
onTap: () {
if (Platform.isAndroid) {
showDialog(
context: context,
builder: (context) => AlertDialog(
title: Text('Logout'),
content: Text('Apakah anda yakin ingin logout?'),
actions: [
TextButton(
child: Text('Batal'),
onPressed: () {
Navigator.pop(context);
},
),
TextButton(
child: Text('Ya'),
onPressed: () {
Navigator.pop(context);
},
),
],
),
);
} else {
showDialog(
context: context,
builder: (context) => CupertinoAlertDialog(
title: Text('Logout'),
content: Text('Apakah anda yakin ingin logout?'),
actions: [
TextButton(
child: Text('Batal'),
onPressed: () {
Navigator.pop(context);
},
),
TextButton(
child: Text('Ya'),
onPressed: () {
Navigator.pop(context);
},
),
],
),
);
}
}),
],
),
),
],
)),
);
}
}

View File

@ -1,3 +1,4 @@
import 'package:agrilink_vocpro/core/constant/app_color.dart';
import 'package:agrilink_vocpro/core/route/app_route.dart';
import 'package:agrilink_vocpro/features/auth/provider/auth_provider.dart';
import 'package:agrilink_vocpro/features/control/provider/control_provider.dart';