- Fix scroll issue

- Add ERC20 tokens placeholder image in picker
This commit is contained in:
OmarHatem 2023-07-06 03:00:01 +03:00
parent eb78d12f9b
commit 6bbe95fa5e
2 changed files with 105 additions and 98 deletions

View file

@ -96,61 +96,65 @@ class HomeSettingsPage extends BasePage {
), ),
], ],
), ),
Observer( Padding(
builder: (_) => ListView.builder( padding: const EdgeInsets.only(bottom: 16, left: 16, right: 16),
itemCount: _homeSettingsViewModel.tokens.length, child: Observer(
shrinkWrap: true, builder: (_) => ListView.builder(
itemBuilder: (context, index) { itemCount: _homeSettingsViewModel.tokens.length,
return Container( shrinkWrap: true,
margin: EdgeInsets.only(top: 16, left: 16, right: 16), physics: NeverScrollableScrollPhysics(),
child: Observer( itemBuilder: (context, index) {
builder: (_) { return Container(
final token = _homeSettingsViewModel.tokens.elementAt(index); margin: EdgeInsets.only(top: 16),
child: Observer(
builder: (_) {
final token = _homeSettingsViewModel.tokens.elementAt(index);
return SettingsSwitcherCell( return SettingsSwitcherCell(
title: "${token.name} " title: "${token.name} "
"(${token.symbol})", "(${token.symbol})",
value: token.enabled, value: token.enabled,
onValueChange: (_, bool value) { onValueChange: (_, bool value) {
_homeSettingsViewModel.changeTokenAvailability(token, value); _homeSettingsViewModel.changeTokenAvailability(token, value);
}, },
onTap: (_) { onTap: (_) {
Navigator.pushNamed(context, Routes.editToken, arguments: { Navigator.pushNamed(context, Routes.editToken, arguments: {
'homeSettingsViewModel': _homeSettingsViewModel, 'homeSettingsViewModel': _homeSettingsViewModel,
'token': token, 'token': token,
}); });
}, },
leading: token.iconPath != null leading: token.iconPath != null
? Container( ? Container(
child: Image.asset( child: Image.asset(
token.iconPath!, token.iconPath!,
height: 30.0,
width: 30.0,
),
)
: Container(
height: 30.0, height: 30.0,
width: 30.0, width: 30.0,
), child: Center(
) child: Text(
: Container( token.symbol.substring(0, min(token.symbol.length, 2)),
height: 30.0, style: TextStyle(fontSize: 11),
width: 30.0, ),
child: Center( ),
child: Text( decoration: BoxDecoration(
token.symbol.substring(0, min(token.symbol.length, 2)), shape: BoxShape.circle,
style: TextStyle(fontSize: 11), color: Colors.grey.shade400,
), ),
), ),
decoration: BoxDecoration( decoration: BoxDecoration(
shape: BoxShape.circle, color: Theme.of(context).accentTextTheme.bodySmall!.color!,
color: Colors.grey.shade400, borderRadius: BorderRadius.circular(30),
), ),
), );
decoration: BoxDecoration( },
color: Theme.of(context).accentTextTheme.bodySmall!.color!, ),
borderRadius: BorderRadius.circular(30), );
), },
); ),
},
),
);
},
), ),
), ),
], ],

View file

