mirror of
https://github.com/cake-tech/cake_wallet.git
synced 2025-01-23 11:15:33 +00:00
CWA-216 | applied new design to disclaimer page and faq page
This commit is contained in:
parent
1bed82327b
commit
2356cda879
2 changed files with 338 additions and 267 deletions
|
@ -6,6 +6,8 @@ import 'package:cake_wallet/palette.dart';
|
|||
import 'package:url_launcher/url_launcher.dart';
|
||||
import 'package:cake_wallet/src/screens/base_page.dart';
|
||||
import 'package:cake_wallet/src/widgets/primary_button.dart';
|
||||
import 'package:cake_wallet/src/widgets/alert_with_one_action.dart';
|
||||
import 'package:cake_wallet/generated/i18n.dart';
|
||||
|
||||
class DisclaimerPage extends BasePage {
|
||||
DisclaimerPage({this.isReadOnly = false});
|
||||
|
@ -13,7 +15,7 @@ class DisclaimerPage extends BasePage {
|
|||
final bool isReadOnly;
|
||||
|
||||
@override
|
||||
bool get isModalBackButton => false;
|
||||
Color get backgroundColor => PaletteDark.historyPanel;
|
||||
|
||||
@override
|
||||
String get title => 'Terms of Use';
|
||||
|
@ -34,7 +36,7 @@ class DisclaimerPageBody extends StatefulWidget {
|
|||
class DisclaimerBodyState extends State<DisclaimerPageBody> {
|
||||
DisclaimerBodyState(this._isAccepted);
|
||||
|
||||
static const xmrtoUrl = 'https://xmr.to/app_static/html/tos.html';
|
||||
static const xmrtoUrl = 'https://xmr.to/terms-of-service';
|
||||
static const changenowUrl = 'https://changenow.io/terms-of-use';
|
||||
static const morphUrl = 'http://morphtoken.com/terms';
|
||||
|
||||
|
@ -55,22 +57,11 @@ class DisclaimerBodyState extends State<DisclaimerPageBody> {
|
|||
await showDialog<void>(
|
||||
context: context,
|
||||
builder: (BuildContext context) {
|
||||
return AlertDialog(
|
||||
title: Text(
|
||||
'Terms and conditions',
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
content: Text(
|
||||
'By using this app, you agree to the Terms of Agreement set forth to below',
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
actions: <Widget>[
|
||||
FlatButton(
|
||||
onPressed: () {
|
||||
Navigator.of(context).pop();
|
||||
},
|
||||
child: Text('OK')),
|
||||
],
|
||||
return AlertWithOneAction(
|
||||
alertTitle: 'Terms and conditions',
|
||||
alertContent: 'By using this app, you agree to the Terms of Agreement set forth to below',
|
||||
buttonText: S.of(context).ok,
|
||||
buttonAction: () => Navigator.of(context).pop()
|
||||
);
|
||||
});
|
||||
}
|
||||
|
@ -86,245 +77,255 @@ class DisclaimerBodyState extends State<DisclaimerPageBody> {
|
|||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Column(
|
||||
children: <Widget>[
|
||||
SizedBox(height: 10.0),
|
||||
Expanded(
|
||||
child: Stack(
|
||||
children: <Widget>[
|
||||
SingleChildScrollView(
|
||||
padding: EdgeInsets.only(left: 25.0, right: 25.0),
|
||||
child: Column(
|
||||
return Container(
|
||||
color: PaletteDark.historyPanel,
|
||||
child: Column(
|
||||
children: <Widget>[
|
||||
SizedBox(height: 10.0),
|
||||
Expanded(
|
||||
child: Stack(
|
||||
children: <Widget>[
|
||||
!_isAccepted
|
||||
? Row(
|
||||
SingleChildScrollView(
|
||||
padding: EdgeInsets.only(left: 24.0, right: 24.0),
|
||||
child: Column(
|
||||
children: <Widget>[
|
||||
!_isAccepted
|
||||
? Row(
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Terms and conditions',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 20.0,
|
||||
fontWeight: FontWeight.bold),
|
||||
fontSize: 20.0,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white
|
||||
),
|
||||
),
|
||||
)
|
||||
],
|
||||
)
|
||||
: Offstage(),
|
||||
!_isAccepted
|
||||
? SizedBox(
|
||||
: Offstage(),
|
||||
!_isAccepted
|
||||
? SizedBox(
|
||||
height: 20.0,
|
||||
)
|
||||
: Offstage(),
|
||||
Row(
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Legal Disclaimer\nAnd\nTerms of Use',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 12.0, fontWeight: FontWeight.bold),
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: 16.0,
|
||||
),
|
||||
Row(
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Text(
|
||||
_fileText,
|
||||
style: TextStyle(fontSize: 12.0),
|
||||
))
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: 16.0,
|
||||
),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Other Terms and Conditions',
|
||||
textAlign: TextAlign.left,
|
||||
style: TextStyle(
|
||||
fontSize: 14.0, fontWeight: FontWeight.bold),
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: 16.0,
|
||||
),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: GestureDetector(
|
||||
onTap: () => launchUrl(xmrtoUrl),
|
||||
child: Text(
|
||||
xmrtoUrl,
|
||||
textAlign: TextAlign.left,
|
||||
style: TextStyle(
|
||||
color: Colors.blue,
|
||||
fontSize: 14.0,
|
||||
fontWeight: FontWeight.normal,
|
||||
decoration: TextDecoration.underline),
|
||||
),
|
||||
))
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: 16.0,
|
||||
),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: GestureDetector(
|
||||
onTap: () => launchUrl(changenowUrl),
|
||||
child: Text(
|
||||
changenowUrl,
|
||||
textAlign: TextAlign.left,
|
||||
style: TextStyle(
|
||||
color: Colors.blue,
|
||||
fontSize: 14.0,
|
||||
fontWeight: FontWeight.normal,
|
||||
decoration: TextDecoration.underline),
|
||||
),
|
||||
))
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: 16.0,
|
||||
),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: GestureDetector(
|
||||
onTap: () => launchUrl(morphUrl),
|
||||
child: Text(
|
||||
morphUrl,
|
||||
textAlign: TextAlign.left,
|
||||
style: TextStyle(
|
||||
color: Colors.blue,
|
||||
fontSize: 14.0,
|
||||
fontWeight: FontWeight.normal,
|
||||
decoration: TextDecoration.underline),
|
||||
),
|
||||
))
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: 16.0,
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
alignment: Alignment.bottomCenter,
|
||||
child: Container(
|
||||
height: 12.0,
|
||||
child: ClipRect(
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 0.7, sigmaY: 0.7),
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
colors: [
|
||||
Theme.of(context).backgroundColor.withOpacity(0.0),
|
||||
Theme.of(context).backgroundColor,
|
||||
: Offstage(),
|
||||
Row(
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Legal Disclaimer\nAnd\nTerms of Use',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 12.0,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white
|
||||
),
|
||||
),
|
||||
)
|
||||
],
|
||||
begin: FractionalOffset.topCenter,
|
||||
end: FractionalOffset.bottomCenter,
|
||||
),
|
||||
SizedBox(
|
||||
height: 16.0,
|
||||
),
|
||||
Row(
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Text(
|
||||
_fileText,
|
||||
style: TextStyle(
|
||||
fontSize: 12.0,
|
||||
color: Colors.white
|
||||
),
|
||||
))
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: 16.0,
|
||||
),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Other Terms and Conditions',
|
||||
textAlign: TextAlign.left,
|
||||
style: TextStyle(
|
||||
fontSize: 14.0,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white
|
||||
),
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: 16.0,
|
||||
),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: GestureDetector(
|
||||
onTap: () => launchUrl(xmrtoUrl),
|
||||
child: Text(
|
||||
xmrtoUrl,
|
||||
textAlign: TextAlign.left,
|
||||
style: TextStyle(
|
||||
color: Colors.blue,
|
||||
fontSize: 14.0,
|
||||
fontWeight: FontWeight.normal,
|
||||
decoration: TextDecoration.underline),
|
||||
),
|
||||
))
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: 16.0,
|
||||
),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: GestureDetector(
|
||||
onTap: () => launchUrl(changenowUrl),
|
||||
child: Text(
|
||||
changenowUrl,
|
||||
textAlign: TextAlign.left,
|
||||
style: TextStyle(
|
||||
color: Colors.blue,
|
||||
fontSize: 14.0,
|
||||
fontWeight: FontWeight.normal,
|
||||
decoration: TextDecoration.underline),
|
||||
),
|
||||
))
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: 16.0,
|
||||
),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: GestureDetector(
|
||||
onTap: () => launchUrl(morphUrl),
|
||||
child: Text(
|
||||
morphUrl,
|
||||
textAlign: TextAlign.left,
|
||||
style: TextStyle(
|
||||
color: Colors.blue,
|
||||
fontSize: 14.0,
|
||||
fontWeight: FontWeight.normal,
|
||||
decoration: TextDecoration.underline),
|
||||
),
|
||||
))
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: 16.0,
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
alignment: Alignment.bottomCenter,
|
||||
child: Container(
|
||||
height: 12.0,
|
||||
child: ClipRect(
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 0.7, sigmaY: 0.7),
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
colors: [
|
||||
PaletteDark.historyPanel.withOpacity(0.0),
|
||||
PaletteDark.historyPanel,
|
||||
],
|
||||
begin: FractionalOffset.topCenter,
|
||||
end: FractionalOffset.bottomCenter,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
)
|
||||
],
|
||||
)),
|
||||
if (!widget.isReadOnly) ...[
|
||||
!_isAccepted
|
||||
? Row(
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Container(
|
||||
padding: EdgeInsets.only(
|
||||
left: 24.0, top: 10.0, right: 24.0, bottom: 10.0),
|
||||
child: InkWell(
|
||||
onTap: () {
|
||||
setState(() {
|
||||
_checked = !_checked;
|
||||
});
|
||||
},
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Container(
|
||||
height: 24.0,
|
||||
width: 24.0,
|
||||
margin: EdgeInsets.only(
|
||||
right: 10.0,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(
|
||||
color: Palette.lightGrey, width: 1.0),
|
||||
borderRadius: BorderRadius.all(
|
||||
Radius.circular(8.0)),
|
||||
color: PaletteDark.historyPanel),
|
||||
child: _checked
|
||||
? Icon(
|
||||
Icons.check,
|
||||
color: Colors.blue,
|
||||
size: 20.0,
|
||||
)
|
||||
: null,
|
||||
),
|
||||
Text(
|
||||
'I agree to Terms of Use',
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 14.0,
|
||||
color: Colors.white
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
)),
|
||||
),
|
||||
],
|
||||
)
|
||||
: Offstage(),
|
||||
!_isAccepted
|
||||
? Container(
|
||||
padding:
|
||||
EdgeInsets.only(left: 24.0, right: 24.0, bottom: 24.0),
|
||||
child: PrimaryButton(
|
||||
onPressed: _checked ? () {} : null,
|
||||
text: 'Accept',
|
||||
color: Colors.green,
|
||||
textColor: Colors.white,
|
||||
),
|
||||
)
|
||||
: Offstage(),
|
||||
_isAccepted
|
||||
? SizedBox(
|
||||
height: 24.0,
|
||||
)
|
||||
: Offstage()
|
||||
],
|
||||
)),
|
||||
if (!widget.isReadOnly) ...[
|
||||
!_isAccepted
|
||||
? Row(
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Container(
|
||||
padding: EdgeInsets.only(
|
||||
left: 25.0, top: 10.0, right: 25.0, bottom: 10.0),
|
||||
child: InkWell(
|
||||
onTap: () {
|
||||
setState(() {
|
||||
_checked = !_checked;
|
||||
});
|
||||
},
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Container(
|
||||
height: 25.0,
|
||||
width: 25.0,
|
||||
margin: EdgeInsets.only(
|
||||
right: 10.0,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(
|
||||
color: Palette.lightGrey, width: 1.0),
|
||||
borderRadius: BorderRadius.all(
|
||||
Radius.circular(8.0)),
|
||||
color: Theme.of(context).backgroundColor),
|
||||
child: _checked
|
||||
? Icon(
|
||||
Icons.check,
|
||||
color: Colors.blue,
|
||||
size: 20.0,
|
||||
)
|
||||
: null,
|
||||
),
|
||||
Text(
|
||||
'I agree to Terms of Use',
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 14.0),
|
||||
)
|
||||
],
|
||||
),
|
||||
)),
|
||||
),
|
||||
],
|
||||
)
|
||||
: Offstage(),
|
||||
!_isAccepted
|
||||
? Container(
|
||||
padding:
|
||||
EdgeInsets.only(left: 25.0, right: 25.0, bottom: 25.0),
|
||||
child: PrimaryButton(
|
||||
onPressed: _checked ? () {} : null,
|
||||
text: 'Accept',
|
||||
color: Theme.of(context)
|
||||
.primaryTextTheme
|
||||
.button
|
||||
.backgroundColor,
|
||||
textColor: Theme.of(context)
|
||||
.primaryTextTheme
|
||||
.button
|
||||
.color,
|
||||
),
|
||||
)
|
||||
: Offstage(),
|
||||
_isAccepted
|
||||
? SizedBox(
|
||||
height: 20.0,
|
||||
)
|
||||
: Offstage()
|
||||
],
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
import 'dart:convert';
|
||||
import 'package:cake_wallet/palette.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
import 'package:cake_wallet/generated/i18n.dart';
|
||||
import 'package:cake_wallet/src/stores/settings/settings_store.dart';
|
||||
import 'package:cake_wallet/src/screens/base_page.dart';
|
||||
import 'package:cake_wallet/palette.dart';
|
||||
|
||||
class FaqPage extends BasePage {
|
||||
@override
|
||||
|
@ -15,7 +15,23 @@ class FaqPage extends BasePage {
|
|||
Color get backgroundColor => PaletteDark.historyPanel;
|
||||
|
||||
@override
|
||||
Widget body(BuildContext context) {
|
||||
Widget body(BuildContext context) => FaqForm();
|
||||
}
|
||||
|
||||
class FaqForm extends StatefulWidget {
|
||||
@override
|
||||
FaqFormState createState() => FaqFormState();
|
||||
}
|
||||
|
||||
class FaqFormState extends State<FaqForm> {
|
||||
final addIcon = Icon(Icons.add, color: Colors.white);
|
||||
final removeIcon = Icon(Icons.remove, color: Colors.green);
|
||||
List<Icon> icons;
|
||||
List<Color> colors;
|
||||
bool isLoaded = false;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
color: PaletteDark.historyPanel,
|
||||
padding: EdgeInsets.only(top: 12),
|
||||
|
@ -25,36 +41,79 @@ class FaqPage extends BasePage {
|
|||
builder: (context, snapshot) {
|
||||
final faqItems = jsonDecode(snapshot.data.toString()) as List;
|
||||
|
||||
return ListView.separated(
|
||||
itemBuilder: (BuildContext context, int index) {
|
||||
final itemTitle = faqItems[index]["question"].toString();
|
||||
final itemChild = faqItems[index]["answer"].toString();
|
||||
if (snapshot.hasData) {
|
||||
setIconsAndColors(faqItems.length);
|
||||
}
|
||||
|
||||
return ExpansionTile(
|
||||
title: Padding(
|
||||
padding: EdgeInsets.only(left: 8, top: 12, bottom: 12),
|
||||
child: Text(itemTitle),
|
||||
),
|
||||
backgroundColor: PaletteDark.menuHeader,
|
||||
children: <Widget>[
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Container(
|
||||
padding: EdgeInsets.only(left: 24.0, right: 24.0, bottom: 4),
|
||||
child: Text(
|
||||
itemChild,
|
||||
),
|
||||
))
|
||||
],
|
||||
)
|
||||
],
|
||||
);
|
||||
},
|
||||
separatorBuilder: (_, __) =>
|
||||
Divider(color: PaletteDark.mainBackgroundColor, height: 1.0),
|
||||
itemCount: faqItems == null ? 0 : faqItems.length,
|
||||
return SingleChildScrollView(
|
||||
child: ListView.separated(
|
||||
shrinkWrap: true,
|
||||
physics: NeverScrollableScrollPhysics(),
|
||||
itemBuilder: (BuildContext context, int index) {
|
||||
final itemTitle = faqItems[index]["question"].toString();
|
||||
final itemChild = faqItems[index]["answer"].toString();
|
||||
|
||||
return ExpansionTile(
|
||||
title: Padding(
|
||||
padding: EdgeInsets.only(left: 8, top: 12, bottom: 12),
|
||||
child: Text(
|
||||
itemTitle,
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: colors[index]
|
||||
),
|
||||
),
|
||||
),
|
||||
trailing: Padding(
|
||||
padding: EdgeInsets.only(right: 24),
|
||||
child: Container(
|
||||
width: double.minPositive,
|
||||
child: Center(
|
||||
child: icons[index]
|
||||
),
|
||||
),
|
||||
),
|
||||
backgroundColor: PaletteDark.menuHeader,
|
||||
onExpansionChanged: (value) {
|
||||
setState(() {
|
||||
if (value) {
|
||||
icons[index] = removeIcon;
|
||||
colors[index] = Colors.green;
|
||||
} else {
|
||||
icons[index] = addIcon;
|
||||
colors[index] = Colors.white;
|
||||
}
|
||||
});
|
||||
},
|
||||
children: <Widget>[
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Container(
|
||||
padding: EdgeInsets.only(
|
||||
left: 24.0,
|
||||
right: 24.0,
|
||||
bottom: 8
|
||||
),
|
||||
child: Text(
|
||||
itemChild,
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
color: Colors.white
|
||||
),
|
||||
),
|
||||
))
|
||||
],
|
||||
)
|
||||
],
|
||||
);
|
||||
},
|
||||
separatorBuilder: (_, __) =>
|
||||
Container(color: PaletteDark.mainBackgroundColor, height: 1.0),
|
||||
itemCount: faqItems == null ? 0 : faqItems.length,
|
||||
),
|
||||
);
|
||||
},
|
||||
future: rootBundle.loadString(getFaqPath(context)),
|
||||
|
@ -63,6 +122,17 @@ class FaqPage extends BasePage {
|
|||
);
|
||||
}
|
||||
|
||||
void setIconsAndColors(int index) {
|
||||
if (isLoaded) {
|
||||
return;
|
||||
}
|
||||
|
||||
icons = List.generate(index, (int i) => addIcon);
|
||||
colors = List.generate(index, (int i) => Colors.white);
|
||||
|
||||
isLoaded = true;
|
||||
}
|
||||
|
||||
String getFaqPath(BuildContext context) {
|
||||
final settingsStore = Provider.of<SettingsStore>(context);
|
||||
|
||||
|
@ -95,4 +165,4 @@ class FaqPage extends BasePage {
|
|||
return 'assets/faq/faq_en.json';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Reference in a new issue