android-apps-mirrors/CakeWallet
0
0
Fork 0
mirror of https://github.com/cake-tech/cake_wallet.git synced 2025-06-28 12:29:51 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

CAKE-28 | reworked exchange confirm page; applied light and dark themes to exchange confirm page, currency picker, picker, base alert dialog, alert with one action; applied maximum characters parameter to crypto currency text field in the exchange card

Browse source
This commit is contained in:
Oleksandr Sobol 2020-08-25 21:12:14 +03:00
parent 40aeacfb4b
commit ecf7a5ba78
15 changed files with 404 additions and 341 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
assets/images/2.0x/question_mark.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
assets/images/3.0x/question_mark.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
assets/images/question_mark.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 713 B

2
lib/palette.dart
View file

@ -31,6 +31,7 @@ class Palette {
static const Color darkGray = Color.fromRGBO(122, 147, 186, 1.0); static const Color darkGray = Color.fromRGBO(122, 147, 186, 1.0);
static const Color shadowWhite = Color.fromRGBO(242, 245, 255, 1.0); static const Color shadowWhite = Color.fromRGBO(242, 245, 255, 1.0);
static const Color niagara = Color.fromRGBO(152, 172, 201, 1.0); static const Color niagara = Color.fromRGBO(152, 172, 201, 1.0);
static const Color alizarinRed = Color.fromRGBO(233, 45, 45, 1.0);
// FIXME: Rename. // FIXME: Rename.
static const Color eee = Color.fromRGBO(236, 239, 245, 1.0); static const Color eee = Color.fromRGBO(236, 239, 245, 1.0);
@ -79,6 +80,7 @@ class PaletteDark {
static const Color violetBlue = Color.fromRGBO(59, 72, 119, 1.0); static const Color violetBlue = Color.fromRGBO(59, 72, 119, 1.0);
static const Color distantBlue = Color.fromRGBO(72, 85, 131, 1.0); static const Color distantBlue = Color.fromRGBO(72, 85, 131, 1.0);
static const Color moderateVioletBlue = Color.fromRGBO(62, 73, 113, 1.0); static const Color moderateVioletBlue = Color.fromRGBO(62, 73, 113, 1.0);
static const Color deepVioletBlue = Color.fromRGBO(52, 66, 104, 1.0);
// FIXME: Rename. // FIXME: Rename.
static const Color eee = Color.fromRGBO(236, 239, 245, 1.0); static const Color eee = Color.fromRGBO(236, 239, 245, 1.0);

169
lib/src/screens/exchange/widgets/currency_picker.dart
View file

@ -1,8 +1,10 @@
import 'dart:ui'; import 'dart:ui';
import 'package:cake_wallet/palette.dart';
import 'package:flutter/cupertino.dart'; import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:cake_wallet/palette.dart';
import 'package:cake_wallet/src/domain/common/crypto_currency.dart'; import 'package:cake_wallet/src/domain/common/crypto_currency.dart';
import 'package:cake_wallet/src/widgets/alert_background.dart';
import 'package:cake_wallet/src/widgets/alert_close_button.dart';
class CurrencyPicker extends StatelessWidget { class CurrencyPicker extends StatelessWidget {
CurrencyPicker({ CurrencyPicker({
@ -16,104 +18,103 @@ class CurrencyPicker extends StatelessWidget {
final List<CryptoCurrency> items; final List<CryptoCurrency> items;
final String title; final String title;
final Function(CryptoCurrency) onItemSelected; final Function(CryptoCurrency) onItemSelected;
final closeButton = Image.asset('assets/images/close.png',
color: Palette.darkBlueCraiola,
);
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return GestureDetector( return AlertBackground(
onTap: () => Navigator.of(context).pop(), child: Stack(
child: Container( alignment: Alignment.center,
color: Colors.transparent, children: <Widget>[
child: BackdropFilter( Column(
filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0), mainAxisSize: MainAxisSize.min,
child: Container( children: <Widget>[
decoration: BoxDecoration(color: PaletteDark.darkNightBlue.withOpacity(0.75)), Container(
child: Center( padding: EdgeInsets.only(left: 24, right: 24),
child: Column( child: Text(
mainAxisSize: MainAxisSize.min, title,
children: <Widget>[ textAlign: TextAlign.center,
Container( style: TextStyle(
padding: EdgeInsets.only(left: 24, right: 24), fontSize: 18,
child: Text( fontFamily: 'Poppins',
title, fontWeight: FontWeight.bold,
textAlign: TextAlign.center, decoration: TextDecoration.none,
style: TextStyle( color: Colors.white
fontSize: 18,
fontWeight: FontWeight.bold,
decoration: TextDecoration.none,
color: Colors.white
),
), ),
), ),
Padding( ),
padding: EdgeInsets.only(top: 24), Padding(
child: GestureDetector( padding: EdgeInsets.only(top: 24),
onTap: () => null, child: GestureDetector(
child: ClipRRect( onTap: () => null,
borderRadius: BorderRadius.all(Radius.circular(14)), child: ClipRRect(
child: Container( borderRadius: BorderRadius.all(Radius.circular(14)),
height: 400, child: Container(
width: 300, height: 400,
color: Theme.of(context).dividerColor, width: 300,
child: GridView.count( color: Theme.of(context).accentTextTheme.title.backgroundColor,
shrinkWrap: true, child: GridView.count(
crossAxisCount: 3, shrinkWrap: true,
childAspectRatio: 1.25, crossAxisCount: 3,
physics: const NeverScrollableScrollPhysics(), childAspectRatio: 1.25,
crossAxisSpacing: 1, physics: const NeverScrollableScrollPhysics(),
mainAxisSpacing: 1, crossAxisSpacing: 1,
children: List.generate(15, (index) { mainAxisSpacing: 1,
children: List.generate(15, (index) {
if (index == 14) { if (index == 14) {
return Container( return Container(
color: Theme.of(context).primaryTextTheme.display1.color, color: Theme.of(context).accentTextTheme.title.color,
); );
} }
final item = items[index]; final item = items[index];
final isItemSelected = index == selectedAtIndex; final isItemSelected = index == selectedAtIndex;
final color = isItemSelected final color = isItemSelected
? Theme.of(context).accentTextTheme.subtitle.decorationColor ? Theme.of(context).textTheme.body2.color
: Theme.of(context).primaryTextTheme.display1.color; : Theme.of(context).accentTextTheme.title.color;
final textColor = isItemSelected final textColor = isItemSelected
? Colors.blue ? Palette.blueCraiola
: Theme.of(context).primaryTextTheme.title.color; : Theme.of(context).primaryTextTheme.title.color;
return GestureDetector( return GestureDetector(
onTap: () { onTap: () {
if (onItemSelected == null) { if (onItemSelected == null) {
return; return;
} }
Navigator.of(context).pop(); Navigator.of(context).pop();
onItemSelected(item); onItemSelected(item);
}, },
child: Container( child: Container(
color: color, color: color,
child: Center( child: Center(
child: Text( child: Text(
item.toString(), item.toString(),
style: TextStyle( style: TextStyle(
fontSize: 18, fontSize: 18,
fontWeight: FontWeight.bold, fontFamily: 'Poppins',
decoration: TextDecoration.none, fontWeight: FontWeight.w600,
color: textColor decoration: TextDecoration.none,
), color: textColor
), ),
), ),
), ),
); ),
}) );
), })
), ),
), ),
), ),
) ),
], )
), ],
) ),
), AlertCloseButton(image: closeButton)
), ],
), )
); );
} }
} }

1
lib/src/screens/exchange/widgets/exchange_card.dart
View file

@ -146,6 +146,7 @@ class ExchangeCardState extends State<ExchangeCard> {
keyboardType: TextInputType.numberWithOptions( keyboardType: TextInputType.numberWithOptions(
signed: false, decimal: true), signed: false, decimal: true),
inputFormatters: [ inputFormatters: [
LengthLimitingTextInputFormatter(15),
BlacklistingTextInputFormatter( BlacklistingTextInputFormatter(
RegExp('[\\-|\\ |\\,]')) RegExp('[\\-|\\ |\\,]'))
], ],

162
lib/src/screens/exchange_trade/exchange_confirm_page.dart
View file

@ -6,6 +6,7 @@ import 'package:cake_wallet/generated/i18n.dart';
import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart';
import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/src/screens/base_page.dart';
import 'package:cake_wallet/src/domain/exchange/trade.dart'; import 'package:cake_wallet/src/domain/exchange/trade.dart';
import 'package:cake_wallet/palette.dart';
class ExchangeConfirmPage extends BasePage { class ExchangeConfirmPage extends BasePage {
ExchangeConfirmPage({@required this.trade}); ExchangeConfirmPage({@required this.trade});
@ -16,94 +17,123 @@ class ExchangeConfirmPage extends BasePage {
String get title => S.current.copy_id; String get title => S.current.copy_id;
@override @override
Widget body(BuildContext context) { Widget trailing(BuildContext context) {
final copyImage = Image.asset('assets/images/copy_content.png', final questionImage = Image.asset('assets/images/question_mark.png',
color: Theme.of(context).primaryTextTheme.title.color); color: Theme.of(context).primaryTextTheme.title.color);
return SizedBox(
height: 20.0,
width: 20.0,
child: ButtonTheme(
minWidth: double.minPositive,
child: FlatButton(
highlightColor: Colors.transparent,
splashColor: Colors.transparent,
padding: EdgeInsets.all(0),
onPressed: () {},
child: questionImage),
),
);
}
@override
Widget body(BuildContext context) {
return Container( return Container(
padding: EdgeInsets.all(24), padding: EdgeInsets.fromLTRB(24, 0, 24, 24),
child: Column( child: Column(
children: <Widget>[ children: <Widget>[
Expanded( Expanded(
child: Center( child: Column(
child: Column( children: <Widget>[
mainAxisSize: MainAxisSize.min, Flexible(
children: <Widget>[ child: Center(
Text(
S.of(context).exchange_result_write_down_trade_id,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 18.0,
fontWeight: FontWeight.w600,
color: Theme.of(context).primaryTextTheme.title.color),
),
Padding(
padding: EdgeInsets.only(top: 60),
child: Text( child: Text(
S.of(context).trade_id, S.of(context).exchange_result_write_down_trade_id,
textAlign: TextAlign.center, textAlign: TextAlign.center,
style: TextStyle( style: TextStyle(
fontSize: 16.0, fontSize: 18.0,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w500,
color: Theme.of(context).primaryTextTheme.title.color), color: Theme.of(context).primaryTextTheme.title.color),
), ),
)
),
Container(
height: 178,
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(30)),
border: Border.all(
width: 1,
color: Theme.of(context).accentTextTheme.caption.color
),
color: Theme.of(context).accentTextTheme.title.color
), ),
Padding( child: Column(
padding: EdgeInsets.only(top: 24), children: <Widget>[
child: Builder( Expanded(
builder: (context) => GestureDetector( child: Padding(
onTap: () { padding: EdgeInsets.all(24),
Clipboard.setData(ClipboardData(text: trade.id)); child: Column(
Scaffold.of(context).showSnackBar(SnackBar( mainAxisAlignment: MainAxisAlignment.spaceBetween,
content: Text( crossAxisAlignment: CrossAxisAlignment.center,
S.of(context).copied_to_clipboard,
textAlign: TextAlign.center,
style: TextStyle(color: Colors.white),
),
backgroundColor: Colors.green,
duration: Duration(milliseconds: 1500),
));
},
child: Container(
height: 60,
padding: EdgeInsets.only(left: 24, right: 24),
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(30)),
color: Theme.of(context).accentTextTheme.title.backgroundColor
),
child: Row(
mainAxisSize: MainAxisSize.max,
children: <Widget>[ children: <Widget>[
Expanded( Text(
child: Text( S.of(context).trade_id,
trade.id, style: TextStyle(
maxLines: 1, fontSize: 12.0,
overflow: TextOverflow.ellipsis, fontWeight: FontWeight.w500,
style: TextStyle( color: Theme.of(context).primaryTextTheme.overline.color
fontSize: 18, ),
fontWeight: FontWeight.w600, ),
color: Theme.of(context).primaryTextTheme.title.color Text(
), trade.id,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.w600,
color: Theme.of(context).primaryTextTheme.title.color
), ),
), ),
Padding(
padding: EdgeInsets.only(left: 12),
child: copyImage,
)
], ],
), ),
)
),
Padding(
padding: EdgeInsets.fromLTRB(10, 0, 10, 10),
child: Builder(
builder: (context) => PrimaryButton(
onPressed: () {
Clipboard.setData(ClipboardData(text: trade.id));
Scaffold.of(context).showSnackBar(SnackBar(
content: Text(
S.of(context).copied_to_clipboard,
textAlign: TextAlign.center,
style: TextStyle(color: Colors.white),
),
backgroundColor: Colors.green,
duration: Duration(milliseconds: 1500),
));
},
text: S.of(context).copy_id,
color: Theme.of(context).accentTextTheme.caption.backgroundColor,
textColor: Theme.of(context).primaryTextTheme.title.color
),
), ),
) )
), ],
) ),
], ),
), Flexible(
)), child: Offstage()
),
],
)
),
PrimaryButton( PrimaryButton(
onPressed: () => Navigator.of(context) onPressed: () => Navigator.of(context)
.pushReplacementNamed(Routes.exchangeTrade, arguments: trade), .pushReplacementNamed(Routes.exchangeTrade, arguments: trade),
text: S.of(context).saved_the_trade_id, text: S.of(context).saved_the_trade_id,
color: Colors.green, color: Palette.blueCraiola,
textColor: Colors.white) textColor: Colors.white)
], ],
), ),

4
lib/src/screens/monero_accounts/monero_account_list_page.dart
View file

@ -27,7 +27,9 @@ class MoneroAccountListPage extends StatelessWidget {
} }
final MoneroAccountListViewModel accountListViewModel; final MoneroAccountListViewModel accountListViewModel;
final closeIcon = Image.asset('assets/images/close.png'); final closeIcon = Image.asset('assets/images/close.png',
color: Palette.darkBlueCraiola,
);
ScrollController controller; ScrollController controller;
double backgroundHeight; double backgroundHeight;

11
lib/src/widgets/alert_with_one_action.dart
View file

@ -1,5 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:cake_wallet/src/widgets/base_alert_dialog.dart'; import 'package:cake_wallet/src/widgets/base_alert_dialog.dart';
import 'package:cake_wallet/palette.dart';
class AlertWithOneAction extends BaseAlertDialog { class AlertWithOneAction extends BaseAlertDialog {
AlertWithOneAction({ AlertWithOneAction({
@ -31,13 +32,7 @@ class AlertWithOneAction extends BaseAlertDialog {
width: 300, width: 300,
height: 52, height: 52,
padding: EdgeInsets.only(left: 12, right: 12), padding: EdgeInsets.only(left: 12, right: 12),
decoration: BoxDecoration( color: Palette.blueCraiola,
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(24),
bottomRight: Radius.circular(24)
),
color: Colors.white
),
child: ButtonTheme( child: ButtonTheme(
minWidth: double.infinity, minWidth: double.infinity,
child: FlatButton( child: FlatButton(
@ -50,7 +45,7 @@ class AlertWithOneAction extends BaseAlertDialog {
style: TextStyle( style: TextStyle(
fontSize: 15, fontSize: 15,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: Colors.blue, color: Colors.white,
decoration: TextDecoration.none, decoration: TextDecoration.none,
), ),
)), )),

133
lib/src/widgets/base_alert_dialog.dart
View file

@ -17,6 +17,7 @@ class BaseAlertDialog extends StatelessWidget {
textAlign: TextAlign.center, textAlign: TextAlign.center,
style: TextStyle( style: TextStyle(
fontSize: 20, fontSize: 20,
fontFamily: 'Poppins',
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: Theme.of(context).primaryTextTheme.title.color, color: Theme.of(context).primaryTextTheme.title.color,
decoration: TextDecoration.none, decoration: TextDecoration.none,
@ -30,7 +31,7 @@ class BaseAlertDialog extends StatelessWidget {
textAlign: TextAlign.center, textAlign: TextAlign.center,
style: TextStyle( style: TextStyle(
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.w600, fontFamily: 'Poppins',
color: Theme.of(context).primaryTextTheme.title.color, color: Theme.of(context).primaryTextTheme.title.color,
decoration: TextDecoration.none, decoration: TextDecoration.none,
), ),
@ -38,55 +39,39 @@ class BaseAlertDialog extends StatelessWidget {
} }
Widget actionButtons(BuildContext context) { Widget actionButtons(BuildContext context) {
return Container( return Row(
width: 300, mainAxisSize: MainAxisSize.max,
height: 52, children: <Widget>[
decoration: BoxDecoration( Flexible(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(24),
bottomRight: Radius.circular(24)
),
color: Colors.white
),
child: Row(
mainAxisSize: MainAxisSize.max,
children: <Widget>[
Flexible(
child: Container( child: Container(
height: 52,
padding: EdgeInsets.only(left: 12, right: 12), padding: EdgeInsets.only(left: 12, right: 12),
decoration: BoxDecoration( color: Palette.blueCraiola,
borderRadius: BorderRadius.only(bottomLeft: Radius.circular(24)),
),
child: ButtonTheme( child: ButtonTheme(
minWidth: double.infinity, minWidth: double.infinity,
child: FlatButton( child: FlatButton(
onPressed: actionLeft, onPressed: actionLeft,
highlightColor: Colors.transparent, highlightColor: Colors.transparent,
splashColor: Colors.transparent, splashColor: Colors.transparent,
child: Text( child: Text(
leftActionButtonText, leftActionButtonText,
textAlign: TextAlign.center, textAlign: TextAlign.center,
style: TextStyle( style: TextStyle(
fontSize: 15, fontSize: 15,
fontWeight: FontWeight.w600, fontFamily: 'Poppins',
color: Colors.blue, fontWeight: FontWeight.w600,
decoration: TextDecoration.none, color: Colors.white,
), decoration: TextDecoration.none,
)), ),
)),
), ),
) )
), ),
Container( Flexible(
height: 52,
width: 1,
color: Colors.grey.withOpacity(0.2),
),
Flexible(
child: Container( child: Container(
height: 52,
padding: EdgeInsets.only(left: 12, right: 12), padding: EdgeInsets.only(left: 12, right: 12),
decoration: BoxDecoration( color: Palette.alizarinRed,
borderRadius: BorderRadius.only(bottomRight: Radius.circular(24)),
),
child: ButtonTheme( child: ButtonTheme(
minWidth: double.infinity, minWidth: double.infinity,
child: FlatButton( child: FlatButton(
@ -98,16 +83,16 @@ class BaseAlertDialog extends StatelessWidget {
textAlign: TextAlign.center, textAlign: TextAlign.center,
style: TextStyle( style: TextStyle(
fontSize: 15, fontSize: 15,
fontFamily: 'Poppins',
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: Colors.red, color: Colors.white,
decoration: TextDecoration.none, decoration: TextDecoration.none,
), ),
)), )),
), ),
) )
) )
], ],
),
); );
} }
@ -126,44 +111,30 @@ class BaseAlertDialog extends StatelessWidget {
child: Center( child: Center(
child: GestureDetector( child: GestureDetector(
onTap: () => null, onTap: () => null,
child: Container( child: ClipRRect(
width: 300, borderRadius: BorderRadius.all(Radius.circular(30)),
height: 257, child: Container(
decoration: BoxDecoration( width: 300,
borderRadius: BorderRadius.all(Radius.circular(24)), color: Theme.of(context).accentTextTheme.title.decorationColor,
color: Theme.of(context).accentTextTheme.title.backgroundColor child: Column(
), mainAxisSize: MainAxisSize.min,
child: Column( children: <Widget>[
children: <Widget>[ Container(
Container( padding: EdgeInsets.fromLTRB(24, 32, 24, 32),
width: 300, child: Column(
height: 77, crossAxisAlignment: CrossAxisAlignment.center,
padding: EdgeInsets.only(left: 24, right: 24), children: <Widget>[
decoration: BoxDecoration( title(context),
borderRadius: BorderRadius.only( Padding(
topLeft: Radius.circular(24), padding: EdgeInsets.only(top: 8),
topRight: Radius.circular(24) child: content(context),
)
],
), ),
), ),
child: Center( actionButtons(context)
child: title(context), ],
), ),
),
Container(
width: 300,
height: 1,
color: Theme.of(context).dividerColor,
),
Container(
width: 300,
height: 127,
padding: EdgeInsets.all(24),
child: Center(
child: content(context),
),
),
actionButtons(context)
],
), ),
), ),
), ),

5
lib/src/widgets/base_text_form_field.dart
View file

@ -21,7 +21,8 @@ class BaseTextFormField extends StatelessWidget {
this.enabled = true, this.enabled = true,
this.validator, this.validator,
this.textStyle, this.textStyle,
this.placeholderTextStyle}); this.placeholderTextStyle,
this.maxLength});
final TextEditingController controller; final TextEditingController controller;
final TextInputType keyboardType; final TextInputType keyboardType;
@ -42,6 +43,7 @@ class BaseTextFormField extends StatelessWidget {
final FormFieldValidator<String> validator; final FormFieldValidator<String> validator;
final TextStyle placeholderTextStyle; final TextStyle placeholderTextStyle;
final TextStyle textStyle; final TextStyle textStyle;
final int maxLength;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
@ -54,6 +56,7 @@ class BaseTextFormField extends StatelessWidget {
maxLines: maxLines, maxLines: maxLines,
inputFormatters: inputFormatters, inputFormatters: inputFormatters,
enabled: enabled, enabled: enabled,
maxLength: maxLength,
style: textStyle ?? TextStyle( style: textStyle ?? TextStyle(
fontSize: 16.0, fontSize: 16.0,
color: textColor ?? Theme.of(context).primaryTextTheme.title.color), color: textColor ?? Theme.of(context).primaryTextTheme.title.color),

154
lib/src/widgets/picker.dart
View file

@ -1,15 +1,20 @@
import 'dart:ui'; import 'dart:ui';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:cake_wallet/src/widgets/alert_background.dart';
import 'package:cake_wallet/src/widgets/cake_scrollbar.dart';
import 'package:cake_wallet/src/widgets/alert_close_button.dart';
import 'package:cake_wallet/palette.dart'; import 'package:cake_wallet/palette.dart';
class Picker<Item extends Object> extends StatelessWidget { class Picker<Item extends Object> extends StatefulWidget {
Picker({ Picker({
@required this.selectedAtIndex, @required this.selectedAtIndex,
@required this.items, @required this.items,
this.images, this.images,
@required this.title, @required this.title,
@required this.onItemSelected, @required this.onItemSelected,
this.mainAxisAlignment = MainAxisAlignment.start this.mainAxisAlignment = MainAxisAlignment.start,
this.isAlwaysShowScrollThumb = false
}); });
final int selectedAtIndex; final int selectedAtIndex;
@ -18,59 +23,87 @@ class Picker<Item extends Object> extends StatelessWidget {
final String title; final String title;
final Function(Item) onItemSelected; final Function(Item) onItemSelected;
final MainAxisAlignment mainAxisAlignment; final MainAxisAlignment mainAxisAlignment;
final bool isAlwaysShowScrollThumb;
@override
PickerState createState() => PickerState<Item>(items, images, onItemSelected);
}
class PickerState<Item> extends State<Picker> {
PickerState(this.items, this.images, this.onItemSelected);
final Function(Item) onItemSelected;
final List<Item> items;
final List<Image> images;
final closeButton = Image.asset('assets/images/close.png',
color: Palette.darkBlueCraiola,
);
ScrollController controller = ScrollController();
final double backgroundHeight = 193;
final double thumbHeight = 72;
double fromTop = 0;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return GestureDetector( controller.addListener(() {
onTap: () => Navigator.of(context).pop(), fromTop = controller.hasClients
child: Container( ? (controller.offset / controller.position.maxScrollExtent * (backgroundHeight - thumbHeight))
color: Colors.transparent, : 0;
child: BackdropFilter( setState(() {});
filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0), });
child: Container(
decoration: BoxDecoration(color: PaletteDark.darkNightBlue.withOpacity(0.75)), return AlertBackground(
child: Center( child: Stack(
child: Column( alignment: Alignment.center,
mainAxisSize: MainAxisSize.min, children: <Widget>[
children: <Widget>[ Column(
Container( mainAxisSize: MainAxisSize.min,
padding: EdgeInsets.only(left: 24, right: 24), children: <Widget>[
child: Text( Container(
title, padding: EdgeInsets.only(left: 24, right: 24),
textAlign: TextAlign.center, child: Text(
style: TextStyle( widget.title,
fontSize: 18, textAlign: TextAlign.center,
fontWeight: FontWeight.bold, style: TextStyle(
decoration: TextDecoration.none, fontSize: 18,
color: Colors.white fontFamily: 'Poppins',
), fontWeight: FontWeight.bold,
), decoration: TextDecoration.none,
color: Colors.white
), ),
Padding( ),
padding: EdgeInsets.only(left: 24, right: 24, top: 24), ),
child: GestureDetector( Padding(
onTap: () => null, padding: EdgeInsets.only(left: 24, right: 24, top: 24),
child: ClipRRect( child: GestureDetector(
borderRadius: BorderRadius.all(Radius.circular(14)), onTap: () => null,
child: Container( child: ClipRRect(
height: 233, borderRadius: BorderRadius.all(Radius.circular(14)),
color: Theme.of(context).accentTextTheme.title.backgroundColor, child: Container(
child: ListView.separated( height: 233,
color: Theme.of(context).accentTextTheme.title.color,
child: Stack(
alignment: Alignment.center,
children: <Widget>[
ListView.separated(
controller: controller,
separatorBuilder: (context, index) => Divider( separatorBuilder: (context, index) => Divider(
color: Theme.of(context).dividerColor, color: Theme.of(context).accentTextTheme.title.backgroundColor,
height: 1, height: 1,
), ),
itemCount: items == null ? 0 : items.length, itemCount: items == null ? 0 : items.length,
itemBuilder: (context, index) { itemBuilder: (context, index) {
final item = items[index]; final item = items[index];
final image = images != null? images[index] : null; final image = images != null? images[index] : null;
final isItemSelected = index == selectedAtIndex; final isItemSelected = index == widget.selectedAtIndex;
final color = isItemSelected final color = isItemSelected
? Theme.of(context).accentTextTheme.subtitle.decorationColor ? Theme.of(context).textTheme.body2.color
: Colors.transparent; : Theme.of(context).accentTextTheme.title.color;
final textColor = isItemSelected final textColor = isItemSelected
? Colors.blue ? Palette.blueCraiola
: Theme.of(context).primaryTextTheme.title.color; : Theme.of(context).primaryTextTheme.title.color;
return GestureDetector( return GestureDetector(
@ -87,21 +120,22 @@ class Picker<Item extends Object> extends StatelessWidget {
color: color, color: color,
child: Row( child: Row(
mainAxisSize: MainAxisSize.max, mainAxisSize: MainAxisSize.max,
mainAxisAlignment: mainAxisAlignment, mainAxisAlignment: widget.mainAxisAlignment,
crossAxisAlignment: CrossAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[ children: <Widget>[
image != null image != null
? image ? image
: Offstage(), : Offstage(),
Padding( Padding(
padding: EdgeInsets.only( padding: EdgeInsets.only(
left: image != null ? 12 : 0 left: image != null ? 12 : 0
), ),
child: Text( child: Text(
item.toString(), item.toString(),
style: TextStyle( style: TextStyle(
fontSize: 18, fontSize: 18,
fontWeight: FontWeight.bold, fontFamily: 'Poppins',
fontWeight: FontWeight.w600,
color: textColor, color: textColor,
decoration: TextDecoration.none, decoration: TextDecoration.none,
), ),
@ -112,17 +146,25 @@ class Picker<Item extends Object> extends StatelessWidget {
), ),
); );
}, },
),
widget.isAlwaysShowScrollThumb
? CakeScrollbar(
backgroundHeight: backgroundHeight,
thumbHeight: thumbHeight,
fromTop: fromTop
) )
), : Offstage(),
), ],
)
), ),
) ),
], ),
), )
) ],
), ),
), AlertCloseButton(image: closeButton)
), ],
)
); );
} }
} }

99
lib/themes.dart
View file

@ -118,6 +118,34 @@ class Themes {
) )
), ),
focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page) focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page)
accentTextTheme: TextTheme(
title: TextStyle(
color: Colors.white, // picker background
backgroundColor: Palette.periwinkleCraiola, // picker divider
decorationColor: Colors.white // dialog background
),
caption: TextStyle(
color: Palette.moderateLavender, // container (confirm exchange)
backgroundColor: Palette.moderateLavender, // button background (confirm exchange)
decorationColor: Palette.lavender, // gradient end, wallet label
),
subtitle: TextStyle(
color: Palette.lightBlueGrey, // border color, wallet label
backgroundColor: Palette.lavender, // address field, wallet card
decorationColor: Palette.darkLavender // selected item
),
headline: TextStyle(
color: Palette.darkLavender, // faq background
backgroundColor: Palette.lavender // faq extension
)
),
@ -127,27 +155,7 @@ class Themes {
), ),
accentTextTheme: TextTheme(
title: TextStyle(
color: Palette.darkLavender, // top panel
backgroundColor: Palette.lavender, // bottom panel
decorationColor: PaletteDark.distantBlue // select button background color
),
caption: TextStyle(
color: Palette.blue, // current wallet label
backgroundColor: Colors.white, // gradient start, wallet label
decorationColor: Palette.lavender, // gradient end, wallet label
),
subtitle: TextStyle(
color: Palette.lightBlueGrey, // border color, wallet label
backgroundColor: Palette.lavender, // address field, wallet card
decorationColor: Palette.darkLavender // selected item
),
headline: TextStyle(
color: Palette.darkLavender, // faq background
backgroundColor: Palette.lavender // faq extension
)
),
); );
@ -266,6 +274,33 @@ class Themes {
) )
), ),
focusColor: PaletteDark.moderateBlue, // text field button (exchange page) focusColor: PaletteDark.moderateBlue, // text field button (exchange page)
accentTextTheme: TextTheme(
title: TextStyle(
color: PaletteDark.nightBlue, // picker background
backgroundColor: PaletteDark.dividerColor, // picker divider
decorationColor: PaletteDark.darkNightBlue // dialog background
),
caption: TextStyle(
color: PaletteDark.nightBlue, // container (confirm exchange)
backgroundColor: PaletteDark.deepVioletBlue, // button background (confirm exchange)
decorationColor: PaletteDark.nightBlue, // gradient end, wallet label
),
subtitle: TextStyle(
color: PaletteDark.darkNightBlue, // border color, wallet label
backgroundColor: PaletteDark.violetBlue, // address field, wallet card
decorationColor: PaletteDark.headerNightBlue // selected item
),
headline: TextStyle(
color: PaletteDark.lightNightBlue, // faq background
backgroundColor: PaletteDark.headerNightBlue // faq extension
)
),
@ -276,27 +311,7 @@ class Themes {
accentTextTheme: TextTheme(
title: TextStyle(
color: PaletteDark.moderateBlue, // top panel
backgroundColor: PaletteDark.lightNightBlue, // bottom panel
decorationColor: Colors.white // select button background color
),
caption: TextStyle(
color: Colors.white, // current wallet label
backgroundColor: PaletteDark.distantBlue, // gradient start, wallet label
decorationColor: PaletteDark.nightBlue, // gradient end, wallet label
),
subtitle: TextStyle(
color: PaletteDark.darkNightBlue, // border color, wallet label
backgroundColor: PaletteDark.violetBlue, // address field, wallet card
decorationColor: PaletteDark.headerNightBlue // selected item
),
headline: TextStyle(
color: PaletteDark.lightNightBlue, // faq background
backgroundColor: PaletteDark.headerNightBlue // faq extension
)
),
); );
} }

3
lib/view_model/dashboard/dashboard_view_model.dart
View file

@ -108,7 +108,8 @@ abstract class DashboardViewModelBase with Store {
_items _items
.addAll(transactionFilterStore.filtered(transactions: transactions)); .addAll(transactionFilterStore.filtered(transactions: transactions));
_items.addAll(tradeFilterStore.filtered(trades: trades)); //_items.addAll(tradeFilterStore.filtered(trades: trades));
_items.addAll(trades); // FIXME
return formattedItemsList(_items); return formattedItemsList(_items);
} }

2
lib/view_model/exchange/exchange_view_model.dart
View file

@ -227,7 +227,7 @@ abstract class ExchangeViewModelBase with Store {
} }
} }
} else { } else {
tradeState = TradeIsCreatedFailure(error: S.current.error_text_limits_loading_failed("${provider.description}")); tradeState = TradeIsCreatedFailure(error: S.current.error_text_limits_loading_failed('${provider.description}'));
} }
} }