Ecosystem/stack_wallet
1
0
Fork 0
mirror of https://github.com/cypherstack/stack_wallet.git synced 2025-01-10 20:54:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

WIP: desktop exchange steps flow ui

Browse source
This commit is contained in:
julian 2022-11-19 10:01:09 -06:00
parent cc4dc9e3c7
commit 601001f96d
3 changed files with 218 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

54
lib/pages/exchange_view/exchange_form.dart
View file

@ -18,6 +18,7 @@ import 'package:stackwallet/pages/exchange_view/exchange_step_views/step_2_view.
import 'package:stackwallet/pages/exchange_view/sub_widgets/exchange_provider_options.dart';
import 'package:stackwallet/pages/exchange_view/sub_widgets/exchange_rate_sheet.dart';
import 'package:stackwallet/pages/exchange_view/sub_widgets/rate_type_toggle.dart';
import 'package:stackwallet/pages_desktop_specific/desktop_exchange/exchange_steps/step_scaffold.dart';
import 'package:stackwallet/providers/providers.dart';
import 'package:stackwallet/services/exchange/change_now/change_now_exchange.dart';
import 'package:stackwallet/services/exchange/simpleswap/simpleswap_exchange.dart';
@ -908,20 +909,49 @@ class _ExchangeFormState extends ConsumerState<ExchangeForm> {
if (walletInitiated) {
ref.read(exchangeSendFromWalletIdStateProvider.state).state =
Tuple2(walletId!, coin!);
unawaited(
Navigator.of(context).pushNamed(
Step2View.routeName,
arguments: model,
),
);
if (isDesktop) {
await showDialog<void>(
context: context,
builder: (context) {
return const DesktopDialog(
maxWidth: 700,
child: StepScaffold(
step: 1,
),
);
},
);
} else {
unawaited(
Navigator.of(context).pushNamed(
Step2View.routeName,
arguments: model,
),
);
}
} else {
ref.read(exchangeSendFromWalletIdStateProvider.state).state = null;
unawaited(
Navigator.of(context).pushNamed(
Step1View.routeName,
arguments: model,
),
);
if (isDesktop) {
await showDialog<void>(
context: context,
builder: (context) {
return const DesktopDialog(
maxWidth: 700,
child: StepScaffold(
step: 0,
),
);
},
);
} else {
unawaited(
Navigator.of(context).pushNamed(
Step1View.routeName,
arguments: model,
),
);
}
}
}
}

55
lib/pages_desktop_specific/desktop_exchange/exchange_steps/step_scaffold.dart Normal file
View file

@ -0,0 +1,55 @@
import 'package:flutter/material.dart';
import 'package:stackwallet/pages_desktop_specific/desktop_exchange/subwidgets/desktop_exchange_steps_indicator.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart';
class StepScaffold extends StatefulWidget {
const StepScaffold({Key? key, required this.step}) : super(key: key);
final int step;
@override
State<StepScaffold> createState() => _StepScaffoldState();
}
class _StepScaffoldState extends State<StepScaffold> {
int currentStep = 0;
@override
void initState() {
currentStep = widget.step;
super.initState();
}
@override
Widget build(BuildContext context) {
return Column(
children: [
Row(
children: [
const AppBarBackButton(
isCompact: true,
),
Text(
"Exchange XXX to XXX",
style: STextStyles.desktopH3(context),
),
],
),
const SizedBox(
height: 32,
),
DesktopExchangeStepsIndicator(
currentStep: currentStep,
),
const SizedBox(
height: 32,
),
Container(
height: 200,
color: Colors.red,
),
],
);
}
}

121
lib/pages_desktop_specific/desktop_exchange/subwidgets/desktop_exchange_steps_indicator.dart Normal file
View file

@ -0,0 +1,121 @@
import 'package:flutter/material.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/widgets/rounded_container.dart';
class DesktopExchangeStepsIndicator extends StatelessWidget {
const DesktopExchangeStepsIndicator({Key? key, required this.currentStep})
: super(key: key);
final int currentStep;
Color getColor(BuildContext context, int step) {
if (currentStep > step) {
return Theme.of(context)
.extension<StackColors>()!
.accentColorBlue
.withOpacity(0.5);
} else if (currentStep < step) {
return Theme.of(context).extension<StackColors>()!.textSubtitle3;
} else {
return Theme.of(context).extension<StackColors>()!.accentColorBlue;
}
}
static const double verticalSpacing = 4;
static const double horizontalSpacing = 16;
static const double barHeight = 6;
@override
Widget build(BuildContext context) {
return Row(
children: [
Expanded(
child: Column(
children: [
Text(
"Confirm amount",
style: STextStyles.desktopTextSmall(context).copyWith(
color: getColor(context, 0),
),
),
const SizedBox(
height: verticalSpacing,
),
RoundedContainer(
color: getColor(context, 0),
height: barHeight,
),
],
),
),
const SizedBox(
width: horizontalSpacing,
),
Expanded(
child: Column(
children: [
Text(
"Enter details",
style: STextStyles.desktopTextSmall(context).copyWith(
color: getColor(context, 1),
),
),
const SizedBox(
height: verticalSpacing,
),
RoundedContainer(
color: getColor(context, 1),
height: barHeight,
),
],
),
),
const SizedBox(
width: horizontalSpacing,
),
Expanded(
child: Column(
children: [
Text(
"Confirm details",
style: STextStyles.desktopTextSmall(context).copyWith(
color: getColor(context, 2),
),
),
const SizedBox(
height: verticalSpacing,
),
RoundedContainer(
color: getColor(context, 2),
height: barHeight,
),
],
),
),
const SizedBox(
width: horizontalSpacing,
),
Expanded(
child: Column(
children: [
Text(
"Complete exchange",
style: STextStyles.desktopTextSmall(context).copyWith(
color: getColor(context, 3),
),
),
const SizedBox(
height: verticalSpacing,
),
RoundedContainer(
color: getColor(context, 3),
height: barHeight,
),
],
),
),
],
);
}
}