nugrohob825/cims_apps
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: widget overflow

Browse Source
This commit is contained in:
Dian Bayu Nugroho 2024-02-20 15:14:25 +07:00
parent 9761dc369c
commit dfb947dce5
3 changed files with 323 additions and 268 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

345
lib/application/component/subscribe/total_payment_view.dart
View File

@ -24,160 +24,163 @@ class _TotalPaymentViewState extends State<TotalPaymentView> {
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(16)
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Padding(
padding: const EdgeInsets.all(24.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text('Your Investment Today',
style: TextStyle(
color: ColorPalette.slate800,
fontWeight: FontWeight.w600,
fontSize: 16
),
),
GestureDetector(
onTap: () => Navigator.pop(context),
child: const Icon(Icons.close_rounded)
)
],
),
),
...widget.listProduct.asMap().entries.map((e) {
return Container(
padding: const EdgeInsets.only(left: 16, right: 24, bottom: 16, top: 16),
decoration: BoxDecoration(
border: Border(
left: BorderSide(
width: 8,
color: ColorPalette.investTypeColor[e.value.type]!
)
)
),
return SingleChildScrollView(
child: Container(
decoration: BoxDecoration(
color: Colors.white, borderRadius: BorderRadius.circular(16)),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Padding(
padding: const EdgeInsets.all(24.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
flex: 5,
child: Text(e.value.name ?? '',
style: const TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600,
fontSize: 16
),
)
const Text(
'Your Investment Today',
style: TextStyle(
color: ColorPalette.slate800,
fontWeight: FontWeight.w600,
fontSize: 16),
),
Expanded(
flex: 7,
child: Text(
NumberFormatter.numberCurrency(widget.totalInvest * e.value.totalPercent!, 'Rp ', 'id_ID'),
textAlign: TextAlign.end,
style: const TextStyle(
fontWeight: FontWeight.w700,
fontSize: 18,
color: ColorPalette.slate800
),
)
GestureDetector(
onTap: () => Navigator.pop(context),
child: const Icon(Icons.close_rounded))
],
),
),
...widget.listProduct.asMap().entries.map((e) {
return Container(
padding: const EdgeInsets.only(
left: 16, right: 24, bottom: 16, top: 16),
decoration: BoxDecoration(
border: Border(
left: BorderSide(
width: 8,
color:
ColorPalette.investTypeColor[e.value.type]!))),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
flex: 5,
child: Text(
e.value.name ?? '',
style: const TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600,
fontSize: 16),
)),
Expanded(
flex: 7,
child: Text(
NumberFormatter.numberCurrency(
widget.totalInvest * e.value.totalPercent!,
'Rp ',
'id_ID'),
textAlign: TextAlign.end,
style: const TextStyle(
fontWeight: FontWeight.w700,
fontSize: 18,
color: ColorPalette.slate800),
))
],
),
);
}).toList(),
const SizedBox(height: 16),
const Padding(
padding: EdgeInsets.symmetric(horizontal: 24),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Purchase Commission',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600,
fontSize: 16),
),
Text(
'Free',
style: TextStyle(
color: ColorPalette.primary,
fontSize: 18,
fontWeight: FontWeight.w700),
)
],
),
);
}).toList(),
const SizedBox(height: 16),
const Padding(
padding: EdgeInsets.symmetric(horizontal: 24),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text('Purchase Commission',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600,
fontSize: 16
),
),
Text('Free',
style: TextStyle(
color: ColorPalette.primary,
fontSize: 18,
fontWeight: FontWeight.w700
),
)
],
),
),
const SizedBox(height: 16,),
Container(
color: ColorPalette.slate200.withOpacity(0.5),
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text('Total',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600,
fontSize: 16
),
),
Text(NumberFormatter.numberCurrency(widget.totalInvest, 'Rp ', 'id_ID'),
textAlign: TextAlign.end,
style: const TextStyle(
fontWeight: FontWeight.w700,
fontSize: 18,
color: ColorPalette.slate800
),
)
],
const SizedBox(
height: 16,
),
),
buttonAgreement(),
Container(
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text('Total Payment',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600,
fontSize: 16
Container(
color: ColorPalette.slate200.withOpacity(0.5),
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text(
'Total',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600,
fontSize: 16),
),
),
Text(NumberFormatter.numberCurrency(widget.totalInvest, 'Rp ', 'id_ID'),
textAlign: TextAlign.end,
style: const TextStyle(
fontWeight: FontWeight.w700,
fontSize: 18,
color: ColorPalette.slate800
),
)
],
Text(
NumberFormatter.numberCurrency(
widget.totalInvest, 'Rp ', 'id_ID'),
textAlign: TextAlign.end,
style: const TextStyle(
fontWeight: FontWeight.w700,
fontSize: 18,
color: ColorPalette.slate800),
)
],
),
),
),
ButtonView(
disabled: !isAgreement,
name: 'Subscribe Now',
onPressed: () {
routePush(context, page: PaymentMethodView(
totalInvest: widget.totalInvest,
));
},
disabledBgColor: ColorPalette.slate200.withOpacity(0.5),
textColor: isAgreement ? Colors.white : ColorPalette.slate400,
textWeight: FontWeight.w700,
textSize: 20,
backgroundColor: ColorPalette.primary,
)
],
buttonAgreement(),
Container(
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text(
'Total Payment',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600,
fontSize: 16),
),
Text(
NumberFormatter.numberCurrency(
widget.totalInvest, 'Rp ', 'id_ID'),
textAlign: TextAlign.end,
style: const TextStyle(
fontWeight: FontWeight.w700,
fontSize: 18,
color: ColorPalette.slate800),
)
],
),
),
ButtonView(
disabled: !isAgreement,
name: 'Subscribe Now',
onPressed: () {
routePush(context,
page: PaymentMethodView(
totalInvest: widget.totalInvest,
));
},
disabledBgColor: ColorPalette.slate200.withOpacity(0.5),
textColor: isAgreement ? Colors.white : ColorPalette.slate400,
textWeight: FontWeight.w700,
textSize: 20,
backgroundColor: ColorPalette.primary,
)
],
),
),
);
}
@ -205,48 +208,46 @@ class _TotalPaymentViewState extends State<TotalPaymentView> {
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(
color: isAgree ? ColorPalette.primary : ColorPalette.slate200
)
),
color: isAgree
? ColorPalette.primary
: ColorPalette.slate200)),
child: AnimatedContainer(
duration: const Duration(milliseconds: 200),
child: Container(
decoration: BoxDecoration(
color: isAgree ? ColorPalette.primary : ColorPalette.white,
shape: BoxShape.circle
),
color:
isAgree ? ColorPalette.primary : ColorPalette.white,
shape: BoxShape.circle),
),
),
),
),
const SizedBox(width: 12,),
const SizedBox(
width: 12,
),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text('I agree to buy the mutual fund on this page and have read and agreed to all the contents of the Prospectus and summary information and understand the risks of my investment decision.',
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'I agree to buy the mutual fund on this page and have read and agreed to all the contents of the Prospectus and summary information and understand the risks of my investment decision.',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
color: ColorPalette.slate400),
),
GestureDetector(
onTap: () {},
child: const Text(
'Read More',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
color: ColorPalette.slate400
),
),
GestureDetector(
onTap: () {
},
child: const Text('Read More',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
decoration: TextDecoration.underline,
color: ColorPalette.primary
),
)
)
],
)
)
decoration: TextDecoration.underline,
color: ColorPalette.primary),
))
],
))
],
),
);

