axiom-team
/
gecko
6
1
Fork 1
Code Issues Pull Requests Projects Releases 11 Wiki Activity

Add last onboarding screen, fix few stuff about wallet unlocking

This commit is contained in:
poka 2021-03-06 22:26:30 +01:00
parent 47f27d2342
commit 5e53977508
7 changed files with 237 additions and 176 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/onBoarding/GIF.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 115 KiB

BIN
assets/onBoarding/gecko-clin.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 MiB

4
lib/main.dart
View File

@ -11,6 +11,7 @@ import 'package:gecko/models/walletOptions.dart';
import 'package:gecko/screens/home.dart'; import 'package:gecko/screens/home.dart';
import 'package:flutter/cupertino.dart'; import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:gecko/screens/myWallets/walletsHome.dart';
import 'package:graphql_flutter/graphql_flutter.dart'; import 'package:graphql_flutter/graphql_flutter.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
import 'package:flutter/foundation.dart'; import 'package:flutter/foundation.dart';
@ -130,6 +131,9 @@ class Gecko extends StatelessWidget {
), ),
home: HomeScreen(), home: HomeScreen(),
initialRoute: "/", initialRoute: "/",
routes: {
'/mywallets': (context) => WalletsHome(),
},
), ),
)); ));
} }

93
lib/screens/commonElements.dart
View File

@ -1,10 +1,5 @@
import 'dart:async';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:bubble/bubble.dart'; import 'package:bubble/bubble.dart';
import 'package:gecko/models/walletOptions.dart';
import 'package:pin_code_fields/pin_code_fields.dart';
import 'package:provider/provider.dart';
class CommonElements { class CommonElements {
// Exemple de Widget // Exemple de Widget
@ -119,94 +114,6 @@ class CommonElements {
), ),
); );
} }
Widget pinForm(context, _pinLenght, int _walletNbr, int _derivation) {
final formKey = GlobalKey<FormState>();
bool hasError = false;
var pinColor = Color(0xffF9F9F1);
// var _walletPin = '';
// ignore: close_sinks
StreamController<ErrorAnimationType> errorController =
StreamController<ErrorAnimationType>();
TextEditingController _enterPin = TextEditingController();
WalletOptionsProvider _walletOptions =
Provider.of<WalletOptionsProvider>(context);
return Form(
key: formKey,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0, horizontal: 30),
child: PinCodeTextField(
autoFocus: true,
appContext: context,
pastedTextStyle: TextStyle(
color: Colors.green.shade600,
fontWeight: FontWeight.bold,
),
length: _pinLenght,
obscureText: false,
obscuringCharacter: '*',
animationType: AnimationType.fade,
validator: (v) {
if (v.length < _pinLenght) {
return "Votre code PIN fait $_pinLenght caractères";
} else {
return null;
}
},
pinTheme: PinTheme(
shape: PinCodeFieldShape.box,
borderRadius: BorderRadius.circular(5),
fieldHeight: 60,
fieldWidth: 50,
activeFillColor: hasError ? Colors.orange : Colors.white,
),
cursorColor: Colors.black,
animationDuration: Duration(milliseconds: 300),
textStyle: TextStyle(fontSize: 20, height: 1.6),
backgroundColor: pinColor,
enableActiveFill: false,
errorAnimationController: errorController,
controller: _enterPin,
keyboardType: TextInputType.text,
boxShadows: [
BoxShadow(
offset: Offset(0, 1),
color: Colors.black12,
blurRadius: 10,
)
],
onCompleted: (_pin) async {
print("Completed");
final resultWallet = await _walletOptions.readLocalWallet(
_walletNbr, _pin.toUpperCase(), _pinLenght, _derivation);
if (resultWallet == 'bad') {
errorController.add(ErrorAnimationType
.shake); // Triggering error shake animation
hasError = true;
pinColor = Colors.red[200];
// notifyListeners();
} else {
pinColor = Colors.green[200];
// setState(() {});
// await Future.delayed(Duration(milliseconds: 50));
// _walletPin = _pin.toUpperCase();
// isWalletUnlock = true;
// notifyListeners();
}
},
onChanged: (value) {
if (pinColor != Color(0xffF9F9F1)) {
pinColor = Color(0xffF9F9F1);
}
print(value);
},
)),
);
}
} }
class SmoothTransition extends PageRouteBuilder { class SmoothTransition extends PageRouteBuilder {

253
lib/screens/myWallets/walletOptions.dart
View File

@ -20,8 +20,8 @@ class WalletOptions extends StatelessWidget with ChangeNotifier {
String walletName; String walletName;
int derivation; int derivation;
// ignore: close_sinks
StreamController<ErrorAnimationType> errorController; StreamController<ErrorAnimationType> errorController;
TextEditingController _enterPin = TextEditingController();
final formKey = GlobalKey<FormState>(); final formKey = GlobalKey<FormState>();
bool hasError = false; bool hasError = false;
var pinColor = Color(0xffF9F9F1); var pinColor = Color(0xffF9F9F1);
@ -39,6 +39,7 @@ class WalletOptions extends StatelessWidget with ChangeNotifier {
Provider.of<MyWalletsProvider>(context); Provider.of<MyWalletsProvider>(context);
errorController = StreamController<ErrorAnimationType>(); errorController = StreamController<ErrorAnimationType>();
// _walletOptions.isWalletUnlock = false; // _walletOptions.isWalletUnlock = false;
print("Is unlock ? ${_walletOptions.isWalletUnlock}");
final int _pinLenght = _walletOptions.getPinLenght(this.walletNbr); final int _pinLenght = _walletOptions.getPinLenght(this.walletNbr);
@ -178,87 +179,177 @@ class WalletOptions extends StatelessWidget with ChangeNotifier {
fontWeight: FontWeight.w400), fontWeight: FontWeight.w400),
), ),
SizedBox(height: 50), SizedBox(height: 50),
Form( pinForm(context, _pinLenght, walletNbr, derivation)
key: formKey, // Form(
child: Padding( // key: formKey,
padding: const EdgeInsets.symmetric( // child: Padding(
vertical: 8.0, horizontal: 30), // padding: const EdgeInsets.symmetric(
child: PinCodeTextField( // vertical: 8.0, horizontal: 30),
autoFocus: true, // child: PinCodeTextField(
appContext: context, // autoFocus: true,
pastedTextStyle: TextStyle( // appContext: context,
color: Colors.green.shade600, // pastedTextStyle: TextStyle(
fontWeight: FontWeight.bold, // color: Colors.green.shade600,
), // fontWeight: FontWeight.bold,
length: _pinLenght, // ),
obscureText: false, // length: _pinLenght,
obscuringCharacter: '*', // obscureText: false,
animationType: AnimationType.fade, // obscuringCharacter: '*',
validator: (v) { // animationType: AnimationType.fade,
if (v.length < _pinLenght) { // validator: (v) {
return "Votre code PIN fait $_pinLenght caractères"; // if (v.length < _pinLenght) {
} else { // return "Votre code PIN fait $_pinLenght caractères";
return null; // } else {
} // return null;
}, // }
pinTheme: PinTheme( // },
shape: PinCodeFieldShape.box, // pinTheme: PinTheme(
borderRadius: BorderRadius.circular(5), // shape: PinCodeFieldShape.box,
fieldHeight: 60, // borderRadius: BorderRadius.circular(5),
fieldWidth: 50, // fieldHeight: 60,
activeFillColor: hasError // fieldWidth: 50,
? Colors.orange // activeFillColor: hasError
: Colors.white, // ? Colors.orange
), // : Colors.white,
cursorColor: Colors.black, // ),
animationDuration: // cursorColor: Colors.black,
Duration(milliseconds: 300), // animationDuration:
textStyle: // Duration(milliseconds: 300),
TextStyle(fontSize: 20, height: 1.6), // textStyle:
backgroundColor: pinColor, // TextStyle(fontSize: 20, height: 1.6),
enableActiveFill: false, // backgroundColor: pinColor,
errorAnimationController: errorController, // enableActiveFill: false,
controller: _enterPin, // errorAnimationController: errorController,
keyboardType: TextInputType.text, // controller: _enterPin,
boxShadows: [ // keyboardType: TextInputType.text,
BoxShadow( // boxShadows: [
offset: Offset(0, 1), // BoxShadow(
color: Colors.black12, // offset: Offset(0, 1),
blurRadius: 10, // color: Colors.black12,
) // blurRadius: 10,
], // )
onCompleted: (_pin) async { // ],
print("Completed"); // onCompleted: (_pin) async {
final resultWallet = // print("Completed");
await _walletOptions.readLocalWallet( // final resultWallet =
this.walletNbr, // await _walletOptions.readLocalWallet(
_pin.toUpperCase(), // this.walletNbr,
_pinLenght, // _pin.toUpperCase(),
this.derivation); // _pinLenght,
if (resultWallet == 'bad') { // this.derivation);
errorController.add(ErrorAnimationType // if (resultWallet == 'bad') {
.shake); // Triggering error shake animation // errorController.add(ErrorAnimationType
hasError = true; // .shake); // Triggering error shake animation
pinColor = Colors.red[200]; // hasError = true;
notifyListeners(); // pinColor = Colors.red[200];
} else { // notifyListeners();
pinColor = Colors.green[200]; // } else {
// setState(() {}); // pinColor = Colors.green[200];
// await Future.delayed(Duration(milliseconds: 50)); // // setState(() {});
this.walletPin = _pin.toUpperCase(); // // await Future.delayed(Duration(milliseconds: 50));
// isWalletUnlock = true; // this.walletPin = _pin.toUpperCase();
notifyListeners(); // // isWalletUnlock = true;
} // notifyListeners();
}, // }
onChanged: (value) { // },
if (pinColor != Color(0xffF9F9F1)) { // onChanged: (value) {
pinColor = Color(0xffF9F9F1); // if (pinColor != Color(0xffF9F9F1)) {
} // pinColor = Color(0xffF9F9F1);
print(value); // }
}, // print(value);
)), // },
) // )),
// )
]))), ]))),
]))))); ])))));
} }
Widget pinForm(context, _pinLenght, int _walletNbr, int _derivation) {
// var _walletPin = '';
// ignore: close_sinks
StreamController<ErrorAnimationType> errorController =
StreamController<ErrorAnimationType>();
TextEditingController _enterPin = TextEditingController();
WalletOptionsProvider _walletOptions =
Provider.of<WalletOptionsProvider>(context);
return Form(
key: formKey,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0, horizontal: 30),
child: PinCodeTextField(
autoFocus: true,
appContext: context,
pastedTextStyle: TextStyle(
color: Colors.green.shade600,
fontWeight: FontWeight.bold,
),
length: _pinLenght,
obscureText: false,
obscuringCharacter: '*',
animationType: AnimationType.fade,
validator: (v) {
if (v.length < _pinLenght) {
return "Votre code PIN fait $_pinLenght caractères";
} else {
return null;
}
},
pinTheme: PinTheme(
activeColor: pinColor,
borderWidth: 4,
shape: PinCodeFieldShape.box,
borderRadius: BorderRadius.circular(5),
fieldHeight: 60,
fieldWidth: 50,
activeFillColor: hasError ? Colors.blueAccent : Colors.black,
),
cursorColor: Colors.black,
animationDuration: Duration(milliseconds: 300),
textStyle: TextStyle(fontSize: 20, height: 1.6),
backgroundColor: Color(0xffF9F9F1),
enableActiveFill: false,
errorAnimationController: errorController,
controller: _enterPin,
keyboardType: TextInputType.text,
boxShadows: [
BoxShadow(
offset: Offset(0, 1),
color: Colors.black12,
blurRadius: 10,
)
],
onCompleted: (_pin) async {
print("Completed");
final resultWallet = await _walletOptions.readLocalWallet(
this.walletNbr,
_pin.toUpperCase(),
_pinLenght,
this.derivation);
if (resultWallet == 'bad') {
errorController.add(ErrorAnimationType
.shake); // Triggering error shake animation
hasError = true;
pinColor = Colors.red[600];
_walletOptions.reloadBuild();
} else {
pinColor = Colors.green[400];
// setState(() {});
// await Future.delayed(Duration(milliseconds: 50));
this.walletPin = _pin.toUpperCase();
_walletOptions.isWalletUnlock = true;
// isWalletUnlock = true;
_walletOptions.reloadBuild();
// notifyListeners();
}
},
onChanged: (value) {
if (pinColor != Color(0xFFA4B600)) {
pinColor = Color(0xFFA4B600);
}
print(value);
},
)),
);
}
} }

