CWA-217 | applied light mode to the application; deleted copy button, enter_pin_code.dart, present picker and standard close button; applied new design to rescan page
parent
22f131069f
commit
ce21e6bc7a
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 1.9 KiB |
After Width: | Height: | Size: 751 B |
@ -1,93 +1,30 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class Palette {
|
||||
static const Color lightBlue = Color.fromRGBO(126, 147, 177, 1.0);
|
||||
static const Color lightBlueWithOpacity = Color.fromRGBO(126, 147, 177, 0.4);
|
||||
static const Color lightGrey = Color.fromRGBO(224, 233, 246, 1.0);
|
||||
static const Color purple = Color.fromRGBO(243, 229, 245, 1.0);
|
||||
static const Color deepPink = Color.fromRGBO(225, 190, 231, 1.0);
|
||||
static const Color indigo = Color.fromRGBO(232, 234, 246, 1.0);
|
||||
static const Color deepIndigo = Color.fromRGBO(197, 202, 233, 1.0);
|
||||
static const Color creamyGrey = Color.fromRGBO(245, 246, 249, 1.0);
|
||||
static const Color deepPurple = Color.fromRGBO(124, 83, 240, 1.0);
|
||||
static const Color wildDarkBlue = Color.fromRGBO(155, 172, 197, 1.0);
|
||||
static const Color wildDarkBlueWithOpacity = Color.fromRGBO(155, 172, 197, 0.1);
|
||||
static const Color lightGreen = Color.fromRGBO(52, 186, 204, 1.0);
|
||||
static const Color darkPurple = Color.fromRGBO(124, 83, 240, 1.0);
|
||||
static const Color brightBlue = Color.fromRGBO(151, 226, 255, 0.6);
|
||||
static const Color cloudySky = Color.fromRGBO(121, 201, 233, 0.8);
|
||||
static const Color darkGrey = Color.fromRGBO(136, 155, 183, 0.21);
|
||||
static const Color shadowGrey = Color.fromRGBO(132, 141, 198, 0.14);
|
||||
static const Color shadowGreyWithOpacity = Color.fromRGBO(132, 141, 198, 0.05);
|
||||
static const Color blueGrey = Color.fromRGBO(103, 107, 141, 1.0);
|
||||
static const Color lightGrey2 = Color.fromRGBO(249, 249, 249, 1.0);
|
||||
static const Color violet = Color.fromRGBO(138, 80, 255, 1.0);
|
||||
static const Color lightViolet = Color.fromRGBO(131, 87, 255, 1);
|
||||
static const Color cakeGreen = Color.fromRGBO(41, 187, 244, 1.0);
|
||||
static const Color cakeGreenWithOpacity = Color.fromRGBO(41, 187, 244, 0.2);
|
||||
static const Color switchBackground = Color.fromRGBO(228, 231, 240, 1.0);
|
||||
static const Color switchBorder = Color.fromRGBO(211, 222, 238, 1.0);
|
||||
static const Color green = Color.fromRGBO(39, 206, 80, 1.0);
|
||||
static const Color red = Color.fromRGBO(255, 51, 51, 1.0);
|
||||
static const Color nightBlue = Color.fromRGBO(34, 40, 75, 1.0);
|
||||
static const Color lavender = Color.fromRGBO(249, 250, 253, 1);
|
||||
static const Color lightLavender = Color.fromRGBO(242, 244, 247, 1);
|
||||
static const Color cadetBlue = Color.fromRGBO(191, 201, 215, 1);
|
||||
static const Color manatee = Color.fromRGBO(138, 153, 175, 1);
|
||||
static const Color separator = Color.fromRGBO(240, 241, 244, 1);
|
||||
static const Color containerLavender = Color.fromRGBO(226, 235, 238, 0.4);
|
||||
static const Color purpleBlue = Color.fromRGBO(84, 92, 139, 1);
|
||||
static const Color floatingActionButton = Color.fromRGBO(213, 56, 99, 1);
|
||||
static const Color failure = Color.fromRGBO(226, 35, 35, 1);
|
||||
static const Color powered = Color.fromRGBO(191, 201, 215, 1);
|
||||
static const Color buttonShadow = Color.fromRGBO(23, 46, 77, 0.129207);
|
||||
static const Color blueAlice = Color.fromRGBO(231, 240, 253, 1.0);
|
||||
static const Color lightBlue = Color.fromRGBO(172, 203, 238, 1.0);
|
||||
static const Color lavender = Color.fromRGBO(237, 245, 252, 1.0);
|
||||
static const Color oceanBlue = Color.fromRGBO(30, 52, 78, 1.0);
|
||||
static const Color lightBlueGrey = Color.fromRGBO(118, 131, 169, 1.0);
|
||||
static const Color periwinkle = Color.fromRGBO(197, 208, 230, 1.0);
|
||||
static const Color blue = Color.fromRGBO(88, 143, 252, 1.0);
|
||||
static const Color darkLavender = Color.fromRGBO(225, 238, 250, 1.0);
|
||||
static const Color nightBlue = Color.fromRGBO(46, 57, 96, 1.0);
|
||||
}
|
||||
|
||||
class PaletteDark {
|
||||
static const Color darkThemeTitle = Color.fromRGBO(132, 154, 186, 1.0);
|
||||
static const Color darkThemeTitleViolet = Color.fromRGBO(121, 92, 190, 1.0);
|
||||
static const Color darkThemeGrey = Color.fromRGBO(100, 115, 137, 1.0);
|
||||
static const Color darkThemeGreyWithOpacity = Color.fromRGBO(100, 115, 137, 0.5);
|
||||
static const Color darkThemeMidGrey = Color.fromRGBO(20, 26, 38, 1.0);
|
||||
static const Color darkThemePurpleButton = Color.fromRGBO(182, 143, 255, 0.1);
|
||||
static const Color darkThemePurpleButtonBorder = Color.fromRGBO(161, 120, 255, 0.7);
|
||||
static const Color darkThemeBackground = Color.fromRGBO(39, 41, 50, 1.0);
|
||||
static const Color darkThemeBackgroundDark = Color.fromRGBO(9, 12, 18, 1.0);
|
||||
static const Color darkThemeDarkGrey = Color.fromRGBO(218, 228, 243, 0.06);
|
||||
static const Color darkGrey = Color.fromRGBO(218, 228, 243, 0.4);
|
||||
static const Color darkThemeBlackWithOpacity = Color.fromRGBO(0, 0, 0, 0.2);
|
||||
static const Color darkThemeBlack = Color.fromRGBO(7, 10, 14, 1.0);
|
||||
static const Color darkThemeAppBarBlack = Color.fromRGBO(4, 5, 7, 1.0);
|
||||
static const Color darkThemeViolet = Color.fromRGBO(131, 87, 255, 0.2);
|
||||
static const Color darkThemeIndigoButton = Color.fromRGBO(216, 223, 246, 0.1);
|
||||
static const Color darkThemeIndigoButtonBorder = Color.fromRGBO(196, 206, 237, 0.4);
|
||||
static const Color darkThemeBlueButton = Color.fromRGBO(151, 226, 255, 0.1);
|
||||
static const Color darkThemeBlueButtonBorder = Color.fromRGBO(62, 190, 240, 0.6);
|
||||
static const Color darkThemeCloseButton = Color.fromRGBO(34, 40, 74, 1.0);
|
||||
static const Color darkThemePinButton = Color.fromRGBO(136, 155, 183, 0.1);
|
||||
static const Color darkThemePinDigitButton = Color.fromRGBO(100, 115, 137, 0.34);
|
||||
static const Color switchBackground = Color.fromRGBO(100, 115, 137, 0.4);
|
||||
static const Color wildDarkBlueWithOpacity = Color.fromRGBO(155, 172, 197, 0.4);
|
||||
static const Color wildDarkBlue = Color.fromRGBO(155, 172, 197, 0.8);
|
||||
|
||||
// NEW
|
||||
|
||||
static const Color backgroundStart = Color.fromRGBO(231, 240, 253, 1.0);
|
||||
static const Color backgroundEnd = Color.fromRGBO(172, 203, 238, 1.0);
|
||||
static const Color mainBackgroundColor = Color.fromRGBO(70, 85, 133, 1.0);
|
||||
static const Color borderCardColor = Color.fromRGBO(81, 96, 147, 1.0);
|
||||
static const Color walletCardTopStartSync = Color.fromRGBO(89, 104, 152, 1.0);
|
||||
static const Color walletCardBottomStartSync = Color.fromRGBO(70, 85, 133, 1.0);
|
||||
static const Color walletCardTopEndSync = Color.fromRGBO(70, 85, 133, 1.0);
|
||||
static const Color walletCardBottomEndSync = Color.fromRGBO(45, 56, 95, 1.0);
|
||||
static const Color walletCardText = Color.fromRGBO(140, 153, 201, 1.0);
|
||||
static const Color walletCardAddressField = Color.fromRGBO(51, 63, 104, 1.0);
|
||||
static const Color walletCardAddressText = Color.fromRGBO(183, 197, 242, 1.0);
|
||||
static const Color walletCardSubAddressField = Color.fromRGBO(63, 77, 122, 1.0);
|
||||
static const Color historyPanel = Color.fromRGBO(33, 43, 73, 1.0);
|
||||
static const Color historyPanelText = Color.fromRGBO(91, 112, 146, 1.0);
|
||||
static const Color historyPanelButton = Color.fromRGBO(39, 53, 96, 1.0);
|
||||
static const Color menuHeader = Color.fromRGBO(41, 52, 84, 1.0);
|
||||
static const Color menuList = Color.fromRGBO(48, 59, 95, 1.0);
|
||||
static const Color selectButtonText = Color.fromRGBO(57, 74, 95, 1.0);
|
||||
static const Color distantBlue = Color.fromRGBO(70, 85, 133, 1.0); // mainBackgroundColor
|
||||
static const Color lightDistantBlue = Color.fromRGBO(81, 96, 147, 1.0); // borderCardColor
|
||||
static const Color nightBlue = Color.fromRGBO(45, 56, 95, 1.0); // walletCardBottomEndSync
|
||||
static const Color gray = Color.fromRGBO(140, 153, 201, 1.0); // walletCardText
|
||||
static const Color violetBlue = Color.fromRGBO(51, 63, 104, 1.0); // walletCardAddressField
|
||||
static const Color moderateBlue = Color.fromRGBO(63, 77, 122, 1.0); // walletCardSubAddressField
|
||||
static const Color darkNightBlue = Color.fromRGBO(33, 43, 73, 1.0); // historyPanel
|
||||
static const Color pigeonBlue = Color.fromRGBO(91, 112, 146, 1.0); // historyPanelText
|
||||
static const Color moderateNightBlue = Color.fromRGBO(39, 53, 96, 1.0); // historyPanelButton
|
||||
static const Color headerNightBlue = Color.fromRGBO(41, 52, 84, 1.0); // menuHeader
|
||||
static const Color lightNightBlue = Color.fromRGBO(48, 59, 95, 1.0); // menuList
|
||||
static const Color moderatePurpleBlue = Color.fromRGBO(57, 74, 95, 1.0); // selectButtonText
|
||||
}
|
@ -1,30 +0,0 @@
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class CopyButton extends StatelessWidget {
|
||||
const CopyButton(
|
||||
{@required this.onPressed,
|
||||
@required this.text,
|
||||
@required this.color,
|
||||
@required this.borderColor});
|
||||
|
||||
final VoidCallback onPressed;
|
||||
final Color color;
|
||||
final Color borderColor;
|
||||
final String text;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return ButtonTheme(
|
||||
minWidth: double.infinity,
|
||||
height: 44.0,
|
||||
child: FlatButton(
|
||||
onPressed: onPressed,
|
||||
color: color,
|
||||
shape: RoundedRectangleBorder(
|
||||
side: BorderSide(color: borderColor),
|
||||
borderRadius: BorderRadius.circular(10.0)),
|
||||
child: Text(text, style: TextStyle(fontSize: 14.0)),
|
||||
));
|
||||
}
|
||||
}
|
@ -1,236 +0,0 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:cake_wallet/palette.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
import 'package:cake_wallet/theme_changer.dart';
|
||||
import 'package:cake_wallet/themes.dart';
|
||||
import 'package:cake_wallet/generated/i18n.dart';
|
||||
|
||||
class EnterPinCode extends StatefulWidget {
|
||||
const EnterPinCode(this.currentPinLength, this.currentPin);
|
||||
|
||||
final int currentPinLength;
|
||||
final List<int> currentPin;
|
||||
|
||||
@override
|
||||
EnterPinCodeState createState() =>
|
||||
EnterPinCodeState(currentPinLength, currentPin);
|
||||
}
|
||||
|
||||
class EnterPinCodeState extends State<EnterPinCode> {
|
||||
EnterPinCodeState(this.pinLength, this.currentPin);
|
||||
|
||||
final _gridViewKey = GlobalKey();
|
||||
final _closeButtonImage = Image.asset('assets/images/close_button.png');
|
||||
final _closeButtonImageDarkTheme =
|
||||
Image.asset('assets/images/close_button_dark_theme.png');
|
||||
static final deleteIconImage = Image.asset('assets/images/delete_icon.png');
|
||||
final int pinLength;
|
||||
final List<int> currentPin;
|
||||
List<int> pin;
|
||||
double _aspectRatio = 0;
|
||||
|
||||
void _calcualteCurrentAspectRatio() {
|
||||
final renderBox =
|
||||
_gridViewKey.currentContext.findRenderObject() as RenderBox;
|
||||
final cellWidth = renderBox.size.width / 3;
|
||||
final cellHeight = renderBox.size.height / 4;
|
||||
|
||||
if (cellWidth > 0 && cellHeight > 0) {
|
||||
_aspectRatio = cellWidth / cellHeight;
|
||||
}
|
||||
|
||||
setState(() {});
|
||||
}
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
pin = List<int>.filled(pinLength, null);
|
||||
WidgetsBinding.instance.addPostFrameCallback(_afterLayout);
|
||||
}
|
||||
|
||||
void _afterLayout(dynamic _) => _calcualteCurrentAspectRatio();
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final _themeChanger = Provider.of<ThemeChanger>(context);
|
||||
final _isDarkTheme = _themeChanger.getTheme() == Themes.darkTheme;
|
||||
|
||||
return Scaffold(
|
||||
backgroundColor: Theme.of(context).backgroundColor,
|
||||
appBar: CupertinoNavigationBar(
|
||||
leading: ButtonTheme(
|
||||
minWidth: double.minPositive,
|
||||
child: FlatButton(
|
||||
onPressed: () {
|
||||
Navigator.pop(context, false);
|
||||
},
|
||||
child: _isDarkTheme
|
||||
? _closeButtonImageDarkTheme
|
||||
: _closeButtonImage),
|
||||
),
|
||||
backgroundColor: Theme.of(context).backgroundColor,
|
||||
border: null),
|
||||
body: SafeArea(
|
||||
child: Container(
|
||||
padding: EdgeInsets.only(left: 40.0, right: 40.0, bottom: 40.0),
|
||||
child: Column(
|
||||
children: <Widget>[
|
||||
Spacer(flex: 2),
|
||||
Text(S.of(context).enter_your_pin,
|
||||
style: TextStyle(fontSize: 24, color: Palette.wildDarkBlue)),
|
||||
Spacer(flex: 3),
|
||||
Container(
|
||||
width: 180,
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: List.generate(pinLength, (index) {
|
||||
const size = 10.0;
|
||||
final isFilled = pin[index] != null;
|
||||
|
||||
return Container(
|
||||
width: size,
|
||||
height: size,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color:
|
||||
isFilled ? Palette.deepPurple : Colors.transparent,
|
||||
border: Border.all(color: Palette.wildDarkBlue),
|
||||
));
|
||||
}),
|
||||
),
|
||||
),
|
||||
Spacer(flex: 3),
|
||||
Flexible(
|
||||
flex: 24,
|
||||
child: Container(
|
||||
key: _gridViewKey,
|
||||
child: _aspectRatio > 0
|
||||
? GridView.count(
|
||||
crossAxisCount: 3,
|
||||
childAspectRatio: _aspectRatio,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
children: List.generate(12, (index) {
|
||||
if (index == 9) {
|
||||
return Container(
|
||||
margin: EdgeInsets.all(5.0),
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: _isDarkTheme
|
||||
? PaletteDark.darkThemePinButton
|
||||
: Palette.darkGrey,
|
||||
),
|
||||
);
|
||||
} else if (index == 10) {
|
||||
index = 0;
|
||||
} else if (index == 11) {
|
||||
return Container(
|
||||
margin: EdgeInsets.all(5.0),
|
||||
child: FlatButton(
|
||||
onPressed: () {
|
||||
_pop();
|
||||
},
|
||||
color: _isDarkTheme
|
||||
? PaletteDark.darkThemePinButton
|
||||
: Palette.darkGrey,
|
||||
shape: CircleBorder(),
|
||||
child: deleteIconImage,
|
||||
),
|
||||
);
|
||||
} else {
|
||||
index++;
|
||||
}
|
||||
|
||||
return Container(
|
||||
margin: EdgeInsets.all(5.0),
|
||||
child: FlatButton(
|
||||
onPressed: () {
|
||||
_push(index);
|
||||
},
|
||||
color: _isDarkTheme
|
||||
? PaletteDark.darkThemePinDigitButton
|
||||
: Palette.creamyGrey,
|
||||
shape: CircleBorder(),
|
||||
child: Text('$index',
|
||||
style: TextStyle(
|
||||
fontSize: 23.0,
|
||||
color: Palette.blueGrey)),
|
||||
),
|
||||
);
|
||||
}),
|
||||
)
|
||||
: null))
|
||||
],
|
||||
),
|
||||
)),
|
||||
);
|
||||
}
|
||||
|
||||
void _showIncorrectPinDialog(BuildContext context) async {
|
||||
await showDialog<void>(
|
||||
context: context,
|
||||
builder: (BuildContext context) {
|
||||
return AlertDialog(
|
||||
content: Text(S.of(context).pin_is_incorrect),
|
||||
actions: <Widget>[
|
||||
FlatButton(
|
||||
child: Text(S.of(context).ok),
|
||||
onPressed: () {
|
||||
Navigator.of(context).pop();
|
||||
},
|
||||
),
|
||||
],
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
void _push(int num) {
|
||||
if (_pinLength() >= pinLength) {
|
||||
return;
|
||||
}
|
||||
|
||||
for (var i = 0; i < pin.length; i++) {
|
||||
if (pin[i] == null) {
|
||||
setState(() => pin[i] = num);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
final currentPinLength = _pinLength();
|
||||
|
||||
if (currentPinLength == pinLength) {
|
||||
if (listEquals<int>(pin, currentPin)) {
|
||||
Navigator.pop(context, true);
|
||||
} else {
|
||||
Navigator.pop(context, false);
|
||||
|
||||
_showIncorrectPinDialog(context);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
void _pop() {
|
||||
if (_pinLength() == 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
for (var i = pin.length - 1; i >= 0; i--) {
|
||||
if (pin[i] != null) {
|
||||
setState(() => pin[i] = null);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
int _pinLength() {
|
||||
return pin.fold(0, (v, e) {
|
||||
if (e != null) {
|
||||
return v + 1;
|
||||
}
|
||||
|
||||
return v;
|
||||
});
|
||||
}
|
||||
}
|
@ -1,44 +0,0 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:cake_wallet/generated/i18n.dart';
|
||||
|
||||
Future<T> presentPicker<T extends Object>(
|
||||
BuildContext context, List<T> list) async {
|
||||
T _value = list[0];
|
||||
|
||||
return await showDialog(
|
||||
context: context,
|
||||
builder: (BuildContext context) {
|
||||
return AlertDialog(
|
||||
title: Text(S.of(context).please_select),
|
||||
backgroundColor: Theme.of(context).backgroundColor,
|
||||
content: Container(
|
||||
height: 150.0,
|
||||
child: CupertinoPicker(
|
||||
backgroundColor: Theme.of(context).backgroundColor,
|
||||
itemExtent: 45.0,
|
||||
onSelectedItemChanged: (int index) => _value = list[index],
|
||||
children: List.generate(
|
||||
list.length,
|
||||
(index) => Center(
|
||||
child: Text(
|
||||
list[index].toString(),
|
||||
style: TextStyle(
|
||||
color: Theme.of(context)
|
||||
.primaryTextTheme
|
||||
.caption
|
||||
.color),
|
||||
),
|
||||
))),
|
||||
),
|
||||
actions: <Widget>[
|
||||
FlatButton(
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
child: Text(S.of(context).cancel)),
|
||||
FlatButton(
|
||||
onPressed: () => Navigator.of(context).pop(_value),
|
||||
child: Text(S.of(context).ok))
|
||||
],
|
||||
);
|
||||
});
|
||||
}
|
@ -1,16 +0,0 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/cupertino.dart';
|
||||
|
||||
class StandartCloseButton extends StatelessWidget {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return SizedBox(
|
||||
height: 37,
|
||||
width: 37,
|
||||
child: FlatButton(
|
||||
padding: EdgeInsets.all(0),
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
child: Image.asset('assets/images/close_button.png')),
|
||||
);
|
||||
}
|
||||
}
|
Loading…
Reference in new issue