238
lib/features/dashboard/dashboard_account/view/invest_type/invest_type_view.dart
View File

@ -20,11 +20,25 @@ class InvestTypeView extends StatefulWidget {
}
class _InvestTypeViewState extends State<InvestTypeView> {
List<Product> listProduct = [
Product(name: 'Gemilang Dana Kas Maxima', type: '', yield: 8.17, priceUnit: 2600.79, funds: 6300000),
Product(name: 'Gemilang Dana Likuid', type: '', yield: 6.42, priceUnit: 1600.79, funds: 2340000),
Product(name: 'Gemilang Income Fund', type: '', yield: 8.17, priceUnit: 2600.79, funds: 6300000)
Product(
name: 'Gemilang Dana Kas Maxima',
type: '',
yield: 8.17,
priceUnit: 2600.79,
funds: 6300000),
Product(
name: 'Gemilang Dana Likuid',
type: '',
yield: 6.42,
priceUnit: 1600.79,
funds: 2340000),
Product(
name: 'Gemilang Income Fund',
type: '',
yield: 8.17,
priceUnit: 2600.79,
funds: 6300000)
];
@override
@ -41,71 +55,75 @@ class _InvestTypeViewState extends State<InvestTypeView> {
Widget build(BuildContext context) {
return ChangeNotifierProvider<ProductViewModel>(
create: (context) => ProductViewModel(),
child: Consumer<ProductViewModel>(
builder: (context, provider, child) {
return Scaffold(
body: SizedBox(
width: SizeConfig.width,
height: SizeConfig.height,
child: Stack(
children: [
const ImageView(image: PathAssets.imgDashboardAccount),
Column(
children: [
const SizedBox(
height: 50,
child: Consumer<ProductViewModel>(builder: (context, provider, child) {
return Scaffold(
body: SizedBox(
width: SizeConfig.width,
height: SizeConfig.height,
child: Stack(
children: [
const ImageView(image: PathAssets.imgDashboardAccount),
Column(
children: [
SizedBox(
height: SizeConfig.height * .1,
),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 24),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const BackButtonView(),
TextTitle(title: widget.title, color: Colors.white),
SizedBox(
width: SizeConfig.width * 0.1,
)
],
),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 24),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const BackButtonView(),
TextTitle(title: widget.title, color: Colors.white),
SizedBox(
width: SizeConfig.width * 0.1,
)
],
),
),
const SizedBox(
height: 24,
),
Container(
),
const SizedBox(
height: 24,
),
Expanded(
child: Container(
padding: const EdgeInsets.all(24),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
color: Colors.white
),
child: Column(
children: [
filters(),
ListView(
shrinkWrap: true,
children: listProduct.asMap().entries.map((e) {
return GestureDetector(
onTap: () {
provider.setSelectedProduct(e.value);
routePush(context, page: ProductView(widget.title));
},
child: Padding(
padding: EdgeInsets.only(top: e.key != 0 ? 24 : 0),
child: cardProduct(e.value),
),
);
}).toList(),
)
],
borderRadius: BorderRadius.circular(16),
color: Colors.white),
child: SingleChildScrollView(
scrollDirection: Axis.vertical,
child: Column(
children: [
filters(),
ListView(
shrinkWrap: true,
children: listProduct.asMap().entries.map((e) {
return GestureDetector(
onTap: () {
provider.setSelectedProduct(e.value);
routePush(context,
page: ProductView(widget.title));
},
child: Padding(
padding: EdgeInsets.only(
top: e.key != 0 ? 24 : 0),
child: cardProduct(e.value),
),
);
}).toList(),
)
],
),
),
),
],
)
],
),
),
],
)
],
),
);
}
),
),
);
}),
);
}
@ -115,9 +133,25 @@ class _InvestTypeViewState extends State<InvestTypeView> {
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
segmentFilter(const Icon(Icons.filter_alt_outlined, color: ColorPalette.slate400,), 'Filter', () { }),
segmentFilter(const RotatedBox(quarterTurns: 1, child: Icon(Icons.compare_arrows, color: ColorPalette.slate400)), 'Sort', () { }),
segmentFilter(const Icon(Icons.dashboard_outlined, color: ColorPalette.slate400), 'Compare', () { }),
segmentFilter(
const Icon(
Icons.filter_alt_outlined,
color: ColorPalette.slate400,
),
'Filter',
() {}),
segmentFilter(
const RotatedBox(
quarterTurns: 1,
child:
Icon(Icons.compare_arrows, color: ColorPalette.slate400)),
'Sort',
() {}),
segmentFilter(
const Icon(Icons.dashboard_outlined,
color: ColorPalette.slate400),
'Compare',
() {}),
],
),
);
@ -126,12 +160,11 @@ class _InvestTypeViewState extends State<InvestTypeView> {
Widget segmentFilter(Widget leading, String text, void Function()? onTap) {
return GestureDetector(
onTap: onTap,
child: Container(
child: Container(
padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 16),
decoration: BoxDecoration(
border: Border.all(color: ColorPalette.slate200),
borderRadius: BorderRadius.circular(56)
),
borderRadius: BorderRadius.circular(56)),
child: Row(
children: [
leading,
@ -142,9 +175,7 @@ class _InvestTypeViewState extends State<InvestTypeView> {
text,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
color: ColorPalette.slate500,
fontWeight: FontWeight.w700
),
color: ColorPalette.slate500, fontWeight: FontWeight.w700),
)
],
),
@ -163,7 +194,10 @@ class _InvestTypeViewState extends State<InvestTypeView> {
children: [
Row(
children: [
ImageView(image: PathAssets.imgProduct, width: SizeConfig.width * .12,),
ImageView(
image: PathAssets.imgProduct,
width: SizeConfig.width * .12,
),
const SizedBox(
width: 8,
),
@ -171,9 +205,7 @@ class _InvestTypeViewState extends State<InvestTypeView> {
child: Text(
product.name ?? '',
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 18
),
fontWeight: FontWeight.bold, fontSize: 18),
),
)
],
@ -187,36 +219,53 @@ class _InvestTypeViewState extends State<InvestTypeView> {
children: [
Column(
children: [
const Text('Yield', style: TextStyle(color: ColorPalette.slate400, fontWeight: FontWeight.w600),),
const Text(
'Yield',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600),
),
Row(
children: [
Text(
'${product.yield.toString()}%',
style: const TextStyle(
color: ColorPalette.green400,
fontWeight: FontWeight.w600
),
color: ColorPalette.green400,
fontWeight: FontWeight.w600),
),
const Text('/'),
const Text('3year', style: TextStyle(color: ColorPalette.slate400, fontWeight: FontWeight.w600),)
const Text(
'3year',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600),
)
],
)
],
),
Column(
children: [
const Text('Price/unit', style: TextStyle(color: ColorPalette.slate400, fontWeight: FontWeight.w600),),
const Text(
'Price/unit',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600),
),
Row(
children: [
const Icon(Icons.trending_up_outlined, size: 18, color: ColorPalette.green400,),
const Icon(
Icons.trending_up_outlined,
size: 18,
color: ColorPalette.green400,
),
const SizedBox(
width: 2,
),
Text(
NumberFormatter.numberCurrency(product.priceUnit, 'Rp', 'id_ID'),
style: const TextStyle(
fontWeight: FontWeight.w600
),
NumberFormatter.numberCurrency(
product.priceUnit, 'Rp', 'id_ID'),
style: const TextStyle(fontWeight: FontWeight.w600),
),
],
)
@ -224,14 +273,18 @@ class _InvestTypeViewState extends State<InvestTypeView> {
),
Column(
children: [
const Text('Managed funds', style: TextStyle(color: ColorPalette.slate400, fontWeight: FontWeight.w600),),
const Text(
'Managed funds',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600),
),
Row(
children: [
Text(
NumberFormatter.compactCurrency(product.funds, 'Rp ', 'id_ID'),
style: const TextStyle(
fontWeight: FontWeight.w600
),
NumberFormatter.compactCurrency(
product.funds, 'Rp ', 'id_ID'),
style: const TextStyle(fontWeight: FontWeight.w600),
),
],
)
@ -243,5 +296,4 @@ class _InvestTypeViewState extends State<InvestTypeView> {
),
);
}
}

4
lib/features/dashboard/dashboard_public/view/dashboard_public_view.dart
View File

@ -6,6 +6,7 @@ import 'package:cims_apps/core/route/route.dart';
import 'package:cims_apps/core/utils/size_config.dart';
import 'package:cims_apps/features/auth/login/view/login_view.dart';
import 'package:cims_apps/features/auth/registration/view/registration_view.dart';
import 'package:cims_apps/features/bottom_navigation_view.dart';
import 'package:cims_apps/features/dashboard/dashboard_public/viewmodel/dashboard_public_viewmodel.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
@ -102,7 +103,8 @@ class DashboardPublicView extends StatelessWidget {
width: 26,
),
onPressed: () {
provider.loginGoogle(context);
// provider.loginGoogle(context);
routePush(context, page: const BottomNavigationView());
},
),
Row(