5
lib/screens/onBoarding/14_stepFourteen.dart
View File

@ -7,6 +7,7 @@ import 'package:gecko/models/generateWallets.dart';
import 'package:gecko/models/myWallets.dart'; import 'package:gecko/models/myWallets.dart';
import 'package:gecko/models/walletOptions.dart'; import 'package:gecko/models/walletOptions.dart';
import 'package:gecko/screens/commonElements.dart'; import 'package:gecko/screens/commonElements.dart';
import 'package:gecko/screens/onBoarding/15_stepFiveteen.dart';
import 'package:pin_code_fields/pin_code_fields.dart'; import 'package:pin_code_fields/pin_code_fields.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
@ -118,9 +119,9 @@ class OnboardingStepFourteen extends StatelessWidget {
_myWalletProvider.getAllWalletsNames(); _myWalletProvider.getAllWalletsNames();
_walletOptions.reloadBuild(); _walletOptions.reloadBuild();
_myWalletProvider.rebuildWidget(); _myWalletProvider.rebuildWidget();
Navigator.popUntil( Navigator.push(
context, context,
ModalRoute.withName('/'), SmoothTransition(page: OnboardingStepFiveteen()),
); );
} else { } else {
errorController.add(ErrorAnimationType errorController.add(ErrorAnimationType

58
lib/screens/onBoarding/15_stepFiveteen.dart Normal file
View File

@ -0,0 +1,58 @@
import 'package:flutter/services.dart';
import 'package:flutter/material.dart';
import 'package:gecko/screens/commonElements.dart';
import 'package:gecko/screens/myWallets/walletsHome.dart';
// ignore: must_be_immutable
class OnboardingStepFiveteen extends StatelessWidget {
TextEditingController tplController = TextEditingController();
final int progress = 28;
@override
Widget build(BuildContext context) {
SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]);
CommonElements common = CommonElements();
return Scaffold(
extendBodyBehindAppBar: true,
body: SafeArea(
child: Column(children: <Widget>[
common.onboardingProgressBar('Ma phrase de restauration', progress),
common.bubbleSpeak(
"Top !\n\nVotre trousseau de clef et votre portefeuille ont été créés avec un immense succès.\n\nFélicitations !",
),
SizedBox(height: 10),
Image.asset(
'assets/onBoarding/gecko-clin.gif',
height: 300,
),
Expanded(
child: Align(
alignment: Alignment.bottomCenter,
child: SizedBox(
width: 400,
height: 62,
child: ElevatedButton(
style: ElevatedButton.styleFrom(
elevation: 5,
primary: Color(0xffD28928),
onPrimary: Colors.white, // foreground
),
onPressed: () {
Navigator.popUntil(
context,
ModalRoute.withName('/'),
);
Navigator.push(
context,
SmoothTransition(page: WalletsHome()),
);
},
child: Text("Accéder à mes portefeuilles",
style: TextStyle(fontSize: 20))),
))),
SizedBox(height: 80),
]),
));
}
}