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

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

@ -24,160 +24,163 @@ class _TotalPaymentViewState extends State<TotalPaymentView> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container( return SingleChildScrollView(
decoration: BoxDecoration( child: Container(
color: Colors.white, decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16) color: Colors.white, borderRadius: BorderRadius.circular(16)),
), child: Column(
child: Column( mainAxisSize: MainAxisSize.min,
mainAxisSize: MainAxisSize.min, children: [
children: [ Padding(
Padding( padding: const EdgeInsets.all(24.0),
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]!
)
)
),
child: Row( child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [ children: [
Expanded( const Text(
flex: 5, 'Your Investment Today',
child: Text(e.value.name ?? '', style: TextStyle(
style: const TextStyle( color: ColorPalette.slate800,
color: ColorPalette.slate400, fontWeight: FontWeight.w600,
fontWeight: FontWeight.w600, fontSize: 16),
fontSize: 16
),
)
), ),
Expanded( GestureDetector(
flex: 7, onTap: () => Navigator.pop(context),
child: Text( child: const Icon(Icons.close_rounded))
NumberFormatter.numberCurrency(widget.totalInvest * e.value.totalPercent!, 'Rp ', 'id_ID'), ],
textAlign: TextAlign.end, ),
style: const TextStyle( ),
fontWeight: FontWeight.w700, ...widget.listProduct.asMap().entries.map((e) {
fontSize: 18, return Container(
color: ColorPalette.slate800 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(
const SizedBox(height: 16,), 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
),
)
],
), ),
), Container(
buttonAgreement(), color: ColorPalette.slate200.withOpacity(0.5),
Container( padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16), child: Row(
child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
children: [ const Text(
const Text('Total Payment', 'Total',
style: TextStyle( style: TextStyle(
color: ColorPalette.slate400, color: ColorPalette.slate400,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
fontSize: 16 fontSize: 16),
), ),
), Text(
Text(NumberFormatter.numberCurrency(widget.totalInvest, 'Rp ', 'id_ID'), NumberFormatter.numberCurrency(
textAlign: TextAlign.end, widget.totalInvest, 'Rp ', 'id_ID'),
style: const TextStyle( textAlign: TextAlign.end,
fontWeight: FontWeight.w700, style: const TextStyle(
fontSize: 18, fontWeight: FontWeight.w700,
color: ColorPalette.slate800 fontSize: 18,
), color: ColorPalette.slate800),
) )
], ],
),
), ),
), buttonAgreement(),
ButtonView( Container(
disabled: !isAgreement, padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
name: 'Subscribe Now', child: Row(
onPressed: () { mainAxisAlignment: MainAxisAlignment.spaceBetween,
routePush(context, page: PaymentMethodView( children: [
totalInvest: widget.totalInvest, const Text(
)); 'Total Payment',
}, style: TextStyle(
disabledBgColor: ColorPalette.slate200.withOpacity(0.5), color: ColorPalette.slate400,
textColor: isAgreement ? Colors.white : ColorPalette.slate400, fontWeight: FontWeight.w600,
textWeight: FontWeight.w700, fontSize: 16),
textSize: 20, ),
backgroundColor: ColorPalette.primary, 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,50 +208,48 @@ class _TotalPaymentViewState extends State<TotalPaymentView> {
decoration: BoxDecoration( decoration: BoxDecoration(
shape: BoxShape.circle, shape: BoxShape.circle,
border: Border.all( border: Border.all(
color: isAgree ? ColorPalette.primary : ColorPalette.slate200 color: isAgree
) ? ColorPalette.primary
), : ColorPalette.slate200)),
child: AnimatedContainer( child: AnimatedContainer(
duration: const Duration(milliseconds: 200), duration: const Duration(milliseconds: 200),
child: Container( child: Container(
decoration: BoxDecoration( decoration: BoxDecoration(
color: isAgree ? ColorPalette.primary : ColorPalette.white, color:
shape: BoxShape.circle isAgree ? ColorPalette.primary : ColorPalette.white,
), shape: BoxShape.circle),
), ),
), ),
), ),
), ),
const SizedBox(width: 12,), const SizedBox(
width: 12,
),
Expanded( Expanded(
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ 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.', 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( style: TextStyle(
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: ColorPalette.slate400 decoration: TextDecoration.underline,
), color: ColorPalette.primary),
), ))
GestureDetector( ],
onTap: () { ))
},
child: const Text('Read More',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
decoration: TextDecoration.underline,
color: ColorPalette.primary
),
)
)
],
)
)
], ],
), ),
); );
} }
} }

