mirror of
https://github.com/cypherstack/stack_wallet.git
synced 2024-11-17 09:47:37 +00:00
stack privacy calls fix for small or narrow mobile screens
This commit is contained in:
julian
parent
bed25b37f7
commit
23d0ab8734
1 changed files with 175 additions and 314 deletions
|
|
@ -14,6 +14,7 @@ import 'package:stackwallet/utilities/constants.dart';
|
|||
import 'package:stackwallet/utilities/text_styles.dart';
|
||||
import 'package:stackwallet/utilities/theme/stack_colors.dart';
|
||||
import 'package:stackwallet/utilities/util.dart';
|
||||
import 'package:stackwallet/widgets/conditional_parent.dart';
|
||||
import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart';
|
||||
import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart';
|
||||
import 'package:stackwallet/widgets/desktop/desktop_scaffold.dart';
|
||||
|
|
@ -70,180 +71,195 @@ class _StackPrivacyCalls extends ConsumerState<StackPrivacyCalls> {
|
|||
),
|
||||
),
|
||||
body: SafeArea(
|
||||
child: Padding(
|
||||
padding: EdgeInsets.fromLTRB(0, isDesktop ? 0 : 40, 0, 0),
|
||||
child: ConstrainedBox(
|
||||
constraints: BoxConstraints(
|
||||
maxWidth: isDesktop ? 480 : double.infinity,
|
||||
child: ConditionalParent(
|
||||
condition: !isDesktop,
|
||||
builder: (child) => LayoutBuilder(
|
||||
builder: (context, constraints) => SingleChildScrollView(
|
||||
child: ConstrainedBox(
|
||||
constraints: BoxConstraints(
|
||||
minHeight: constraints.maxHeight,
|
||||
),
|
||||
child: IntrinsicHeight(
|
||||
child: child,
|
||||
),
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
"Choose your Stack experience",
|
||||
style: isDesktop
|
||||
? STextStyles.desktopH2(context)
|
||||
: STextStyles.pageTitleH1(context),
|
||||
),
|
||||
SizedBox(
|
||||
height: isDesktop ? 16 : 8,
|
||||
),
|
||||
Text(
|
||||
!widget.isSettings
|
||||
? "You can change it later in Settings"
|
||||
: "",
|
||||
style: isDesktop
|
||||
? STextStyles.desktopSubtitleH2(context)
|
||||
: STextStyles.subtitle(context),
|
||||
),
|
||||
SizedBox(
|
||||
height: isDesktop ? 32 : 36,
|
||||
),
|
||||
Padding(
|
||||
padding: EdgeInsets.symmetric(
|
||||
horizontal: isDesktop ? 0 : 16,
|
||||
),
|
||||
child: Padding(
|
||||
padding: EdgeInsets.fromLTRB(0, isDesktop ? 0 : 40, 0, 0),
|
||||
child: ConstrainedBox(
|
||||
constraints: BoxConstraints(
|
||||
maxWidth: isDesktop ? 480 : double.infinity,
|
||||
),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
"Choose your Stack experience",
|
||||
style: isDesktop
|
||||
? STextStyles.desktopH2(context)
|
||||
: STextStyles.pageTitleH1(context),
|
||||
),
|
||||
child: PrivacyToggle(
|
||||
externalCallsEnabled: isEasy,
|
||||
onChanged: (externalCalls) {
|
||||
isEasy = externalCalls;
|
||||
setState(() {
|
||||
infoToggle = isEasy;
|
||||
});
|
||||
},
|
||||
SizedBox(
|
||||
height: isDesktop ? 16 : 8,
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
height: isDesktop ? 16 : 36,
|
||||
),
|
||||
Padding(
|
||||
padding: isDesktop
|
||||
? const EdgeInsets.all(0)
|
||||
: const EdgeInsets.all(16.0),
|
||||
child: RoundedWhiteContainer(
|
||||
child: Center(
|
||||
child: RichText(
|
||||
textAlign: TextAlign.left,
|
||||
text: TextSpan(
|
||||
style: isDesktop
|
||||
? STextStyles.desktopTextExtraExtraSmall(context)
|
||||
: STextStyles.label(context).copyWith(
|
||||
fontSize: 12.0,
|
||||
),
|
||||
children: infoToggle
|
||||
? [
|
||||
const TextSpan(
|
||||
text:
|
||||
"Exchange data preloaded for a seamless experience."),
|
||||
const TextSpan(
|
||||
text:
|
||||
"\n\nCoinGecko enabled: (24 hour price change shown in-app, total wallet value shown in USD or other currency)."),
|
||||
TextSpan(
|
||||
text:
|
||||
"\n\nRecommended for most crypto users.",
|
||||
style: isDesktop
|
||||
? STextStyles
|
||||
.desktopTextExtraExtraSmall600(
|
||||
context)
|
||||
: TextStyle(
|
||||
color: Theme.of(context)
|
||||
.extension<StackColors>()!
|
||||
.textDark,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
Text(
|
||||
!widget.isSettings
|
||||
? "You can change it later in Settings"
|
||||
: "",
|
||||
style: isDesktop
|
||||
? STextStyles.desktopSubtitleH2(context)
|
||||
: STextStyles.subtitle(context),
|
||||
),
|
||||
SizedBox(
|
||||
height: isDesktop ? 32 : 36,
|
||||
),
|
||||
Padding(
|
||||
padding: EdgeInsets.symmetric(
|
||||
horizontal: isDesktop ? 0 : 16,
|
||||
),
|
||||
child: PrivacyToggle(
|
||||
externalCallsEnabled: isEasy,
|
||||
onChanged: (externalCalls) {
|
||||
isEasy = externalCalls;
|
||||
setState(() {
|
||||
infoToggle = isEasy;
|
||||
});
|
||||
},
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
height: isDesktop ? 16 : 36,
|
||||
),
|
||||
Padding(
|
||||
padding: isDesktop
|
||||
? const EdgeInsets.all(0)
|
||||
: const EdgeInsets.all(16.0),
|
||||
child: RoundedWhiteContainer(
|
||||
child: Center(
|
||||
child: RichText(
|
||||
textAlign: TextAlign.left,
|
||||
text: TextSpan(
|
||||
style: isDesktop
|
||||
? STextStyles.desktopTextExtraExtraSmall(context)
|
||||
: STextStyles.label(context).copyWith(
|
||||
fontSize: 12.0,
|
||||
),
|
||||
]
|
||||
: [
|
||||
const TextSpan(
|
||||
children: infoToggle
|
||||
? [
|
||||
const TextSpan(
|
||||
text:
|
||||
"Exchange data preloaded for a seamless experience."),
|
||||
const TextSpan(
|
||||
text:
|
||||
"\n\nCoinGecko enabled: (24 hour price change shown in-app, total wallet value shown in USD or other currency)."),
|
||||
TextSpan(
|
||||
text:
|
||||
"Exchange data not preloaded (slower experience)."),
|
||||
const TextSpan(
|
||||
"\n\nRecommended for most crypto users.",
|
||||
style: isDesktop
|
||||
? STextStyles
|
||||
.desktopTextExtraExtraSmall600(
|
||||
context)
|
||||
: TextStyle(
|
||||
color: Theme.of(context)
|
||||
.extension<StackColors>()!
|
||||
.textDark,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
]
|
||||
: [
|
||||
const TextSpan(
|
||||
text:
|
||||
"Exchange data not preloaded (slower experience)."),
|
||||
const TextSpan(
|
||||
text:
|
||||
"\n\nCoinGecko disabled (price changes not shown, no wallet value shown in other currencies)."),
|
||||
TextSpan(
|
||||
text:
|
||||
"\n\nCoinGecko disabled (price changes not shown, no wallet value shown in other currencies)."),
|
||||
TextSpan(
|
||||
text:
|
||||
"\n\nRecommended for the privacy conscious.",
|
||||
style: isDesktop
|
||||
? STextStyles
|
||||
.desktopTextExtraExtraSmall600(
|
||||
context)
|
||||
: TextStyle(
|
||||
color: Theme.of(context)
|
||||
.extension<StackColors>()!
|
||||
.textDark,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
],
|
||||
"\n\nRecommended for the privacy conscious.",
|
||||
style: isDesktop
|
||||
? STextStyles
|
||||
.desktopTextExtraExtraSmall600(
|
||||
context)
|
||||
: TextStyle(
|
||||
color: Theme.of(context)
|
||||
.extension<StackColors>()!
|
||||
.textDark,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
if (!isDesktop)
|
||||
const Spacer(
|
||||
flex: 4,
|
||||
),
|
||||
if (isDesktop)
|
||||
const SizedBox(
|
||||
height: 32,
|
||||
),
|
||||
Padding(
|
||||
padding: isDesktop
|
||||
? const EdgeInsets.all(0)
|
||||
: const EdgeInsets.symmetric(
|
||||
horizontal: 16,
|
||||
vertical: 16,
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: PrimaryButton(
|
||||
label:
|
||||
!widget.isSettings ? "Continue" : "Save changes",
|
||||
onPressed: () {
|
||||
ref
|
||||
.read(prefsChangeNotifierProvider)
|
||||
.externalCalls = isEasy;
|
||||
if (!isDesktop)
|
||||
const Spacer(
|
||||
flex: 4,
|
||||
),
|
||||
if (isDesktop)
|
||||
const SizedBox(
|
||||
height: 32,
|
||||
),
|
||||
Padding(
|
||||
padding: isDesktop
|
||||
? const EdgeInsets.all(0)
|
||||
: const EdgeInsets.symmetric(
|
||||
horizontal: 16,
|
||||
vertical: 16,
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: PrimaryButton(
|
||||
label:
|
||||
!widget.isSettings ? "Continue" : "Save changes",
|
||||
onPressed: () {
|
||||
ref
|
||||
.read(prefsChangeNotifierProvider)
|
||||
.externalCalls = isEasy;
|
||||
|
||||
DB.instance
|
||||
.put<dynamic>(
|
||||
boxName: DB.boxNamePrefs,
|
||||
key: "externalCalls",
|
||||
value: isEasy)
|
||||
.then((_) {
|
||||
if (isEasy) {
|
||||
unawaited(
|
||||
ExchangeDataLoadingService().loadAll(ref));
|
||||
ref
|
||||
.read(priceAnd24hChangeNotifierProvider)
|
||||
.start(true);
|
||||
}
|
||||
});
|
||||
if (!widget.isSettings) {
|
||||
if (isDesktop) {
|
||||
Navigator.of(context).pushNamed(
|
||||
CreatePasswordView.routeName,
|
||||
);
|
||||
DB.instance
|
||||
.put<dynamic>(
|
||||
boxName: DB.boxNamePrefs,
|
||||
key: "externalCalls",
|
||||
value: isEasy)
|
||||
.then((_) {
|
||||
if (isEasy) {
|
||||
unawaited(
|
||||
ExchangeDataLoadingService().loadAll(ref));
|
||||
ref
|
||||
.read(priceAnd24hChangeNotifierProvider)
|
||||
.start(true);
|
||||
}
|
||||
});
|
||||
if (!widget.isSettings) {
|
||||
if (isDesktop) {
|
||||
Navigator.of(context).pushNamed(
|
||||
CreatePasswordView.routeName,
|
||||
);
|
||||
} else {
|
||||
Navigator.of(context).pushNamed(
|
||||
CreatePinView.routeName,
|
||||
);
|
||||
}
|
||||
} else {
|
||||
Navigator.of(context).pushNamed(
|
||||
CreatePinView.routeName,
|
||||
);
|
||||
Navigator.pop(context);
|
||||
}
|
||||
} else {
|
||||
Navigator.pop(context);
|
||||
}
|
||||
},
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
if (isDesktop)
|
||||
const SizedBox(
|
||||
height: kDesktopAppBarHeight,
|
||||
),
|
||||
],
|
||||
if (isDesktop)
|
||||
const SizedBox(
|
||||
height: kDesktopAppBarHeight,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
@ -494,158 +510,3 @@ class _PrivacyToggleState extends State<PrivacyToggle> {
|
|||
);
|
||||
}
|
||||
}
|
||||
|
||||
// class ContinueButton extends ConsumerWidget {
|
||||
// const ContinueButton({
|
||||
// Key? key,
|
||||
// required this.isDesktop,
|
||||
// required this.onPressed,
|
||||
// required this.label,
|
||||
// }) : super(key: key);
|
||||
//
|
||||
// final String label;
|
||||
// final bool isDesktop;
|
||||
// final VoidCallback onPressed;
|
||||
//
|
||||
// @override
|
||||
// Widget build(BuildContext context, WidgetRef ref) {
|
||||
// if (isDesktop) {
|
||||
// return SizedBox(
|
||||
// width: 328,
|
||||
// height: 70,
|
||||
// child: TextButton(
|
||||
// style: Theme.of(context)
|
||||
// .extension<StackColors>()!
|
||||
// .getPrimaryEnabledButtonColor(context),
|
||||
// onPressed: onPressed,
|
||||
// child: Text(
|
||||
// label,
|
||||
// style: STextStyles.button(context).copyWith(fontSize: 20),
|
||||
// ),
|
||||
// ),
|
||||
// );
|
||||
// } else {
|
||||
// return TextButton(
|
||||
// style: Theme.of(context)
|
||||
// .extension<StackColors>()!
|
||||
// .getPrimaryEnabledButtonColor(context),
|
||||
// onPressed: onPressed,
|
||||
// child: Text(
|
||||
// label,
|
||||
// style: STextStyles.button(context),
|
||||
// ),
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// class CustomRadio extends StatefulWidget {
|
||||
// CustomRadio(this.upperCall, {Key? key}) : super(key: key);
|
||||
//
|
||||
// Function upperCall;
|
||||
//
|
||||
// @override
|
||||
// createState() {
|
||||
// return CustomRadioState();
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// class CustomRadioState extends State<CustomRadio> {
|
||||
// List<RadioModel> sampleData = <RadioModel>[];
|
||||
//
|
||||
// @override
|
||||
// void initState() {
|
||||
// super.initState();
|
||||
// sampleData.add(
|
||||
// RadioModel(true, Assets.svg.personaEasy, 'Easy Crypto', 'Recommended'));
|
||||
// sampleData.add(RadioModel(
|
||||
// false, Assets.svg.personaIncognito, 'Incognito', 'Privacy conscious'));
|
||||
// }
|
||||
//
|
||||
// @override
|
||||
// Widget build(BuildContext context) {
|
||||
// return Row(
|
||||
// mainAxisAlignment: MainAxisAlignment.center,
|
||||
// children: [
|
||||
// InkWell(
|
||||
// onTap: () {
|
||||
// setState(() {
|
||||
// // if (!sampleData[0].isSelected) {
|
||||
// widget.upperCall.call(true);
|
||||
// // }
|
||||
// for (var element in sampleData) {
|
||||
// element.isSelected = false;
|
||||
// }
|
||||
// sampleData[0].isSelected = true;
|
||||
// });
|
||||
// },
|
||||
// child: RadioItem(sampleData[0]),
|
||||
// ),
|
||||
// InkWell(
|
||||
// onTap: () {
|
||||
// setState(() {
|
||||
// // if (!sampleData[1].isSelected) {
|
||||
// widget.upperCall.call(false);
|
||||
// // }
|
||||
// for (var element in sampleData) {
|
||||
// element.isSelected = false;
|
||||
// }
|
||||
// sampleData[1].isSelected = true;
|
||||
// });
|
||||
// },
|
||||
// child: RadioItem(sampleData[1]),
|
||||
// )
|
||||
// ],
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// class RadioItem extends StatelessWidget {
|
||||
// final RadioModel _item;
|
||||
// const RadioItem(this._item, {Key? key}) : super(key: key);
|
||||
// @override
|
||||
// Widget build(BuildContext context) {
|
||||
// return Container(
|
||||
// margin: const EdgeInsets.all(15.0),
|
||||
// child: RoundedWhiteContainer(
|
||||
// borderColor: _item.isSelected ? const Color(0xFF0056D2) : null,
|
||||
// child: Center(
|
||||
// child: Column(
|
||||
// children: [
|
||||
// SvgPicture.asset(
|
||||
// _item.svg,
|
||||
// // color: Theme.of(context).extension<StackColors>()!.textWhite,
|
||||
// width: 140,
|
||||
// height: 140,
|
||||
// ),
|
||||
// RichText(
|
||||
// textAlign: TextAlign.center,
|
||||
// text: TextSpan(
|
||||
// style: STextStyles.label(context).copyWith(fontSize: 12.0),
|
||||
// children: [
|
||||
// TextSpan(
|
||||
// text: _item.topText,
|
||||
// style: TextStyle(
|
||||
// color: Theme.of(context)
|
||||
// .extension<StackColors>()!
|
||||
// .textDark,
|
||||
// fontWeight: FontWeight.bold)),
|
||||
// TextSpan(text: "\n${_item.bottomText}"),
|
||||
// ],
|
||||
// ),
|
||||
// ),
|
||||
// ],
|
||||
// )),
|
||||
// ),
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// class RadioModel {
|
||||
// bool isSelected;
|
||||
// final String svg;
|
||||
// final String topText;
|
||||
// final String bottomText;
|
||||
//
|
||||
// RadioModel(this.isSelected, this.svg, this.topText, this.bottomText);
|
||||
// }
|
||||
|
|
|
|||
Loading…
Reference in a new issue