@ -1,5 +1,7 @@
// ignore_for_file: deprecated_member_use // ignore_for_file: deprecated_member_use
import 'dart:math';
import 'package:cake_wallet/utils/responsive_layout_util.dart'; import 'package:cake_wallet/utils/responsive_layout_util.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:cw_core/currency.dart'; import 'package:cw_core/currency.dart';
@ -144,8 +146,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
borderRadius: BorderRadius.all(Radius.circular(30)), borderRadius: BorderRadius.all(Radius.circular(30)),
child: Container( child: Container(
color: Theme.of(context) color: Theme.of(context)
.accentTextTheme! .accentTextTheme.titleLarge!
.titleLarge!
.color!, .color!,
child: ConstrainedBox( child: ConstrainedBox(
constraints: BoxConstraints( constraints: BoxConstraints(
@ -162,8 +163,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
controller: searchController, controller: searchController,
style: TextStyle( style: TextStyle(
color: Theme.of(context) color: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.titleLarge!
.titleLarge!
.color!), .color!),
decoration: InputDecoration( decoration: InputDecoration(
hintText: widget.hintText, hintText: widget.hintText,
@ -171,8 +171,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
Image.asset("assets/images/search_icon.png"), Image.asset("assets/images/search_icon.png"),
filled: true, filled: true,
fillColor: Theme.of(context) fillColor: Theme.of(context)
.accentTextTheme! .accentTextTheme.displaySmall!
.displaySmall!
.color!, .color!,
alignLabelWithHint: false, alignLabelWithHint: false,
contentPadding: const EdgeInsets.symmetric( contentPadding: const EdgeInsets.symmetric(
@ -192,8 +191,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
), ),
Divider( Divider(
color: Theme.of(context) color: Theme.of(context)
.accentTextTheme! .accentTextTheme.titleLarge!
.titleLarge!
.backgroundColor!, .backgroundColor!,
height: 1, height: 1,
), ),
@ -223,8 +221,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
fontFamily: 'Lato', fontFamily: 'Lato',
decoration: TextDecoration.none, decoration: TextDecoration.none,
color: Theme.of(context) color: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.titleLarge!
.titleLarge!
.color!, .color!,
), ),
), ),
@ -246,8 +243,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
Widget itemsList() { Widget itemsList() {
return Container( return Container(
color: Theme.of(context) color: Theme.of(context)
.accentTextTheme! .accentTextTheme.titleLarge!
.titleLarge!
.backgroundColor!, .backgroundColor!,
child: widget.isGridView child: widget.isGridView
? GridView.builder( ? GridView.builder(
@ -269,8 +265,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
separatorBuilder: (context, index) => widget.isSeparated separatorBuilder: (context, index) => widget.isSeparated
? Divider( ? Divider(
color: Theme.of(context) color: Theme.of(context)
.accentTextTheme! .accentTextTheme.titleLarge!
.titleLarge!
.backgroundColor!, .backgroundColor!,
height: 1, height: 1,
) )
@ -283,15 +278,9 @@ class _PickerState<Item> extends State<Picker<Item>> {
Widget buildItem(int index) { Widget buildItem(int index) {
final item = filteredItems[index]; final item = filteredItems[index];
final tag = item is Currency ? item.tag : null;
final icon = item is Currency && item.iconPath != null final tag = item is Currency ? item.tag : null;
? Image.asset( final icon = _getItemIcon(item);
item.iconPath!,
height: 20.0,
width: 20.0,
)
: null;
final image = images.isNotEmpty ? filteredImages[index] : icon; final image = images.isNotEmpty ? filteredImages[index] : icon;
@ -303,8 +292,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
child: Container( child: Container(
height: 55, height: 55,
color: Theme.of(context) color: Theme.of(context)
.accentTextTheme! .accentTextTheme.titleLarge!
.titleLarge!
.color!, .color!,
padding: EdgeInsets.symmetric(horizontal: 24), padding: EdgeInsets.symmetric(horizontal: 24),
child: Row( child: Row(
@ -327,8 +315,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
fontFamily: 'Lato', fontFamily: 'Lato',
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: Theme.of(context) color: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.titleLarge!
.titleLarge!
.color!, .color!,
decoration: TextDecoration.none, decoration: TextDecoration.none,
), ),
@ -347,8 +334,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
fontSize: 7.0, fontSize: 7.0,
fontFamily: 'Lato', fontFamily: 'Lato',
color: Theme.of(context) color: Theme.of(context)
.textTheme! .textTheme.bodyMedium!
.bodyMedium!
.color!), .color!),
), ),
), ),
@ -356,8 +342,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
borderRadius: BorderRadius.circular(6.0), borderRadius: BorderRadius.circular(6.0),
//border: Border.all(color: ), //border: Border.all(color: ),
color: Theme.of(context) color: Theme.of(context)
.textTheme! .textTheme.bodyMedium!
.bodyMedium!
.decorationColor!, .decorationColor!,
), ),
), ),
@ -374,15 +359,9 @@ class _PickerState<Item> extends State<Picker<Item>> {
Widget buildSelectedItem(int index) { Widget buildSelectedItem(int index) {
final item = items[index]; final item = items[index];
final tag = item is Currency ? item.tag : null;
final icon = item is Currency && item.iconPath != null final tag = item is Currency ? item.tag : null;
? Image.asset( final icon = _getItemIcon(item);
item.iconPath!,
height: 20.0,
width: 20.0,
)
: null;
final image = images.isNotEmpty ? images[index] : icon; final image = images.isNotEmpty ? images[index] : icon;
@ -393,8 +372,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
child: Container( child: Container(
height: 55, height: 55,
color: Theme.of(context) color: Theme.of(context)
.accentTextTheme! .accentTextTheme.titleLarge!
.titleLarge!
.color!, .color!,
padding: EdgeInsets.symmetric(horizontal: 24), padding: EdgeInsets.symmetric(horizontal: 24),
child: Row( child: Row(
@ -417,8 +395,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
fontFamily: 'Lato', fontFamily: 'Lato',
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
color: Theme.of(context) color: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.titleLarge!
.titleLarge!
.color!, .color!,
decoration: TextDecoration.none, decoration: TextDecoration.none,
), ),
@ -437,8 +414,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
fontSize: 7.0, fontSize: 7.0,
fontFamily: 'Lato', fontFamily: 'Lato',
color: Theme.of(context) color: Theme.of(context)
.textTheme! .textTheme.bodyMedium!
.bodyMedium!
.color!), .color!),
), ),
), ),
@ -446,8 +422,7 @@ class _PickerState<Item> extends State<Picker<Item>> {
borderRadius: BorderRadius.circular(6.0), borderRadius: BorderRadius.circular(6.0),
//border: Border.all(color: ), //border: Border.all(color: ),
color: Theme.of(context) color: Theme.of(context)
.textTheme! .textTheme.bodyMedium!
.bodyMedium!
.decorationColor!, .decorationColor!,
), ),
), ),
@ -458,12 +433,40 @@ class _PickerState<Item> extends State<Picker<Item>> {
), ),
Icon(Icons.check_circle, Icon(Icons.check_circle,
color: Theme.of(context) color: Theme.of(context)
.accentTextTheme! .accentTextTheme.bodyLarge!
.bodyLarge!
.color!), .color!),
], ],
), ),
), ),
); );
} }
Widget? _getItemIcon(Item item) {
if (item is Currency) {
if (item.iconPath != null) {
return Image.asset(
item.iconPath!,
height: 20.0,
width: 20.0,
);
} else {
return Container(
height: 20.0,
width: 20.0,
child: Center(
child: Text(
item.name.substring(0, min(item.name.length, 2)).toUpperCase(),
style: TextStyle(fontSize: 11),
),
),
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Colors.grey.shade400,
),
);
}
}
return null;
}
} }