mirror of
https://github.com/ente-io/ente.git
synced 2025-08-05 22:27:58 +00:00
[mob][photos] Move SubscriptionToggle widget to subscription_common_widgets.dart
This commit is contained in:
parent
bebaa76085
commit
41f59ec9ca
@ -578,118 +578,3 @@ class _StripeSubscriptionPageState extends State<StripeSubscriptionPage> {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
class SubscriptionToggle extends StatefulWidget {
|
|
||||||
final Function(bool) onToggle;
|
|
||||||
const SubscriptionToggle({required this.onToggle, super.key});
|
|
||||||
|
|
||||||
@override
|
|
||||||
State<SubscriptionToggle> createState() => _SubscriptionToggleState();
|
|
||||||
}
|
|
||||||
|
|
||||||
class _SubscriptionToggleState extends State<SubscriptionToggle> {
|
|
||||||
bool _isYearly = true;
|
|
||||||
@override
|
|
||||||
Widget build(BuildContext context) {
|
|
||||||
const borderPadding = 2.5;
|
|
||||||
const spaceBetweenButtons = 4.0;
|
|
||||||
final textTheme = getEnteTextTheme(context);
|
|
||||||
return Padding(
|
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 32),
|
|
||||||
child: LayoutBuilder(
|
|
||||||
builder: (context, constrains) {
|
|
||||||
final widthOfButton = (constrains.maxWidth -
|
|
||||||
(borderPadding * 2) -
|
|
||||||
spaceBetweenButtons) /
|
|
||||||
2;
|
|
||||||
return Container(
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
color: getEnteColorScheme(context).fillBaseGrey,
|
|
||||||
borderRadius: BorderRadius.circular(50),
|
|
||||||
),
|
|
||||||
padding: const EdgeInsets.symmetric(
|
|
||||||
vertical: borderPadding,
|
|
||||||
horizontal: borderPadding,
|
|
||||||
),
|
|
||||||
width: double.infinity,
|
|
||||||
child: Stack(
|
|
||||||
children: [
|
|
||||||
Row(
|
|
||||||
children: [
|
|
||||||
GestureDetector(
|
|
||||||
onTap: () {
|
|
||||||
setIsYearly(false);
|
|
||||||
},
|
|
||||||
behavior: HitTestBehavior.opaque,
|
|
||||||
child: Container(
|
|
||||||
padding: const EdgeInsets.symmetric(
|
|
||||||
vertical: 8,
|
|
||||||
),
|
|
||||||
width: widthOfButton,
|
|
||||||
child: Center(
|
|
||||||
child: Text(
|
|
||||||
"Monthly",
|
|
||||||
style: textTheme.bodyFaint,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
const SizedBox(width: spaceBetweenButtons),
|
|
||||||
GestureDetector(
|
|
||||||
onTap: () {
|
|
||||||
setIsYearly(true);
|
|
||||||
},
|
|
||||||
behavior: HitTestBehavior.opaque,
|
|
||||||
child: Container(
|
|
||||||
padding: const EdgeInsets.symmetric(
|
|
||||||
vertical: 8,
|
|
||||||
),
|
|
||||||
width: widthOfButton,
|
|
||||||
child: Center(
|
|
||||||
child: Text(
|
|
||||||
"Yearly",
|
|
||||||
style: textTheme.bodyFaint,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
AnimatedPositioned(
|
|
||||||
duration: const Duration(milliseconds: 350),
|
|
||||||
curve: Curves.easeInOutQuart,
|
|
||||||
left: _isYearly ? widthOfButton + spaceBetweenButtons : 0,
|
|
||||||
child: Container(
|
|
||||||
width: widthOfButton,
|
|
||||||
height: 40,
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
color: getEnteColorScheme(context).backgroundBase,
|
|
||||||
borderRadius: BorderRadius.circular(50),
|
|
||||||
),
|
|
||||||
child: AnimatedSwitcher(
|
|
||||||
duration: const Duration(milliseconds: 350),
|
|
||||||
switchInCurve: Curves.easeInOutExpo,
|
|
||||||
switchOutCurve: Curves.easeInOutExpo,
|
|
||||||
child: Text(
|
|
||||||
key: ValueKey(_isYearly),
|
|
||||||
_isYearly ? "Yearly" : "Monthly",
|
|
||||||
style: textTheme.body,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
);
|
|
||||||
},
|
|
||||||
),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
setIsYearly(bool isYearly) {
|
|
||||||
setState(() {
|
|
||||||
_isYearly = isYearly;
|
|
||||||
});
|
|
||||||
widget.onToggle(isYearly);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
@ -180,3 +180,120 @@ class SubFaqWidget extends StatelessWidget {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
class SubscriptionToggle extends StatefulWidget {
|
||||||
|
final Function(bool) onToggle;
|
||||||
|
const SubscriptionToggle({required this.onToggle, super.key});
|
||||||
|
|
||||||
|
@override
|
||||||
|
State<SubscriptionToggle> createState() => _SubscriptionToggleState();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _SubscriptionToggleState extends State<SubscriptionToggle> {
|
||||||
|
bool _isYearly = true;
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
const borderPadding = 2.5;
|
||||||
|
const spaceBetweenButtons = 4.0;
|
||||||
|
final textTheme = getEnteTextTheme(context);
|
||||||
|
return Padding(
|
||||||
|
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 32),
|
||||||
|
child: LayoutBuilder(
|
||||||
|
builder: (context, constrains) {
|
||||||
|
final widthOfButton = (constrains.maxWidth -
|
||||||
|
(borderPadding * 2) -
|
||||||
|
spaceBetweenButtons) /
|
||||||
|
2;
|
||||||
|
return Container(
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: getEnteColorScheme(context).fillBaseGrey,
|
||||||
|
borderRadius: BorderRadius.circular(50),
|
||||||
|
),
|
||||||
|
padding: const EdgeInsets.symmetric(
|
||||||
|
vertical: borderPadding,
|
||||||
|
horizontal: borderPadding,
|
||||||
|
),
|
||||||
|
width: double.infinity,
|
||||||
|
child: Stack(
|
||||||
|
children: [
|
||||||
|
Row(
|
||||||
|
children: [
|
||||||
|
GestureDetector(
|
||||||
|
onTap: () {
|
||||||
|
setIsYearly(false);
|
||||||
|
},
|
||||||
|
behavior: HitTestBehavior.opaque,
|
||||||
|
child: Container(
|
||||||
|
padding: const EdgeInsets.symmetric(
|
||||||
|
vertical: 8,
|
||||||
|
),
|
||||||
|
width: widthOfButton,
|
||||||
|
child: Center(
|
||||||
|
child: Text(
|
||||||
|
"Monthly",
|
||||||
|
style: textTheme.bodyFaint,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
const SizedBox(width: spaceBetweenButtons),
|
||||||
|
GestureDetector(
|
||||||
|
onTap: () {
|
||||||
|
setIsYearly(true);
|
||||||
|
},
|
||||||
|
behavior: HitTestBehavior.opaque,
|
||||||
|
child: Container(
|
||||||
|
padding: const EdgeInsets.symmetric(
|
||||||
|
vertical: 8,
|
||||||
|
),
|
||||||
|
width: widthOfButton,
|
||||||
|
child: Center(
|
||||||
|
child: Text(
|
||||||
|
"Yearly",
|
||||||
|
style: textTheme.bodyFaint,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
AnimatedPositioned(
|
||||||
|
duration: const Duration(milliseconds: 350),
|
||||||
|
curve: Curves.easeInOutQuart,
|
||||||
|
left: _isYearly ? widthOfButton + spaceBetweenButtons : 0,
|
||||||
|
child: Container(
|
||||||
|
padding: const EdgeInsets.symmetric(
|
||||||
|
vertical: 8,
|
||||||
|
),
|
||||||
|
width: widthOfButton,
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: getEnteColorScheme(context).backgroundBase,
|
||||||
|
borderRadius: BorderRadius.circular(50),
|
||||||
|
),
|
||||||
|
child: AnimatedSwitcher(
|
||||||
|
duration: const Duration(milliseconds: 350),
|
||||||
|
switchInCurve: Curves.easeInOutExpo,
|
||||||
|
switchOutCurve: Curves.easeInOutExpo,
|
||||||
|
child: Text(
|
||||||
|
key: ValueKey(_isYearly),
|
||||||
|
_isYearly ? "Yearly" : "Monthly",
|
||||||
|
style: textTheme.body,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
setIsYearly(bool isYearly) {
|
||||||
|
setState(() {
|
||||||
|
_isYearly = isYearly;
|
||||||
|
});
|
||||||
|
widget.onToggle(isYearly);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user