240
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> { class _InvestTypeViewState extends State<InvestTypeView> {
List<Product> listProduct = [ List<Product> listProduct = [
Product(name: 'Gemilang Dana Kas Maxima', type: '', yield: 8.17, priceUnit: 2600.79, funds: 6300000), Product(
Product(name: 'Gemilang Dana Likuid', type: '', yield: 6.42, priceUnit: 1600.79, funds: 2340000), name: 'Gemilang Dana Kas Maxima',
Product(name: 'Gemilang Income Fund', type: '', yield: 8.17, priceUnit: 2600.79, funds: 6300000) 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 @override
@ -36,76 +50,80 @@ class _InvestTypeViewState extends State<InvestTypeView> {
return e; return e;
}).toList(); }).toList();
} }
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return ChangeNotifierProvider<ProductViewModel>( return ChangeNotifierProvider<ProductViewModel>(
create: (context) => ProductViewModel(), create: (context) => ProductViewModel(),
child: Consumer<ProductViewModel>( child: Consumer<ProductViewModel>(builder: (context, provider, child) {
builder: (context, provider, child) { return Scaffold(
return Scaffold( body: SizedBox(
body: SizedBox( width: SizeConfig.width,
width: SizeConfig.width, height: SizeConfig.height,
height: SizeConfig.height, child: Stack(
child: Stack( children: [
children: [ const ImageView(image: PathAssets.imgDashboardAccount),
const ImageView(image: PathAssets.imgDashboardAccount), Column(
Column( children: [
children: [ SizedBox(
const SizedBox( height: SizeConfig.height * .1,
height: 50, ),
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), const SizedBox(
child: Row( height: 24,
mainAxisAlignment: MainAxisAlignment.spaceBetween, ),
children: [ Expanded(
const BackButtonView(), child: Container(
TextTitle(title: widget.title, color: Colors.white),
SizedBox(
width: SizeConfig.width * 0.1,
)
],
),
),
const SizedBox(
height: 24,
),
Container(
padding: const EdgeInsets.all(24), padding: const EdgeInsets.all(24),
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16), borderRadius: BorderRadius.circular(16),
color: Colors.white color: Colors.white),
), child: SingleChildScrollView(
child: Column( scrollDirection: Axis.vertical,
children: [ child: Column(
filters(), children: [
ListView( filters(),
shrinkWrap: true, ListView(
children: listProduct.asMap().entries.map((e) { shrinkWrap: true,
return GestureDetector( children: listProduct.asMap().entries.map((e) {
onTap: () { return GestureDetector(
provider.setSelectedProduct(e.value); onTap: () {
routePush(context, page: ProductView(widget.title)); provider.setSelectedProduct(e.value);
}, routePush(context,
child: Padding( page: ProductView(widget.title));
padding: EdgeInsets.only(top: e.key != 0 ? 24 : 0), },
child: cardProduct(e.value), child: Padding(
), padding: EdgeInsets.only(
); top: e.key != 0 ? 24 : 0),
}).toList(), child: cardProduct(e.value),
) ),
], );
}).toList(),
)
],
),
), ),
), ),
], ),
) ],
], )
), ],
), ),
); ),
} );
), }),
); );
} }
@ -115,9 +133,25 @@ class _InvestTypeViewState extends State<InvestTypeView> {
child: Row( child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [ children: [
segmentFilter(const Icon(Icons.filter_alt_outlined, color: ColorPalette.slate400,), 'Filter', () { }), segmentFilter(
segmentFilter(const RotatedBox(quarterTurns: 1, child: Icon(Icons.compare_arrows, color: ColorPalette.slate400)), 'Sort', () { }), const Icon(
segmentFilter(const Icon(Icons.dashboard_outlined, color: ColorPalette.slate400), 'Compare', () { }), 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) { Widget segmentFilter(Widget leading, String text, void Function()? onTap) {
return GestureDetector( return GestureDetector(
onTap: onTap, onTap: onTap,
child: Container( child: Container(
padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 16), padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 16),
decoration: BoxDecoration( decoration: BoxDecoration(
border: Border.all(color: ColorPalette.slate200), border: Border.all(color: ColorPalette.slate200),
borderRadius: BorderRadius.circular(56) borderRadius: BorderRadius.circular(56)),
),
child: Row( child: Row(
children: [ children: [
leading, leading,
@ -142,9 +175,7 @@ class _InvestTypeViewState extends State<InvestTypeView> {
text, text,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
style: const TextStyle( style: const TextStyle(
color: ColorPalette.slate500, color: ColorPalette.slate500, fontWeight: FontWeight.w700),
fontWeight: FontWeight.w700
),
) )
], ],
), ),
@ -163,7 +194,10 @@ class _InvestTypeViewState extends State<InvestTypeView> {
children: [ children: [
Row( Row(
children: [ children: [
ImageView(image: PathAssets.imgProduct, width: SizeConfig.width * .12,), ImageView(
image: PathAssets.imgProduct,
width: SizeConfig.width * .12,
),
const SizedBox( const SizedBox(
width: 8, width: 8,
), ),
@ -171,9 +205,7 @@ class _InvestTypeViewState extends State<InvestTypeView> {
child: Text( child: Text(
product.name ?? '', product.name ?? '',
style: const TextStyle( style: const TextStyle(
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold, fontSize: 18),
fontSize: 18
),
), ),
) )
], ],
@ -187,36 +219,53 @@ class _InvestTypeViewState extends State<InvestTypeView> {
children: [ children: [
Column( Column(
children: [ children: [
const Text('Yield', style: TextStyle(color: ColorPalette.slate400, fontWeight: FontWeight.w600),), const Text(
'Yield',
style: TextStyle(
color: ColorPalette.slate400,
fontWeight: FontWeight.w600),
),
Row( Row(
children: [ children: [
Text( Text(
'${product.yield.toString()}%', '${product.yield.toString()}%',
style: const TextStyle( style: const TextStyle(
color: ColorPalette.green400, color: ColorPalette.green400,
fontWeight: FontWeight.w600 fontWeight: FontWeight.w600),
),
), ),
const Text('/'), 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( Column(
children: [ 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( Row(
children: [ 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( const SizedBox(
width: 2, width: 2,
), ),
Text( Text(
NumberFormatter.numberCurrency(product.priceUnit, 'Rp', 'id_ID'), NumberFormatter.numberCurrency(
style: const TextStyle( product.priceUnit, 'Rp', 'id_ID'),
fontWeight: FontWeight.w600 style: const TextStyle(fontWeight: FontWeight.w600),
),
), ),
], ],
) )
@ -224,14 +273,18 @@ class _InvestTypeViewState extends State<InvestTypeView> {
), ),
Column( Column(
children: [ 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( Row(
children: [ children: [
Text( Text(
NumberFormatter.compactCurrency(product.funds, 'Rp ', 'id_ID'), NumberFormatter.compactCurrency(
style: const TextStyle( product.funds, 'Rp ', 'id_ID'),
fontWeight: FontWeight.w600 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/core/utils/size_config.dart';
import 'package:cims_apps/features/auth/login/view/login_view.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/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:cims_apps/features/dashboard/dashboard_public/viewmodel/dashboard_public_viewmodel.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
@ -102,7 +103,8 @@ class DashboardPublicView extends StatelessWidget {
width: 26, width: 26,
), ),
onPressed: () { onPressed: () {
provider.loginGoogle(context); // provider.loginGoogle(context);
routePush(context, page: const BottomNavigationView());
}, },
), ),
Row( Row(