Skip to content

D
Dolan SelfService Topup
Commit e186364d authored by Izol's avatar Izol
Browse files
Options

#3

parent 64124429
Hide whitespace changes
Inline Side-by-side
Showing with 249 additions and 231 deletions
lib/ui/pages/home_page.dart
View file @ e186364d
...@@ -4,6 +4,7 @@ import 'dart:convert'; ...@@ -4,6 +4,7 @@ import 'dart:convert';
import 'dart:async'; import 'dart:async';
import 'dart:io'; import 'dart:io';
import 'dart:math'; import 'dart:math';
import 'dart:ui';
import 'package:awesome_dialog/awesome_dialog.dart'; import 'package:awesome_dialog/awesome_dialog.dart';
import 'package:otp_text_field/otp_field.dart'; import 'package:otp_text_field/otp_field.dart';
...@@ -1273,213 +1274,182 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback { ...@@ -1273,213 +1274,182 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback {
return StatefulBuilder(builder: (context, StateSetter setState) { return StatefulBuilder(builder: (context, StateSetter setState) {
return Container( return Container(
decoration: BoxDecoration( decoration: BoxDecoration(
image: const DecorationImage( color: lightBackgroundColor
fit: BoxFit.cover, ),
image: AssetImage( child: Stack(
'assets/img_bg_card.png', children: [
BackdropFilter(
filter: ImageFilter.blur(sigmaX: 5, sigmaY: 5),
child: Container(
color: Colors.black.withOpacity(0.2),
),
), ),
), ), Center(
child:Center( child: SingleChildScrollView(
child: SingleChildScrollView( child: AlertDialog(
child: AlertDialog( backgroundColor: lightBackgroundColor,
backgroundColor: lightBackgroundColor, title: Container(
title: Container( padding: const EdgeInsets.symmetric(
padding: const EdgeInsets.symmetric( horizontal: 20, vertical: 20),
horizontal: 20, vertical: 20), decoration: BoxDecoration(
decoration: BoxDecoration( borderRadius: BorderRadius.circular(28),
borderRadius: BorderRadius.circular(0), image: const DecorationImage(
image: const DecorationImage( fit: BoxFit.cover,
fit: BoxFit.cover, image: AssetImage(
image: AssetImage( 'assets/img_bg_card.png',
'assets/img_bg_card.png', ),
), ),
), ),
), width: 1100,
width: 1200, margin:
margin: const EdgeInsets.symmetric(vertical: 10, horizontal: 0),
const EdgeInsets.symmetric(vertical: 10, horizontal: 0), child: Row(
child: Row( children: [
children: [ Align(
Align( alignment: Alignment.topLeft,
alignment: Alignment.topLeft, child: GestureDetector(
child: GestureDetector( onTap: () {
onTap: () { Navigator.pop(context);
Navigator.pop(context); setState(() {
setState(() { isShowingDialog = false;
isShowingDialog = false; });
}); if (timer != null) timer?.cancel();
if (timer != null) timer?.cancel(); tapIdle();
tapIdle(); },
}, child: Icon(
child: Icon( Icons.arrow_back,
Icons.arrow_back, size: 32,
size: 32, color: lightBackgroundColor,
color: lightBackgroundColor, ),
), ),
), ),
), SizedBox(
SizedBox( width: 400,
width: 480,
),
Text(
'Isi Ulang Saldo',
style: blackTextStyle.copyWith(
fontSize: 25,
color: Colors.white,
fontWeight: bold,
letterSpacing: 2,
), ),
textAlign: TextAlign.center, Text(
), 'Isi Ulang Saldo',
], style: blackTextStyle.copyWith(
fontSize: 25,
color: Colors.white,
fontWeight: bold,
letterSpacing: 2,
),
textAlign: TextAlign.center,
),
],
),
), ),
), content: Container (
content: Container ( child: ListBody(
child: ListBody(
children: <Widget>[ children: <Widget>[
Column( Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Center( Center(
child: Text( child: Text(
'topup balance', 'topup balance',
style: greyTextStyle.copyWith(
fontSize: 15,
fontStyle: FontStyle.italic,
fontWeight: light,
),
),
),
Text(
'Pilih nominal isi ulang',
style: blackTextStyle.copyWith(
fontSize: 20,
fontWeight: bold,
),
),
Text(
'Choose topup amount',
style: greyTextStyle.copyWith( style: greyTextStyle.copyWith(
fontSize: 15, fontSize: 15,
fontStyle: FontStyle.italic, fontStyle: FontStyle.italic,
fontWeight: light, fontWeight: light,
), ),
), ),
SizedBox( ),
height: 20, Text(
'Pilih nominal isi ulang',
style: blackTextStyle.copyWith(
fontSize: 20,
fontWeight: bold,
), ),
Row( ),
children: [ Text(
Expanded( 'Choose topup amount',
child: GestureDetector( style: greyTextStyle.copyWith(
onTap: () { fontSize: 15,
if (timer != null) timer?.cancel(); fontStyle: FontStyle.italic,
tapIdle(); fontWeight: light,
),
),
SizedBox(
height: 20,
),
Row(
children: [
Expanded(
child: GestureDetector(
onTap: () {
if (timer != null) timer?.cancel();
tapIdle();
if (mounted) { if (mounted) {
setState(() { setState(() {
amountController!.text = cTopUp1; amountController!.text = cTopUp1;
}); });
} }
}, },
child: Container( child: Container(
padding: padding:
EdgeInsets.symmetric(vertical: 15), EdgeInsets.symmetric(vertical: 15),
decoration: BoxDecoration( decoration: BoxDecoration(
border: Border.all( border: Border.all(
color: amountController!.text == color: amountController!.text ==
cTopUp1 cTopUp1
? purpleColor ? purpleColor
: Colors.black12), : Colors.black12),
borderRadius: BorderRadius.circular(7), borderRadius: BorderRadius.circular(7),
),
child: Center(
child: Text("50,000",
style: blackTextStyle.copyWith(
fontSize: 25,
fontWeight: bold,
)),
),
), ),
)), child: Center(
SizedBox( child: Text("50,000",
width: 10, style: blackTextStyle.copyWith(
), fontSize: 25,
Expanded( fontWeight: bold,
child: GestureDetector( )),
onTap: () {
if (timer != null) timer?.cancel();
tapIdle();
if (mounted) {
setState(() {
amountController!.text = cTopUp2;
});
}
},
child: Container(
padding:
EdgeInsets.symmetric(vertical: 15),
decoration: BoxDecoration(
border: Border.all(
color: (amountController!.text ==
cTopUp2)
? Color(0xff005DAC)
: Colors.black12),
borderRadius: BorderRadius.circular(7),
),
child: Center(
child: Text("150,000",
style: blackTextStyle.copyWith(
fontSize: 25,
fontWeight: bold,
)),
),
), ),
)) ),
], )),
), SizedBox(
SizedBox( width: 10,
height: 10, ),
), Expanded(
Row( child: GestureDetector(
children: [ onTap: () {
Expanded( if (timer != null) timer?.cancel();
child: GestureDetector( tapIdle();
onTap: () {
if (timer != null) timer?.cancel();
tapIdle();
if (mounted) { if (mounted) {
setState(() { setState(() {
amountController!.text = cTopUp3; amountController!.text = cTopUp2;
}); });
} }
}, },
child: Container( child: Container(
padding: padding:
EdgeInsets.symmetric(vertical: 15), EdgeInsets.symmetric(vertical: 15),
decoration: BoxDecoration( decoration: BoxDecoration(
border: Border.all( border: Border.all(
color: (amountController!.text == color: (amountController!.text ==
cTopUp3) cTopUp2)
? Color(0xff005DAC) ? Color(0xff005DAC)
: Colors.black12), : Colors.black12),
borderRadius: BorderRadius.circular(7), borderRadius: BorderRadius.circular(7),
),
child: Center(
child: Text("100,000",
style: blackTextStyle.copyWith(
fontSize: 25,
fontWeight: bold,
)),
),
), ),
)), child: Center(
SizedBox( child: Text("150,000",
width: 10, style: blackTextStyle.copyWith(
), fontSize: 25,
Expanded( fontWeight: bold,
)),
),
),
))
],
),
SizedBox(
height: 10,
),
Row(
children: [
Expanded(
child: GestureDetector( child: GestureDetector(
onTap: () { onTap: () {
if (timer != null) timer?.cancel(); if (timer != null) timer?.cancel();
...@@ -1487,7 +1457,7 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback { ...@@ -1487,7 +1457,7 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback {
if (mounted) { if (mounted) {
setState(() { setState(() {
amountController!.text = cTopUp4; amountController!.text = cTopUp3;
}); });
} }
}, },
...@@ -1497,26 +1467,61 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback { ...@@ -1497,26 +1467,61 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback {
decoration: BoxDecoration( decoration: BoxDecoration(
border: Border.all( border: Border.all(
color: (amountController!.text == color: (amountController!.text ==
cTopUp4) cTopUp3)
? Color(0xff005DAC) ? Color(0xff005DAC)
: Colors.black12), : Colors.black12),
borderRadius: borderRadius: BorderRadius.circular(7),
BorderRadius.circular(7),
), ),
child: Center( child: Center(
child: Text("200,000", child: Text("100,000",
style: blackTextStyle.copyWith( style: blackTextStyle.copyWith(
fontSize: 25, fontSize: 25,
fontWeight: bold, fontWeight: bold,
)), )),
), ),
), ),
)),
SizedBox(
width: 10,
),
Expanded(
child: GestureDetector(
onTap: () {
if (timer != null) timer?.cancel();
tapIdle();
if (mounted) {
setState(() {
amountController!.text = cTopUp4;
});
}
},
child: Container(
padding:
EdgeInsets.symmetric(vertical: 15),
decoration: BoxDecoration(
border: Border.all(
color: (amountController!.text ==
cTopUp4)
? Color(0xff005DAC)
: Colors.black12),
borderRadius:
BorderRadius.circular(7),
),
child: Center(
child: Text("200,000",
style: blackTextStyle.copyWith(
fontSize: 25,
fontWeight: bold,
)),
),
), ),
), ),
], ),
), ],
], ),
), ],
),
Container( Container(
margin: EdgeInsets.only(top: 30), margin: EdgeInsets.only(top: 30),
padding: EdgeInsets.symmetric(horizontal: 17), padding: EdgeInsets.symmetric(horizontal: 17),
...@@ -1626,11 +1631,13 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback { ...@@ -1626,11 +1631,13 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback {
), ),
], ],
), ),
), ),
),
), ),
), ),
), ],
),
); );
}); });
}); });
...@@ -1664,20 +1671,11 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback { ...@@ -1664,20 +1671,11 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback {
} }
}); });
return Container( return Container(
width: 1000,
height: 800,
padding: padding:
const EdgeInsets.symmetric(horizontal: 150, vertical: 30), const EdgeInsets.symmetric(horizontal: 150, vertical: 30),
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(28), borderRadius: BorderRadius.circular(28),
boxShadow: [ color:lightBackgroundColor,
BoxShadow(
color: Colors.grey.withOpacity(0.3), //color of shadow
spreadRadius: 3, //spread radius
blurRadius: 7, // blur radius
offset: Offset(3, 3), // changes position of shadow
),
],
), ),
child: Scaffold( child: Scaffold(
body: Column(children: [ body: Column(children: [
...@@ -2155,7 +2153,7 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback { ...@@ -2155,7 +2153,7 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback {
), ),
TimerBuilder.periodic(Duration(seconds: 1), builder: (context) { TimerBuilder.periodic(Duration(seconds: 1), builder: (context) {
// print("${getSystemTime()}"); // print("${getSystemTime()}");
return Column( return Row(
children: [ children: [
Text( Text(
"${getSystemTime()}", "${getSystemTime()}",
...@@ -2165,14 +2163,6 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback { ...@@ -2165,14 +2163,6 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback {
fontWeight: bold, fontWeight: bold,
), ),
), ),
Text(
"${getDate()}",
style: TextStyle(
color: darkBackgroundColor,
fontSize: 17,
fontWeight: semiBold,
),
),
], ],
); );
}), }),
...@@ -2418,7 +2408,7 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback { ...@@ -2418,7 +2408,7 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback {
), ),
Positioned( Positioned(
bottom: 36, bottom: 36,
left: 60, left: 0,
child: Row( child: Row(
children: [ children: [
Container( Container(
...@@ -2429,26 +2419,54 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback { ...@@ -2429,26 +2419,54 @@ class _HomePageState extends State<HomePage> implements AlertDialogCallback {
width: 12, width: 12,
height: 12, height: 12,
), ),
// SizedBox(width: 4), // add some space between the color and text
// Text(
// '${_downloadSpeed.toStringAsFixed(2)} KB/s',
// style: TextStyle(fontSize: 12, color: Colors.grey),
// ),
], ],
), ),
), ),
// Positioned(
// bottom: 20,
// left: 0,
// child: Ink(
// decoration: ShapeDecoration(
// color: Colors.white,
// shape: CircleBorder(),
// ),
// child: InkWell(
// borderRadius: BorderRadius.circular(1000.0),
// onTap: () {
// // aksi yang ingin dilakukan ketika tombol ditekan
// },
// child: Padding(
// padding: const EdgeInsets.all(8.0),
// child: Icon(Icons.settings, size: 28,),
// ),
// ),
// ),
// ),
Positioned( Positioned(
bottom: 20, bottom: 30,
left: 0, left: 30,
child: IconButton( child: Row(
icon: Icon(Icons.settings), children: [
onPressed: () { TimerBuilder.periodic(Duration(seconds: 1), builder: (context) {
// aksi yang ingin dilakukan ketika tombol ditekan // print("${getSystemTime()}");
}, return Row(
children: [
Text(
"${getDate()}",
style: TextStyle(
color: darkBackgroundColor,
fontSize: 15,
fontWeight: semiBold,
),
),
],
);
}),
],
), ),
), ),
Column( Column(
crossAxisAlignment: CrossAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center,
children: [ children: [
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment