Skip to content

Commit 9bfc480

Browse files
nathansdevnathansdev
committed
pagement page fixes
1 parent cb735b0 commit 9bfc480

File tree

9 files changed

+278
-107
lines changed

9 files changed

+278
-107
lines changed

‎assets/icons/logo_visa.svg‎

Lines changed: 3 additions & 0 deletions
Loading

‎lib/custom_widgets/custom_header.dart‎

Lines changed: 28 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'package:contraflutterkit/login/login_text.dart';
2+
import 'package:contraflutterkit/utils/colors.dart';
23
import 'package:flutter/cupertino.dart';
34
import 'package:flutter/material.dart';
45

@@ -8,13 +9,36 @@ class CustomHeader extends StatelessWidget {
89
return Container(
910
padding: EdgeInsets.all(24),
1011
child: Column(
12+
crossAxisAlignment: CrossAxisAlignment.start,
1113
mainAxisSize: MainAxisSize.min,
1214
children: <Widget>[
13-
LoginText(
14-
text: "Saved",
15-
alignment: Alignment.centerLeft,
16-
size: 44,
15+
Stack(
16+
children: <Widget>[
17+
// Stroked text as border.
18+
Text(
19+
'Saved',
20+
style: TextStyle(
21+
fontSize: 44,
22+
fontWeight: FontWeight.w800,
23+
foreground: Paint()
24+
..style = PaintingStyle.stroke
25+
..strokeWidth = 1
26+
..color = wood_smoke,
27+
),
28+
),
29+
// Solid text as fill.
30+
Text(
31+
'Saved',
32+
style: TextStyle(
33+
fontSize: 44, color: white, fontWeight: FontWeight.w800),
34+
),
35+
],
1736
),
37+
// LoginText(
38+
// text: "Saved",
39+
// alignment: Alignment.centerLeft,
40+
// size: 44,
41+
// ),
1842
LoginText(
1943
text: "Payments",
2044
alignment: Alignment.centerLeft,

‎lib/custom_widgets/custom_list_item.dart‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ class CustomListItem extends StatelessWidget {
99
@override
1010
Widget build(BuildContext context) {
1111
return ListView.builder(
12-
padding: EdgeInsets.symmetric(vertical: 16),
12+
padding: EdgeInsets.symmetric(vertical: 24),
1313
shrinkWrap: true,
1414
physics: NeverScrollableScrollPhysics(),
1515
reverse: false,

‎lib/payment/payment_card.dart‎

Lines changed: 56 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,17 @@
1+
import 'dart:math' as math;
2+
13
import 'package:contraflutterkit/payment/payment_type.dart';
24
import 'package:contraflutterkit/utils/colors.dart';
35
import 'package:flutter/cupertino.dart';
46
import 'package:flutter/material.dart';
7+
import 'package:flutter_svg/flutter_svg.dart';
58

69
class PaymentCard extends StatelessWidget {
710
final CardDetail card;
11+
final bool isVertical;
12+
final Color color;
813

9-
const PaymentCard({this.card});
14+
const PaymentCard({this.card, this.isVertical, this.color});
1015

1116
@override
1217
Widget build(BuildContext context) {
@@ -36,21 +41,59 @@ class PaymentCard extends StatelessWidget {
3641
),
3742
Padding(
3843
padding: const EdgeInsets.symmetric(vertical: 16.0),
39-
child: Text(
40-
card.number,
41-
style: TextStyle(
42-
color: white, fontWeight: FontWeight.w800, fontSize: 21),
44+
child: Row(
45+
children: <Widget>[
46+
Container(
47+
margin: EdgeInsets.only(right: 10),
48+
width: 52,
49+
height: 36,
50+
decoration: ShapeDecoration(
51+
color: white,
52+
shape: RoundedRectangleBorder(
53+
borderRadius: BorderRadius.all(Radius.circular(8)))),
54+
),
55+
Text(
56+
card.number,
57+
style: TextStyle(
58+
color: white, fontWeight: FontWeight.w800, fontSize: 21),
59+
),
60+
],
4361
),
4462
),
45-
Text(
46-
"CARD HOLDER",
47-
style: TextStyle(color: white, fontSize: 12),
63+
Row(
64+
mainAxisAlignment: MainAxisAlignment.spaceBetween,
65+
children: <Widget>[
66+
Column(
67+
crossAxisAlignment: CrossAxisAlignment.start,
68+
children: <Widget>[
69+
Text(
70+
"CARD HOLDER",
71+
style: TextStyle(color: white, fontSize: 12),
72+
),
73+
Text(
74+
card.user_name,
75+
style: TextStyle(
76+
color: white,
77+
fontWeight: FontWeight.w800,
78+
fontSize: 21),
79+
)
80+
],
81+
),
82+
Padding(
83+
padding: const EdgeInsets.only(right: 36.0),
84+
child: Transform.rotate(
85+
angle: math.pi / 2,
86+
origin: Offset(0, 0),
87+
child: SvgPicture.asset(
88+
"assets/icons/logo_visa.svg",
89+
color: color,
90+
width: 36,
91+
height: 96,
92+
),
93+
),
94+
)
95+
],
4896
),
49-
Text(
50-
card.user_name,
51-
style: TextStyle(
52-
color: white, fontWeight: FontWeight.w800, fontSize: 21),
53-
)
5497
],
5598
),
5699
);

‎lib/payment/payment_card_item.dart‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,8 @@ class PaymentCartItem extends StatelessWidget {
1313
@override
1414
Widget build(BuildContext context) {
1515
return Container(
16-
margin: EdgeInsets.all(16),
17-
padding: EdgeInsets.all(16),
16+
margin: EdgeInsets.symmetric(horizontal: 24, vertical: 12),
17+
padding: EdgeInsets.all(24),
1818
decoration: ShapeDecoration(
1919
color: bgColor,
2020
shadows: [

‎lib/payment/payment_card_item_big.dart‎

Lines changed: 20 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,17 @@ import 'package:flutter/material.dart';
77

88
class PaymentCartItemBig extends StatelessWidget {
99
final PaymentType type;
10+
final bool isVertical;
1011

11-
const PaymentCartItemBig({this.type});
12+
const PaymentCartItemBig({this.type, this.isVertical});
1213

1314
@override
1415
Widget build(BuildContext context) {
1516
return Container(
16-
margin: EdgeInsets.all(16),
17+
height: isVertical ? MediaQuery.of(context).size.width : 250,
18+
margin: isVertical
19+
? EdgeInsets.symmetric(horizontal: 24, vertical: 12)
20+
: EdgeInsets.only(right: 12, top: 24, bottom: 12),
1721
padding: EdgeInsets.all(24),
1822
decoration: ShapeDecoration(
1923
color: type.color,
@@ -42,9 +46,17 @@ class PaymentCartItemBig extends StatelessWidget {
4246
style: TextStyle(
4347
color: white, fontSize: 44, fontWeight: FontWeight.w800),
4448
),
45-
CustomListItem(
46-
list: type.list,
47-
),
49+
isVertical
50+
? CustomListItem(
51+
list: type.list,
52+
)
53+
: Padding(
54+
padding: const EdgeInsets.symmetric(vertical: 24.0),
55+
child: Text(
56+
"You don’t think you should give some dollar to use our service.",
57+
style: TextStyle(color: white, fontSize: 17),
58+
),
59+
),
4860
ButtonPlainWithShadow(
4961
text: "Select",
5062
height: 48,
@@ -53,6 +65,9 @@ class PaymentCartItemBig extends StatelessWidget {
5365
callback: () {},
5466
textColor: white,
5567
borderColor: wood_smoke,
68+
),
69+
SizedBox(
70+
height: 12,
5671
)
5772
],
5873
),

‎lib/payment/payment_page_one.dart‎

Lines changed: 59 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -75,59 +75,67 @@ class _PaymentPageOneState extends State<PaymentPageOne> {
7575
],
7676
),
7777
),
78-
body: Column(
79-
children: <Widget>[
80-
PaymentCartItem(
81-
bgColor: lightening_yellow,
82-
type: "per month",
83-
price: "\$" + "54",
84-
),
85-
PaymentCartItem(
86-
bgColor: white,
87-
type: "per month",
88-
price: "\$" + "54",
89-
),
90-
PaymentCartItem(
91-
bgColor: lightening_yellow,
92-
type: "per month",
93-
price: "\$" + "54",
94-
),
95-
Container(
96-
margin: EdgeInsets.all(16),
97-
padding: EdgeInsets.all(16),
98-
decoration: ShapeDecoration(
99-
color: bareley_white,
100-
shape: RoundedRectangleBorder(
101-
borderRadius: BorderRadius.all(Radius.circular(16)),
102-
)),
103-
child: Row(
104-
mainAxisAlignment: MainAxisAlignment.spaceBetween,
105-
children: <Widget>[
106-
LoginText(
107-
alignment: Alignment.centerLeft,
108-
size: 21,
109-
text: "Auto renew",
78+
body: SingleChildScrollView(
79+
child: Container(
80+
padding: EdgeInsets.only(top: 12),
81+
child: Column(
82+
children: <Widget>[
83+
PaymentCartItem(
84+
bgColor: lightening_yellow,
85+
type: "per month",
86+
price: "\$" + "54",
87+
),
88+
PaymentCartItem(
89+
bgColor: white,
90+
type: "per month",
91+
price: "\$" + "54",
92+
),
93+
PaymentCartItem(
94+
bgColor: lightening_yellow,
95+
type: "per month",
96+
price: "\$" + "54",
97+
),
98+
Container(
99+
margin: EdgeInsets.symmetric(horizontal: 24, vertical: 12),
100+
padding: EdgeInsets.all(24),
101+
decoration: ShapeDecoration(
102+
color: bareley_white,
103+
shape: RoundedRectangleBorder(
104+
borderRadius: BorderRadius.all(Radius.circular(16)),
105+
)),
106+
child: Row(
107+
mainAxisAlignment: MainAxisAlignment.spaceBetween,
108+
children: <Widget>[
109+
LoginText(
110+
alignment: Alignment.centerLeft,
111+
size: 21,
112+
text: "Auto renew",
113+
),
114+
Switch(
115+
value: isChanged,
116+
onChanged: onChanged,
117+
activeColor: lightening_yellow,
118+
inactiveTrackColor: selago,
119+
inactiveThumbColor: white,
120+
)
121+
],
110122
),
111-
Switch(
112-
value: isChanged,
113-
onChanged: onChanged,
114-
)
115-
],
116-
),
123+
),
124+
Padding(
125+
padding: const EdgeInsets.all(24.0),
126+
child: ButtonPlainWithShadow(
127+
text: "Subscribe now",
128+
height: 48,
129+
shadowColor: wood_smoke,
130+
color: wood_smoke,
131+
callback: () {},
132+
textColor: white,
133+
borderColor: wood_smoke,
134+
),
135+
)
136+
],
117137
),
118-
Padding(
119-
padding: const EdgeInsets.all(16.0),
120-
child: ButtonPlainWithShadow(
121-
text: "Subscribe now",
122-
height: 48,
123-
shadowColor: wood_smoke,
124-
color: wood_smoke,
125-
callback: () {},
126-
textColor: white,
127-
borderColor: wood_smoke,
128-
),
129-
)
130-
],
138+
),
131139
),
132140
);
133141
}

0 commit comments

Comments
 (0)