intimacy_scale_page.dart 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237
  1. import 'package:flutter_screenutil/flutter_screenutil.dart';
  2. import 'package:keyboard/base/base_page.dart';
  3. import 'package:keyboard/module/intimacy_scale/intimacy_scale_controller.dart';
  4. import 'package:flutter/material.dart';
  5. import 'package:get/get.dart';
  6. import '../../resource/assets.gen.dart';
  7. import '../../resource/string.gen.dart';
  8. import '../../router/app_pages.dart';
  9. import '../../utils/intimacy_util.dart';
  10. import '../../utils/styles.dart';
  11. import '../../widget/flutter_ruler_picker.dart';
  12. import '../../widget/heart_fill_view.dart';
  13. class IntimacyScalePage extends BasePage<IntimacyScaleController> {
  14. const IntimacyScalePage({super.key});
  15. static void start() {
  16. Get.toNamed(RoutePath.intimacyScale);
  17. }
  18. @override
  19. bool immersive() {
  20. return true;
  21. }
  22. @override
  23. Color backgroundColor() {
  24. return Color(0xFFF6F5FA);
  25. }
  26. @override
  27. Widget buildBody(BuildContext context) {
  28. return Stack(
  29. children: [
  30. SafeArea(
  31. child: Column(
  32. crossAxisAlignment: CrossAxisAlignment.center,
  33. children: [
  34. _buildTitle(),
  35. SizedBox(height: 128.w),
  36. SizedBox(
  37. width: 250.w,
  38. child: Stack(
  39. alignment: Alignment.center,
  40. children: [
  41. Obx(() {
  42. return HeartFillAnimation(
  43. fillProgress:
  44. controller.currentCustomIntimacy.value > 0
  45. ? controller.currentCustomIntimacy.value / 100
  46. : 0,
  47. width: 210.w,
  48. );
  49. }),
  50. Positioned(
  51. left: 0,
  52. right: 0,
  53. child: Obx(() {
  54. return Text.rich(
  55. TextSpan(
  56. children: [
  57. TextSpan(
  58. text: controller.currentCustomIntimacy.value.toString(),
  59. style: TextStyle(
  60. color: Colors.white,
  61. fontSize: 82.72.sp,
  62. height: 0,
  63. fontWeight: FontWeight.w700,
  64. shadows: [
  65. Shadow(
  66. offset: Offset(0, 3),
  67. blurRadius: 9,
  68. color: const Color(
  69. 0xFFFF6BD3,
  70. ).withOpacity(0.63),
  71. ),
  72. ],
  73. ),
  74. ),
  75. TextSpan(
  76. text: "%",
  77. style: TextStyle(
  78. color: Colors.white,
  79. fontSize: 35.15.sp,
  80. fontWeight: FontWeight.w700,
  81. shadows: [
  82. Shadow(
  83. offset: Offset(0, 3),
  84. blurRadius: 9,
  85. color: const Color(
  86. 0xFFFF6BD3,
  87. ).withOpacity(0.63),
  88. ),
  89. ],
  90. ),
  91. ),
  92. ],
  93. ),
  94. textAlign: TextAlign.center,
  95. );
  96. }),
  97. ),
  98. ],
  99. ),
  100. ),
  101. SizedBox(height: 50.w),
  102. buildIntimacyLevelName(),
  103. SizedBox(height: 20.w),
  104. buildRulerPicker(context),
  105. ],
  106. ),
  107. ),
  108. Positioned(
  109. bottom: 20.h,
  110. left: 16.w,
  111. right: 16.w,
  112. child: InkWell(
  113. onTap: () {
  114. controller.clickSaveButton();
  115. },
  116. child: Center(
  117. child: Container(
  118. width: 150.w,
  119. height: 48.h,
  120. alignment: Alignment.center,
  121. decoration: Styles.getActivateButtonDecoration(31.r),
  122. child: Text(
  123. StringName.save,
  124. style: Styles.getTextStyleWhiteW500(16.sp),
  125. ),
  126. ),
  127. ),
  128. ),
  129. ),
  130. // 背景图片
  131. IgnorePointer(child: Assets.images.bgMine.image(width: 360.w)),
  132. ],
  133. );
  134. }
  135. Row buildRulerPicker(BuildContext context) {
  136. return Row(
  137. children: [
  138. SizedBox(
  139. child: Obx(() {
  140. return RulerPicker(
  141. rulerBackgroundColor: Colors.transparent,
  142. controller: controller.rulerPickerController.value,
  143. onBuildRulerScaleText: (index, value) {
  144. return "";
  145. },
  146. ranges: controller.ranges,
  147. onValueChanged: (value) {
  148. controller.onChangeIntimacy(value);
  149. },
  150. width: 360.w,
  151. height: 96.w,
  152. rulerMarginTop: 25.w,
  153. marker: Column(
  154. children: [
  155. Assets.images.iconIntimacyScaleMark.image(
  156. width: 25.w,
  157. height: 25.w,
  158. ),
  159. Container(
  160. width: 8.w,
  161. height: 48.w,
  162. decoration: BoxDecoration(
  163. borderRadius: BorderRadius.circular(40.w),
  164. color: Color(0xff7d46fc),
  165. ),
  166. ),
  167. ],
  168. ),
  169. );
  170. }),
  171. ),
  172. ],
  173. );
  174. }
  175. _buildTitle() {
  176. return Container(
  177. alignment: Alignment.centerLeft,
  178. padding: EdgeInsets.only(top: 12.h, left: 16.w, right: 16.w),
  179. child: Row(
  180. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  181. children: [
  182. GestureDetector(
  183. onTap: () => controller.clickBack(),
  184. child: Assets.images.iconMineBackArrow.image(
  185. width: 24.w,
  186. height: 24.w,
  187. ),
  188. ),
  189. Text(
  190. StringName.intimacyIndex,
  191. style: Styles.getTextStyleBlack204W500(17.sp),
  192. ),
  193. SizedBox(width: 24.w, height: 24.w),
  194. ],
  195. ),
  196. );
  197. }
  198. // 亲密阶段名称
  199. Widget buildIntimacyLevelName() {
  200. return Obx(() {
  201. return Container(
  202. padding: EdgeInsets.symmetric(horizontal: 8.w, vertical: 4.h),
  203. decoration: ShapeDecoration(
  204. color: Colors.white,
  205. shape: RoundedRectangleBorder(
  206. borderRadius: BorderRadius.circular(17.r),
  207. ),
  208. ),
  209. child: Row(
  210. mainAxisSize: MainAxisSize.min,
  211. mainAxisAlignment: MainAxisAlignment.center,
  212. children: [
  213. Assets.images.iconKeyboardLoveLogo.image(width: 18.w, height: 18.w),
  214. Text(
  215. IntimacyUtil.getIntimacyName(controller.currentCustomIntimacy.value),
  216. style: Styles.getTextStyleBlack153W400(14.sp),
  217. ),
  218. ],
  219. ),
  220. );
  221. });
  222. }
  223. }