mirror of
https://github.com/cake-tech/cake_wallet.git
synced 2024-12-22 19:49:22 +00:00
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
This commit is contained in:
parent
40aeacfb4b
commit
ecf7a5ba78
15 changed files with 404 additions and 341 deletions
BIN
assets/images/2.0x/question_mark.png
Normal file
BIN
assets/images/2.0x/question_mark.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.2 KiB |
BIN
assets/images/3.0x/question_mark.png
Normal file
BIN
assets/images/3.0x/question_mark.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.6 KiB |
BIN
assets/images/question_mark.png
Normal file
BIN
assets/images/question_mark.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 713 B |
|
@ -31,6 +31,7 @@ class Palette {
|
|||
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 niagara = Color.fromRGBO(152, 172, 201, 1.0);
|
||||
static const Color alizarinRed = Color.fromRGBO(233, 45, 45, 1.0);
|
||||
|
||||
// FIXME: Rename.
|
||||
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 distantBlue = Color.fromRGBO(72, 85, 131, 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.
|
||||
static const Color eee = Color.fromRGBO(236, 239, 245, 1.0);
|
||||
|
|
|
@ -1,8 +1,10 @@
|
|||
import 'dart:ui';
|
||||
import 'package:cake_wallet/palette.dart';
|
||||
import 'package:flutter/cupertino.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/widgets/alert_background.dart';
|
||||
import 'package:cake_wallet/src/widgets/alert_close_button.dart';
|
||||
|
||||
class CurrencyPicker extends StatelessWidget {
|
||||
CurrencyPicker({
|
||||
|
@ -16,19 +18,17 @@ class CurrencyPicker extends StatelessWidget {
|
|||
final List<CryptoCurrency> items;
|
||||
final String title;
|
||||
final Function(CryptoCurrency) onItemSelected;
|
||||
final closeButton = Image.asset('assets/images/close.png',
|
||||
color: Palette.darkBlueCraiola,
|
||||
);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: () => Navigator.of(context).pop(),
|
||||
child: Container(
|
||||
color: Colors.transparent,
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0),
|
||||
child: Container(
|
||||
decoration: BoxDecoration(color: PaletteDark.darkNightBlue.withOpacity(0.75)),
|
||||
child: Center(
|
||||
child: Column(
|
||||
return AlertBackground(
|
||||
child: Stack(
|
||||
alignment: Alignment.center,
|
||||
children: <Widget>[
|
||||
Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: <Widget>[
|
||||
Container(
|
||||
|
@ -38,6 +38,7 @@ class CurrencyPicker extends StatelessWidget {
|
|||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontFamily: 'Poppins',
|
||||
fontWeight: FontWeight.bold,
|
||||
decoration: TextDecoration.none,
|
||||
color: Colors.white
|
||||
|
@ -53,7 +54,7 @@ class CurrencyPicker extends StatelessWidget {
|
|||
child: Container(
|
||||
height: 400,
|
||||
width: 300,
|
||||
color: Theme.of(context).dividerColor,
|
||||
color: Theme.of(context).accentTextTheme.title.backgroundColor,
|
||||
child: GridView.count(
|
||||
shrinkWrap: true,
|
||||
crossAxisCount: 3,
|
||||
|
@ -65,7 +66,7 @@ class CurrencyPicker extends StatelessWidget {
|
|||
|
||||
if (index == 14) {
|
||||
return Container(
|
||||
color: Theme.of(context).primaryTextTheme.display1.color,
|
||||
color: Theme.of(context).accentTextTheme.title.color,
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -73,10 +74,10 @@ class CurrencyPicker extends StatelessWidget {
|
|||
final isItemSelected = index == selectedAtIndex;
|
||||
|
||||
final color = isItemSelected
|
||||
? Theme.of(context).accentTextTheme.subtitle.decorationColor
|
||||
: Theme.of(context).primaryTextTheme.display1.color;
|
||||
? Theme.of(context).textTheme.body2.color
|
||||
: Theme.of(context).accentTextTheme.title.color;
|
||||
final textColor = isItemSelected
|
||||
? Colors.blue
|
||||
? Palette.blueCraiola
|
||||
: Theme.of(context).primaryTextTheme.title.color;
|
||||
|
||||
return GestureDetector(
|
||||
|
@ -94,7 +95,8 @@ class CurrencyPicker extends StatelessWidget {
|
|||
item.toString(),
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontFamily: 'Poppins',
|
||||
fontWeight: FontWeight.w600,
|
||||
decoration: TextDecoration.none,
|
||||
color: textColor
|
||||
),
|
||||
|
@ -110,10 +112,9 @@ class CurrencyPicker extends StatelessWidget {
|
|||
)
|
||||
],
|
||||
),
|
||||
AlertCloseButton(image: closeButton)
|
||||
],
|
||||
)
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
|
@ -146,6 +146,7 @@ class ExchangeCardState extends State<ExchangeCard> {
|
|||
keyboardType: TextInputType.numberWithOptions(
|
||||
signed: false, decimal: true),
|
||||
inputFormatters: [
|
||||
LengthLimitingTextInputFormatter(15),
|
||||
BlacklistingTextInputFormatter(
|
||||
RegExp('[\\-|\\ |\\,]'))
|
||||
],
|
||||
|
|
|
@ -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/screens/base_page.dart';
|
||||
import 'package:cake_wallet/src/domain/exchange/trade.dart';
|
||||
import 'package:cake_wallet/palette.dart';
|
||||
|
||||
class ExchangeConfirmPage extends BasePage {
|
||||
ExchangeConfirmPage({@required this.trade});
|
||||
|
@ -16,43 +17,92 @@ class ExchangeConfirmPage extends BasePage {
|
|||
String get title => S.current.copy_id;
|
||||
|
||||
@override
|
||||
Widget body(BuildContext context) {
|
||||
final copyImage = Image.asset('assets/images/copy_content.png',
|
||||
Widget trailing(BuildContext context) {
|
||||
final questionImage = Image.asset('assets/images/question_mark.png',
|
||||
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(
|
||||
padding: EdgeInsets.all(24),
|
||||
padding: EdgeInsets.fromLTRB(24, 0, 24, 24),
|
||||
child: Column(
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Center(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: <Widget>[
|
||||
Text(
|
||||
Flexible(
|
||||
child: Center(
|
||||
child: Text(
|
||||
S.of(context).exchange_result_write_down_trade_id,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 18.0,
|
||||
fontWeight: FontWeight.w600,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: Theme.of(context).primaryTextTheme.title.color),
|
||||
),
|
||||
Padding(
|
||||
padding: EdgeInsets.only(top: 60),
|
||||
child: Text(
|
||||
)
|
||||
),
|
||||
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
|
||||
),
|
||||
child: Column(
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: EdgeInsets.all(24),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: <Widget>[
|
||||
Text(
|
||||
S.of(context).trade_id,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 16.0,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Theme.of(context).primaryTextTheme.title.color),
|
||||
fontSize: 12.0,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: Theme.of(context).primaryTextTheme.overline.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(top: 24),
|
||||
padding: EdgeInsets.fromLTRB(10, 0, 10, 10),
|
||||
child: Builder(
|
||||
builder: (context) => GestureDetector(
|
||||
onTap: () {
|
||||
builder: (context) => PrimaryButton(
|
||||
onPressed: () {
|
||||
Clipboard.setData(ClipboardData(text: trade.id));
|
||||
Scaffold.of(context).showSnackBar(SnackBar(
|
||||
content: Text(
|
||||
|
@ -64,46 +114,26 @@ class ExchangeConfirmPage extends BasePage {
|
|||
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>[
|
||||
Expanded(
|
||||
child: Text(
|
||||
trade.id,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Theme.of(context).primaryTextTheme.title.color
|
||||
text: S.of(context).copy_id,
|
||||
color: Theme.of(context).accentTextTheme.caption.backgroundColor,
|
||||
textColor: Theme.of(context).primaryTextTheme.title.color
|
||||
),
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: EdgeInsets.only(left: 12),
|
||||
child: copyImage,
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
)
|
||||
Flexible(
|
||||
child: Offstage()
|
||||
),
|
||||
)
|
||||
],
|
||||
)
|
||||
),
|
||||
)),
|
||||
PrimaryButton(
|
||||
onPressed: () => Navigator.of(context)
|
||||
.pushReplacementNamed(Routes.exchangeTrade, arguments: trade),
|
||||
text: S.of(context).saved_the_trade_id,
|
||||
color: Colors.green,
|
||||
color: Palette.blueCraiola,
|
||||
textColor: Colors.white)
|
||||
],
|
||||
),
|
||||
|
|
|
@ -27,7 +27,9 @@ class MoneroAccountListPage extends StatelessWidget {
|
|||
}
|
||||
|
||||
final MoneroAccountListViewModel accountListViewModel;
|
||||
final closeIcon = Image.asset('assets/images/close.png');
|
||||
final closeIcon = Image.asset('assets/images/close.png',
|
||||
color: Palette.darkBlueCraiola,
|
||||
);
|
||||
|
||||
ScrollController controller;
|
||||
double backgroundHeight;
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
import 'package:flutter/material.dart';
|
||||
import 'package:cake_wallet/src/widgets/base_alert_dialog.dart';
|
||||
import 'package:cake_wallet/palette.dart';
|
||||
|
||||
class AlertWithOneAction extends BaseAlertDialog {
|
||||
AlertWithOneAction({
|
||||
|
@ -31,13 +32,7 @@ class AlertWithOneAction extends BaseAlertDialog {
|
|||
width: 300,
|
||||
height: 52,
|
||||
padding: EdgeInsets.only(left: 12, right: 12),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.only(
|
||||
bottomLeft: Radius.circular(24),
|
||||
bottomRight: Radius.circular(24)
|
||||
),
|
||||
color: Colors.white
|
||||
),
|
||||
color: Palette.blueCraiola,
|
||||
child: ButtonTheme(
|
||||
minWidth: double.infinity,
|
||||
child: FlatButton(
|
||||
|
@ -50,7 +45,7 @@ class AlertWithOneAction extends BaseAlertDialog {
|
|||
style: TextStyle(
|
||||
fontSize: 15,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Colors.blue,
|
||||
color: Colors.white,
|
||||
decoration: TextDecoration.none,
|
||||
),
|
||||
)),
|
||||
|
|
|
@ -17,6 +17,7 @@ class BaseAlertDialog extends StatelessWidget {
|
|||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 20,
|
||||
fontFamily: 'Poppins',
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Theme.of(context).primaryTextTheme.title.color,
|
||||
decoration: TextDecoration.none,
|
||||
|
@ -30,7 +31,7 @@ class BaseAlertDialog extends StatelessWidget {
|
|||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w600,
|
||||
fontFamily: 'Poppins',
|
||||
color: Theme.of(context).primaryTextTheme.title.color,
|
||||
decoration: TextDecoration.none,
|
||||
),
|
||||
|
@ -38,25 +39,14 @@ class BaseAlertDialog extends StatelessWidget {
|
|||
}
|
||||
|
||||
Widget actionButtons(BuildContext context) {
|
||||
return Container(
|
||||
width: 300,
|
||||
height: 52,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.only(
|
||||
bottomLeft: Radius.circular(24),
|
||||
bottomRight: Radius.circular(24)
|
||||
),
|
||||
color: Colors.white
|
||||
),
|
||||
child: Row(
|
||||
return Row(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
children: <Widget>[
|
||||
Flexible(
|
||||
child: Container(
|
||||
height: 52,
|
||||
padding: EdgeInsets.only(left: 12, right: 12),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.only(bottomLeft: Radius.circular(24)),
|
||||
),
|
||||
color: Palette.blueCraiola,
|
||||
child: ButtonTheme(
|
||||
minWidth: double.infinity,
|
||||
child: FlatButton(
|
||||
|
@ -68,25 +58,20 @@ class BaseAlertDialog extends StatelessWidget {
|
|||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 15,
|
||||
fontFamily: 'Poppins',
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Colors.blue,
|
||||
color: Colors.white,
|
||||
decoration: TextDecoration.none,
|
||||
),
|
||||
)),
|
||||
),
|
||||
)
|
||||
),
|
||||
Container(
|
||||
height: 52,
|
||||
width: 1,
|
||||
color: Colors.grey.withOpacity(0.2),
|
||||
),
|
||||
Flexible(
|
||||
child: Container(
|
||||
height: 52,
|
||||
padding: EdgeInsets.only(left: 12, right: 12),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.only(bottomRight: Radius.circular(24)),
|
||||
),
|
||||
color: Palette.alizarinRed,
|
||||
child: ButtonTheme(
|
||||
minWidth: double.infinity,
|
||||
child: FlatButton(
|
||||
|
@ -98,8 +83,9 @@ class BaseAlertDialog extends StatelessWidget {
|
|||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 15,
|
||||
fontFamily: 'Poppins',
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Colors.red,
|
||||
color: Colors.white,
|
||||
decoration: TextDecoration.none,
|
||||
),
|
||||
)),
|
||||
|
@ -107,7 +93,6 @@ class BaseAlertDialog extends StatelessWidget {
|
|||
)
|
||||
)
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -126,40 +111,25 @@ class BaseAlertDialog extends StatelessWidget {
|
|||
child: Center(
|
||||
child: GestureDetector(
|
||||
onTap: () => null,
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.all(Radius.circular(30)),
|
||||
child: Container(
|
||||
width: 300,
|
||||
height: 257,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.all(Radius.circular(24)),
|
||||
color: Theme.of(context).accentTextTheme.title.backgroundColor
|
||||
),
|
||||
color: Theme.of(context).accentTextTheme.title.decorationColor,
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: <Widget>[
|
||||
Container(
|
||||
width: 300,
|
||||
height: 77,
|
||||
padding: EdgeInsets.only(left: 24, right: 24),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.only(
|
||||
topLeft: Radius.circular(24),
|
||||
topRight: Radius.circular(24)
|
||||
),
|
||||
),
|
||||
child: Center(
|
||||
child: title(context),
|
||||
),
|
||||
),
|
||||
Container(
|
||||
width: 300,
|
||||
height: 1,
|
||||
color: Theme.of(context).dividerColor,
|
||||
),
|
||||
Container(
|
||||
width: 300,
|
||||
height: 127,
|
||||
padding: EdgeInsets.all(24),
|
||||
child: Center(
|
||||
padding: EdgeInsets.fromLTRB(24, 32, 24, 32),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: <Widget>[
|
||||
title(context),
|
||||
Padding(
|
||||
padding: EdgeInsets.only(top: 8),
|
||||
child: content(context),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
actionButtons(context)
|
||||
|
@ -171,6 +141,7 @@ class BaseAlertDialog extends StatelessWidget {
|
|||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
|
@ -21,7 +21,8 @@ class BaseTextFormField extends StatelessWidget {
|
|||
this.enabled = true,
|
||||
this.validator,
|
||||
this.textStyle,
|
||||
this.placeholderTextStyle});
|
||||
this.placeholderTextStyle,
|
||||
this.maxLength});
|
||||
|
||||
final TextEditingController controller;
|
||||
final TextInputType keyboardType;
|
||||
|
@ -42,6 +43,7 @@ class BaseTextFormField extends StatelessWidget {
|
|||
final FormFieldValidator<String> validator;
|
||||
final TextStyle placeholderTextStyle;
|
||||
final TextStyle textStyle;
|
||||
final int maxLength;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
|
@ -54,6 +56,7 @@ class BaseTextFormField extends StatelessWidget {
|
|||
maxLines: maxLines,
|
||||
inputFormatters: inputFormatters,
|
||||
enabled: enabled,
|
||||
maxLength: maxLength,
|
||||
style: textStyle ?? TextStyle(
|
||||
fontSize: 16.0,
|
||||
color: textColor ?? Theme.of(context).primaryTextTheme.title.color),
|
||||
|
|
|
@ -1,15 +1,20 @@
|
|||
import 'dart:ui';
|
||||
import 'package:flutter/cupertino.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';
|
||||
|
||||
class Picker<Item extends Object> extends StatelessWidget {
|
||||
class Picker<Item extends Object> extends StatefulWidget {
|
||||
Picker({
|
||||
@required this.selectedAtIndex,
|
||||
@required this.items,
|
||||
this.images,
|
||||
@required this.title,
|
||||
@required this.onItemSelected,
|
||||
this.mainAxisAlignment = MainAxisAlignment.start
|
||||
this.mainAxisAlignment = MainAxisAlignment.start,
|
||||
this.isAlwaysShowScrollThumb = false
|
||||
});
|
||||
|
||||
final int selectedAtIndex;
|
||||
|
@ -18,28 +23,52 @@ class Picker<Item extends Object> extends StatelessWidget {
|
|||
final String title;
|
||||
final Function(Item) onItemSelected;
|
||||
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
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: () => Navigator.of(context).pop(),
|
||||
child: Container(
|
||||
color: Colors.transparent,
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0),
|
||||
child: Container(
|
||||
decoration: BoxDecoration(color: PaletteDark.darkNightBlue.withOpacity(0.75)),
|
||||
child: Center(
|
||||
child: Column(
|
||||
controller.addListener(() {
|
||||
fromTop = controller.hasClients
|
||||
? (controller.offset / controller.position.maxScrollExtent * (backgroundHeight - thumbHeight))
|
||||
: 0;
|
||||
setState(() {});
|
||||
});
|
||||
|
||||
return AlertBackground(
|
||||
child: Stack(
|
||||
alignment: Alignment.center,
|
||||
children: <Widget>[
|
||||
Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: <Widget>[
|
||||
Container(
|
||||
padding: EdgeInsets.only(left: 24, right: 24),
|
||||
child: Text(
|
||||
title,
|
||||
widget.title,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontFamily: 'Poppins',
|
||||
fontWeight: FontWeight.bold,
|
||||
decoration: TextDecoration.none,
|
||||
color: Colors.white
|
||||
|
@ -54,23 +83,27 @@ class Picker<Item extends Object> extends StatelessWidget {
|
|||
borderRadius: BorderRadius.all(Radius.circular(14)),
|
||||
child: Container(
|
||||
height: 233,
|
||||
color: Theme.of(context).accentTextTheme.title.backgroundColor,
|
||||
child: ListView.separated(
|
||||
color: Theme.of(context).accentTextTheme.title.color,
|
||||
child: Stack(
|
||||
alignment: Alignment.center,
|
||||
children: <Widget>[
|
||||
ListView.separated(
|
||||
controller: controller,
|
||||
separatorBuilder: (context, index) => Divider(
|
||||
color: Theme.of(context).dividerColor,
|
||||
color: Theme.of(context).accentTextTheme.title.backgroundColor,
|
||||
height: 1,
|
||||
),
|
||||
itemCount: items == null ? 0 : items.length,
|
||||
itemBuilder: (context, index) {
|
||||
final item = items[index];
|
||||
final image = images != null? images[index] : null;
|
||||
final isItemSelected = index == selectedAtIndex;
|
||||
final isItemSelected = index == widget.selectedAtIndex;
|
||||
|
||||
final color = isItemSelected
|
||||
? Theme.of(context).accentTextTheme.subtitle.decorationColor
|
||||
: Colors.transparent;
|
||||
? Theme.of(context).textTheme.body2.color
|
||||
: Theme.of(context).accentTextTheme.title.color;
|
||||
final textColor = isItemSelected
|
||||
? Colors.blue
|
||||
? Palette.blueCraiola
|
||||
: Theme.of(context).primaryTextTheme.title.color;
|
||||
|
||||
return GestureDetector(
|
||||
|
@ -87,7 +120,7 @@ class Picker<Item extends Object> extends StatelessWidget {
|
|||
color: color,
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
mainAxisAlignment: mainAxisAlignment,
|
||||
mainAxisAlignment: widget.mainAxisAlignment,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: <Widget>[
|
||||
image != null
|
||||
|
@ -101,7 +134,8 @@ class Picker<Item extends Object> extends StatelessWidget {
|
|||
item.toString(),
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontFamily: 'Poppins',
|
||||
fontWeight: FontWeight.w600,
|
||||
color: textColor,
|
||||
decoration: TextDecoration.none,
|
||||
),
|
||||
|
@ -112,6 +146,15 @@ class Picker<Item extends Object> extends StatelessWidget {
|
|||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
widget.isAlwaysShowScrollThumb
|
||||
? CakeScrollbar(
|
||||
backgroundHeight: backgroundHeight,
|
||||
thumbHeight: thumbHeight,
|
||||
fromTop: fromTop
|
||||
)
|
||||
: Offstage(),
|
||||
],
|
||||
)
|
||||
),
|
||||
),
|
||||
|
@ -119,10 +162,9 @@ class Picker<Item extends Object> extends StatelessWidget {
|
|||
)
|
||||
],
|
||||
),
|
||||
AlertCloseButton(image: closeButton)
|
||||
],
|
||||
)
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
|
@ -118,26 +118,24 @@ class Themes {
|
|||
)
|
||||
),
|
||||
focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page)
|
||||
|
||||
|
||||
|
||||
cardColor: Palette.blueAlice,
|
||||
cardTheme: CardTheme(
|
||||
color: Colors.white, // synced card start
|
||||
),
|
||||
|
||||
|
||||
accentTextTheme: TextTheme(
|
||||
title: TextStyle(
|
||||
color: Palette.darkLavender, // top panel
|
||||
backgroundColor: Palette.lavender, // bottom panel
|
||||
decorationColor: PaletteDark.distantBlue // select button background color
|
||||
color: Colors.white, // picker background
|
||||
backgroundColor: Palette.periwinkleCraiola, // picker divider
|
||||
decorationColor: Colors.white // dialog background
|
||||
),
|
||||
caption: TextStyle(
|
||||
color: Palette.blue, // current wallet label
|
||||
backgroundColor: Colors.white, // gradient start, wallet label
|
||||
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
|
||||
|
@ -148,6 +146,16 @@ class Themes {
|
|||
backgroundColor: Palette.lavender // faq extension
|
||||
)
|
||||
),
|
||||
|
||||
|
||||
|
||||
cardColor: Palette.blueAlice,
|
||||
cardTheme: CardTheme(
|
||||
color: Colors.white, // synced card start
|
||||
),
|
||||
|
||||
|
||||
|
||||
);
|
||||
|
||||
|
||||
|
@ -266,27 +274,23 @@ class Themes {
|
|||
)
|
||||
),
|
||||
focusColor: PaletteDark.moderateBlue, // text field button (exchange page)
|
||||
|
||||
|
||||
|
||||
cardColor: PaletteDark.darkNightBlue,
|
||||
cardTheme: CardTheme(
|
||||
color: PaletteDark.moderateBlue, // synced card start
|
||||
),
|
||||
|
||||
|
||||
|
||||
accentTextTheme: TextTheme(
|
||||
title: TextStyle(
|
||||
color: PaletteDark.moderateBlue, // top panel
|
||||
backgroundColor: PaletteDark.lightNightBlue, // bottom panel
|
||||
decorationColor: Colors.white // select button background color
|
||||
color: PaletteDark.nightBlue, // picker background
|
||||
backgroundColor: PaletteDark.dividerColor, // picker divider
|
||||
decorationColor: PaletteDark.darkNightBlue // dialog background
|
||||
),
|
||||
caption: TextStyle(
|
||||
color: Colors.white, // current wallet label
|
||||
backgroundColor: PaletteDark.distantBlue, // gradient start, wallet label
|
||||
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
|
||||
|
@ -297,6 +301,17 @@ class Themes {
|
|||
backgroundColor: PaletteDark.headerNightBlue // faq extension
|
||||
)
|
||||
),
|
||||
|
||||
|
||||
|
||||
cardColor: PaletteDark.darkNightBlue,
|
||||
cardTheme: CardTheme(
|
||||
color: PaletteDark.moderateBlue, // synced card start
|
||||
),
|
||||
|
||||
|
||||
|
||||
|
||||
);
|
||||
|
||||
}
|
|
@ -108,7 +108,8 @@ abstract class DashboardViewModelBase with Store {
|
|||
|
||||
_items
|
||||
.addAll(transactionFilterStore.filtered(transactions: transactions));
|
||||
_items.addAll(tradeFilterStore.filtered(trades: trades));
|
||||
//_items.addAll(tradeFilterStore.filtered(trades: trades));
|
||||
_items.addAll(trades); // FIXME
|
||||
|
||||
return formattedItemsList(_items);
|
||||
}
|
||||
|
|
|
@ -227,7 +227,7 @@ abstract class ExchangeViewModelBase with Store {
|
|||
}
|
||||
}
|
||||
} 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}'));
|
||||
}
|
||||
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue