working on theme toggles

This commit is contained in:
ryleedavis 2022-10-26 16:29:51 -06:00
parent a6a7d56647
commit fa48ab30f5

View file

@ -4,8 +4,13 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/svg.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/widgets/rounded_white_container.dart';
import '../../../providers/global/prefs_provider.dart';
import '../../../utilities/constants.dart';
import '../../../widgets/custom_buttons/draggable_switch_button.dart';
class AppearanceOptionSettings extends ConsumerStatefulWidget {
const AppearanceOptionSettings({Key? key}) : super(key: key);
@ -61,6 +66,74 @@ class _AppearanceOptionSettings
),
],
),
const Padding(
padding: EdgeInsets.all(10.0),
child: Divider(
thickness: 0.5,
),
),
Padding(
padding: const EdgeInsets.all(10.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"Display favorite wallets",
style: STextStyles.desktopTextExtraSmall(context)
.copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textDark),
textAlign: TextAlign.left,
),
SizedBox(
height: 20,
width: 40,
child: DraggableSwitchButton(
isOn: ref.watch(
prefsChangeNotifierProvider
.select((value) => value.showFavoriteWallets),
),
onValueChanged: (newValue) {
ref
.read(prefsChangeNotifierProvider)
.showFavoriteWallets = newValue;
},
),
)
],
),
),
const Padding(
padding: EdgeInsets.all(10.0),
child: Divider(
thickness: 0.5,
),
),
Padding(
padding: const EdgeInsets.all(10.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"Choose theme",
style: STextStyles.desktopTextExtraSmall(context)
.copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textDark),
textAlign: TextAlign.left,
),
],
),
),
const Padding(
padding: EdgeInsets.only(
left: 10,
right: 10,
),
child: ThemeToggle(),
),
],
),
),
@ -69,3 +142,174 @@ class _AppearanceOptionSettings
);
}
}
class ThemeToggle extends StatefulWidget {
const ThemeToggle({
Key? key,
}) : super(key: key);
// final bool externalCallsEnabled;
// final void Function(bool)? onChanged;
@override
State<StatefulWidget> createState() => _ThemeToggle();
}
class _ThemeToggle extends State<ThemeToggle> {
// late bool externalCallsEnabled;
@override
Widget build(BuildContext context) {
return Row(
// mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: RawMaterialButton(
elevation: 0,
hoverColor: Colors.transparent,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius * 2,
),
),
onPressed: () {}, //onPressed
child: Stack(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.only(
left: 24,
),
child: SvgPicture.asset(
Assets.svg.themeLight,
),
),
Padding(
padding: const EdgeInsets.only(
left: 50,
top: 12,
),
child: Text(
"Light",
style:
STextStyles.desktopTextExtraSmall(context).copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textDark,
),
),
)
],
),
// if (externalCallsEnabled)
Positioned(
bottom: 0,
left: 6,
child: SvgPicture.asset(
Assets.svg.checkCircle,
width: 20,
height: 20,
color: Theme.of(context)
.extension<StackColors>()!
.infoItemIcons,
),
),
// if (!externalCallsEnabled)
// Positioned(
// top: 4,
// right: 4,
// child: Container(
// width: 20,
// height: 20,
// decoration: BoxDecoration(
// borderRadius: BorderRadius.circular(1000),
// color: Theme.of(context)
// .extension<StackColors>()!
// .textFieldDefaultBG,
// ),
// ),
// ),
],
),
),
),
const SizedBox(
width: 1,
),
Expanded(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: RawMaterialButton(
elevation: 0,
hoverColor: Colors.transparent,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius * 2,
),
),
onPressed: () {}, //onPressed
child: Stack(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SvgPicture.asset(
Assets.svg.themeDark,
),
Padding(
padding: const EdgeInsets.only(
left: 50,
top: 12,
),
child: Text(
"Dark",
style: STextStyles.desktopTextExtraSmall(context)
.copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textDark,
),
),
),
],
),
// if (externalCallsEnabled)
Positioned(
bottom: 0,
left: 0,
child: SvgPicture.asset(
Assets.svg.checkCircle,
width: 20,
height: 20,
color: Theme.of(context)
.extension<StackColors>()!
.infoItemIcons,
),
),
// if (!externalCallsEnabled)
// Positioned(
// top: 4,
// right: 4,
// child: Container(
// width: 20,
// height: 20,
// decoration: BoxDecoration(
// borderRadius: BorderRadius.circular(1000),
// color: Theme.of(context)
// .extension<StackColors>()!
// .textFieldDefaultBG,
// ),
// ),
// ),
],
),
),
),
),
],
);
}
}