character_details_dialog.dart 9.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229
  1. import 'package:cached_network_image/cached_network_image.dart';
  2. import 'package:flutter/cupertino.dart';
  3. import 'package:flutter/material.dart';
  4. import 'package:flutter_screenutil/flutter_screenutil.dart';
  5. import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
  6. import 'package:keyboard/resource/string.gen.dart';
  7. import '../data/bean/character_info.dart';
  8. import '../resource/assets.gen.dart';
  9. import '../resource/colors.gen.dart';
  10. class CharacterDetailsDialog {
  11. static const String tag = 'CharacterDetailsDialog';
  12. static void show({
  13. required CharacterInfo characterInfo,
  14. required VoidCallback clickCallback,
  15. VoidCallback ? onDismiss,
  16. }) {
  17. SmartDialog.show(
  18. tag: tag,
  19. backType: SmartBackType.block,
  20. clickMaskDismiss: false,
  21. maskColor: ColorName.black70,
  22. builder: (_) {
  23. return SizedBox(
  24. width: double.infinity,
  25. height: double.infinity,
  26. child: Column(
  27. mainAxisAlignment: MainAxisAlignment.center,
  28. children: [
  29. Container(
  30. margin: EdgeInsets.only(left: 30.w, right: 30.w),
  31. padding: EdgeInsets.only(bottom: 28.h),
  32. alignment: Alignment.topCenter,
  33. width: double.infinity,
  34. decoration: BoxDecoration(
  35. image: DecorationImage(
  36. image: Assets.images.bgCharacterDialog.provider(),
  37. fit: BoxFit.cover,
  38. ),
  39. borderRadius: BorderRadius.circular(20.r),
  40. ),
  41. child: Column(
  42. children: [
  43. Container(
  44. padding: EdgeInsets.only(
  45. top: 12.h,
  46. left: 12.w,
  47. right: 12.w,
  48. bottom: 12.h,
  49. ),
  50. margin: EdgeInsets.only(
  51. left: 20.w,
  52. right: 20.w,
  53. top: 20.h,
  54. ),
  55. width: double.infinity,
  56. decoration: ShapeDecoration(
  57. color: Colors.white,
  58. shape: RoundedRectangleBorder(
  59. borderRadius: BorderRadius.circular(20.r),
  60. ),
  61. shadows: [
  62. BoxShadow(
  63. color: const Color(0xFFDDE2F9),
  64. blurRadius: 10.r,
  65. offset: Offset(0, 4),
  66. spreadRadius: 0,
  67. ),
  68. ],
  69. ),
  70. child: Column(
  71. crossAxisAlignment: CrossAxisAlignment.center,
  72. mainAxisAlignment: MainAxisAlignment.start,
  73. children: [
  74. Container(
  75. padding: EdgeInsets.only(
  76. top: 20.h,
  77. left: 20.w,
  78. right: 20.w,
  79. ),
  80. height: 236.w,
  81. width: 236.w,
  82. decoration: BoxDecoration(
  83. image: DecorationImage(
  84. image:
  85. Assets.images.bgCharacterDialogImage
  86. .provider(),
  87. fit: BoxFit.fill,
  88. ),
  89. borderRadius: BorderRadius.circular(20.r),
  90. ),
  91. child: CachedNetworkImage(
  92. imageUrl: characterInfo.imageUrl ?? "",
  93. fit: BoxFit.fill,
  94. ),
  95. ),
  96. SizedBox(height: 10.h),
  97. Row(
  98. crossAxisAlignment: CrossAxisAlignment.start,
  99. children: [
  100. Assets.images.iconCharacterDialogLogo.image(
  101. width: 32.r,
  102. height: 32.r,
  103. ),
  104. SizedBox(width: 10.w),
  105. Expanded(
  106. child: Column(
  107. crossAxisAlignment: CrossAxisAlignment.start,
  108. children: [
  109. Row(
  110. children: [
  111. Text(
  112. characterInfo.name ?? "",
  113. style: TextStyle(
  114. color: Colors.black.withAlpha(204),
  115. fontSize: 14.sp,
  116. fontWeight: FontWeight.w700,
  117. ),
  118. ),
  119. SizedBox(width: 4.w),
  120. characterInfo.isVip == true
  121. ? Assets.images.iconCharacterVip
  122. .image(
  123. width: 38.w,
  124. height: 16.h,
  125. )
  126. : Container(),
  127. ],
  128. ),
  129. Text(
  130. characterInfo.description ?? "",
  131. softWrap: true,
  132. style: TextStyle(
  133. color: Colors.black.withAlpha(153),
  134. fontSize: 12.sp,
  135. fontWeight: FontWeight.w400,
  136. ),
  137. ),
  138. ],
  139. ),
  140. ),
  141. ],
  142. ),
  143. ],
  144. ),
  145. ),
  146. SizedBox(height: 24.h),
  147. GestureDetector(
  148. onTap: () {
  149. clickCallback.call();
  150. SmartDialog.dismiss(tag: tag);
  151. },
  152. child: Container(
  153. margin: EdgeInsets.symmetric(horizontal: 30.w),
  154. width: double.infinity,
  155. height: 48.h,
  156. decoration: BoxDecoration(
  157. borderRadius: BorderRadius.circular(50.r),
  158. gradient:
  159. characterInfo.isAdd == true
  160. ? null
  161. : const LinearGradient(
  162. colors: [
  163. Color(0xFF7D46FC),
  164. Color(0xFFBC87FF),
  165. ],
  166. begin: Alignment.topLeft,
  167. end: Alignment.bottomRight,
  168. ),
  169. color:
  170. characterInfo.isAdd == true
  171. ? const Color(0xFFEDE8FF)
  172. : null,
  173. ),
  174. child: Row(
  175. mainAxisAlignment: MainAxisAlignment.center,
  176. children: [
  177. if (characterInfo.isLock == true &&
  178. characterInfo.isVip == true)
  179. Padding(
  180. padding: EdgeInsets.only(right: 2.w),
  181. child: Assets.images.iconCharacterLock.image(
  182. width: 18.r,
  183. height: 18.r,
  184. ), // 锁定图标
  185. ),
  186. Text(
  187. characterInfo.isAdd == true
  188. ? StringName.addedToKeyboard
  189. : StringName.addToKeyboard,
  190. style: TextStyle(
  191. color:
  192. characterInfo.isAdd == true
  193. ? const Color(0xFF7D46FC)
  194. : Colors.white,
  195. fontSize: 14.sp,
  196. fontWeight: FontWeight.w500,
  197. ),
  198. ),
  199. ],
  200. ),
  201. ),
  202. ),
  203. ],
  204. ),
  205. ),
  206. Container(
  207. margin: EdgeInsets.only(top: 24.h),
  208. child: GestureDetector(
  209. onTap: () {
  210. SmartDialog.dismiss(tag: tag);
  211. onDismiss?.call();
  212. },
  213. child: Assets.images.iconCharacterDialogClose.image(
  214. width: 40.r,
  215. height: 40.r,
  216. ),
  217. ),
  218. ),
  219. ],
  220. ),
  221. );
  222. },
  223. );
  224. }
  225. }