tutorial_header_widget.dart 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. import 'package:flutter/cupertino.dart';
  2. import 'package:flutter_screenutil/flutter_screenutil.dart';
  3. import '../../../resource/assets.gen.dart';
  4. import '../../../utils/status_bar_util.dart';
  5. /// 键盘教程页的顶部组件
  6. class TutorialHeaderWidget extends StatelessWidget {
  7. const TutorialHeaderWidget({super.key});
  8. @override
  9. Widget build(BuildContext context) {
  10. return SizedBox(
  11. width: double.infinity,
  12. height: 298.h,
  13. child: Stack(
  14. alignment: Alignment.center,
  15. children: [
  16. // 头像
  17. Positioned(
  18. top: 37.5.h,
  19. bottom: 86.5.h,
  20. child: Assets.images.iconKeyboardTutorialHeader.image(
  21. height: 174.h,
  22. fit: BoxFit.cover,
  23. ),
  24. ),
  25. // 蒙版
  26. Assets.images.bgKeyboardTutorialHeaderMask.image(
  27. width: double.infinity,
  28. height: double.infinity,
  29. ),
  30. // 提示语
  31. Positioned(
  32. top: 70.h + StatusBarUtil.getStatusBarHeight(context),
  33. child: Assets.images.iconKeyboardTutorialHeaderSlogan.image(
  34. width: 200.w,
  35. height: 73.h,
  36. ),
  37. ),
  38. ],
  39. ),
  40. );
  41. }
  42. }