feat:绘本ui

吴启风
1 parent ad8454ca
Showing 5 changed files with 127 additions and 0 deletions
lib/main.dart
lib/pages/reading/bloc/reading_bloc.dart
lib/pages/reading/bloc/reading_event.dart
lib/pages/reading/bloc/reading_state.dart
lib/pages/reading/reading_page.dart
@@ -3,6 +3,7 @@ import &#39;package:flutter/material.dart&#39;;
 import 'package:flutter/services.dart';
 import 'package:limiting_direction_csx/limiting_direction_csx.dart';
 import 'package:wow_english/app/app.dart';
+import 'package:flutter/services.dart';
  
 void main() async {
   ///设置设备默认方向
@@ -11,6 +12,13 @@ void main() async {
     await LimitingDirectionCsx.setScreenDirection(DeviceDirectionMask.Landscape);
   } else {
     await SystemChrome.setPreferredOrientations([DeviceOrientation.landscapeLeft,DeviceOrientation.landscapeRight]);
+    // SystemChrome.setEnabledSystemUIMode(
+    //   SystemUiMode.manual,
+    //   overlays: [SystemUiOverlay.top],
+    // );
+    SystemChrome.setSystemUIOverlayStyle(const SystemUiOverlayStyle( //设置状态栏透明
+      statusBarColor: Colors.transparent,
+    ));
   }
   runApp(const App());
 }
+import 'package:flutter/cupertino.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+part 'reading_event.dart';
+part 'reading_state.dart';
+
+class ReadingPageBloc extends Bloc<ReadingPageEvent, ReadingPageState> {
+  ReadingPageBloc() : super(ReadingPageInitial()) {
+    on<ReadingPageEvent>((event, emit) {
+      // TODO: implement event handler
+    });
+  }
+}
+part of 'reading_bloc.dart';
+
+@immutable
+abstract class ReadingPageEvent {}
+part of 'reading_bloc.dart';
+
+@immutable
+abstract class ReadingPageState {}
+
+class ReadingPageInitial extends ReadingPageState {}
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
+import 'package:wow_english/common/extension/string_extension.dart';
+import 'package:wow_english/pages/practice/widgets/practice_header_widget.dart';
+
+import 'bloc/reading_bloc.dart';
+
+class ReadingItemPage extends StatelessWidget {
+  const ReadingItemPage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocProvider(
+      create: (_) => ReadingPageBloc(),
+      child: _ReadingPage(),
+    );
+  }
+}
+
+class _ReadingPage extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return BlocListener<ReadingPageBloc, ReadingPageState>(
+      listener: (context, state) {},
+      child: _voiceAnswerView(),
+    );
+  }
+
+  Widget _voiceAnswerView() =>
+      BlocBuilder<ReadingPageBloc, ReadingPageState>(builder: (context, state) {
+        final bloc = BlocProvider.of<ReadingPageBloc>(context);
+        return Container(
+          color: Colors.white,
+          child: Stack(
+            children: [
+              Positioned(
+                  left: 0,
+                  right: 0,
+                  bottom: 0,
+                  child: Image.asset(
+                    'bottom_grass'.assetPng,
+                    fit: BoxFit.fitWidth,
+                  )),
+              Column(
+                children: [
+                  PracticeHeaderWidget(
+                    title: '1/8',
+                    onTap: () {
+                      Navigator.pop(context);
+                    },
+                  ),
+                  Expanded(
+                      child: PageView.builder(
+                          itemCount: 10,
+                          itemBuilder: (context, int index) {
+                            return _voiceAnswerItem();
+                          }))
+                ],
+              )
+            ],
+          ),
+        );
+      });
+
+  Widget _voiceAnswerItem() =>
+      BlocBuilder<VoiceAnswerBloc, VoiceAnswerState>(builder: (context, state) {
+        return Row(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: [
+            Image.network(
+              'https://img.liblibai.com/web/648331d5a2cb5.png?image_process=format,webp&x-oss-process=image/resize,w_2980,m_lfit/format,webp',
+              height: 186.h,
+              width: 186.w,
+            ),
+            160.horizontalSpace,
+            Column(
+              mainAxisAlignment: MainAxisAlignment.center,
+              children: [
+                Image.asset(
+                  'voice'.assetPng,
+                  height: 52.h,
+                  width: 46.w,
+                ),
+                70.verticalSpace,
+                Image.asset(
+                  'micro_phone'.assetPng,
+                  height: 75.w,
+                  width: 75.w,
+                )
+              ],
+            )
+          ],
+        );
+      });
+}