fade bottom of transaction list on mobile

This commit is contained in:
julian 2023-02-28 09:07:41 -06:00
parent 658708da95
commit 1cdd3338f3
2 changed files with 43 additions and 14 deletions

View file

@ -5,11 +5,13 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:stackwallet/models/isar/models/isar_models.dart'; import 'package:stackwallet/models/isar/models/isar_models.dart';
import 'package:stackwallet/pages/exchange_view/trade_details_view.dart'; import 'package:stackwallet/pages/exchange_view/trade_details_view.dart';
import 'package:stackwallet/pages/wallet_view/sub_widgets/no_transactions_found.dart'; import 'package:stackwallet/pages/wallet_view/sub_widgets/no_transactions_found.dart';
import 'package:stackwallet/pages/wallet_view/wallet_view.dart';
import 'package:stackwallet/providers/global/trades_service_provider.dart'; import 'package:stackwallet/providers/global/trades_service_provider.dart';
import 'package:stackwallet/providers/global/wallets_provider.dart'; import 'package:stackwallet/providers/global/wallets_provider.dart';
import 'package:stackwallet/route_generator.dart'; import 'package:stackwallet/route_generator.dart';
import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/services/coins/manager.dart';
import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/utilities/util.dart';
@ -20,8 +22,6 @@ import 'package:stackwallet/widgets/trade_card.dart';
import 'package:stackwallet/widgets/transaction_card.dart'; import 'package:stackwallet/widgets/transaction_card.dart';
import 'package:tuple/tuple.dart'; import 'package:tuple/tuple.dart';
import '../../../utilities/enums/coin_enum.dart';
class TransactionsList extends ConsumerStatefulWidget { class TransactionsList extends ConsumerStatefulWidget {
const TransactionsList({ const TransactionsList({
Key? key, Key? key,
@ -281,17 +281,30 @@ class _TransactionsListState extends ConsumerState<TransactionsList> {
itemCount: _transactions2.length, itemCount: _transactions2.length,
itemBuilder: (context, index) { itemBuilder: (context, index) {
BorderRadius? radius; BorderRadius? radius;
bool shouldWrap = false;
if (_transactions2.length == 1) { if (_transactions2.length == 1) {
radius = BorderRadius.circular( radius = BorderRadius.circular(
Constants.size.circularBorderRadius, Constants.size.circularBorderRadius,
); );
} else if (index == _transactions2.length - 1) { } else if (index == _transactions2.length - 1) {
radius = _borderRadiusLast; radius = _borderRadiusLast;
shouldWrap = true;
} else if (index == 0) { } else if (index == 0) {
radius = _borderRadiusFirst; radius = _borderRadiusFirst;
} }
final tx = _transactions2[index]; final tx = _transactions2[index];
return itemBuilder(context, tx, radius, manager.coin); if (shouldWrap) {
return Column(
children: [
itemBuilder(context, tx, radius, manager.coin),
const SizedBox(
height: WalletView.navBarHeight + 14,
),
],
);
} else {
return itemBuilder(context, tx, radius, manager.coin);
}
}, },
), ),
); );

View file

@ -666,18 +666,34 @@ class _WalletViewState extends ConsumerState<WalletView> {
children: [ children: [
Padding( Padding(
padding: const EdgeInsets.symmetric(horizontal: 16), padding: const EdgeInsets.symmetric(horizontal: 16),
child: Padding( child: ClipRRect(
padding: const EdgeInsets.only(bottom: 14), borderRadius: BorderRadius.vertical(
child: ClipRRect( top: Radius.circular(
borderRadius: BorderRadius.vertical( Constants.size.circularBorderRadius,
top: Radius.circular(
Constants.size.circularBorderRadius,
),
bottom: Radius.circular(
// WalletView.navBarHeight / 2.0,
Constants.size.circularBorderRadius,
),
), ),
bottom: Radius.circular(
// WalletView.navBarHeight / 2.0,
Constants.size.circularBorderRadius,
),
),
child: ShaderMask(
blendMode: BlendMode.dstOut,
shaderCallback: (Rect bounds) {
return const LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
Colors.transparent,
Colors.transparent,
Colors.white,
],
stops: [
0.0,
0.8,
1.0,
], // 10% purple, 80% transparent, 10% purple
).createShader(bounds);
},
child: Container( child: Container(
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.transparent, color: Colors.transparent,