liangchengyou / wow_english

Commit a4c3106a2805034d1734c8d35fd227519846b67f

Authored by 吴启风
1 parent 6d61919a

feat:游戏列表页

Inline Side-by-side
Showing 4 changed files with 127 additions and 0 deletions
lib/pages/games/bloc.dart 0 → 100644
  View file @a4c3106
  1 +import 'package:bloc/bloc.dart';
  2 +import 'package:flutter/cupertino.dart';
  3 +import 'package:flutter/services.dart';
  4 +
  5 +import 'event.dart';
  6 +import 'state.dart';
  7 +
  8 +class GamesBloc extends Bloc<GamesEvent, GamesState> {
  9 +
  10 + late MethodChannel _methodChannel;
  11 +
  12 + GamesBloc() : super(GamesState().init()) {
  13 + on<InitEvent>(_init);
  14 + on<GotoGamePageEvent>(_gotoGamePage);
  15 + }
  16 +
  17 + void _init(InitEvent event, Emitter<GamesState> emit) async {
  18 + emit(state.clone());
  19 + }
  20 +
  21 + void _gotoGamePage(GotoGamePageEvent event, Emitter<GamesState> emit) async {
  22 + try {
  23 + _methodChannel = const MethodChannel('wow_english/game_method_channel');
  24 + await _methodChannel.invokeMethod('openGamePage', { "gameId": event.gameId });
  25 + } on PlatformException catch (e) {
  26 + debugPrint("Failed to go to native page: '${e.message}'.");
  27 + }
  28 + }
  29 +}
... ...
lib/pages/games/event.dart 0 → 100644
  View file @a4c3106
  1 +abstract class GamesEvent {}
  2 +
  3 +class InitEvent extends GamesEvent {}
  4 +
  5 +///进入游戏页面
  6 +class GotoGamePageEvent extends GamesEvent {
  7 + late final int gameId;
  8 +
  9 + GotoGamePageEvent(this.gameId);
  10 +}
0 11 \ No newline at end of file
... ...
lib/pages/games/state.dart 0 → 100644
  View file @a4c3106
  1 +class GamesState {
  2 + GamesState init() {
  3 + return GamesState();
  4 + }
  5 +
  6 + GamesState clone() {
  7 + return GamesState();
  8 + }
  9 +}
... ...
lib/pages/games/view.dart 0 → 100644
  View file @a4c3106
  1 +import 'package:flutter/material.dart';
  2 +import 'package:flutter_bloc/flutter_bloc.dart';
  3 +
  4 +import 'package:flutter_screenutil/flutter_screenutil.dart';
  5 +import 'package:wow_english/common/extension/string_extension.dart';
  6 +import 'package:wow_english/common/widgets/we_app_bar.dart';
  7 +import 'package:wow_english/pages/games/state.dart';
  8 +
  9 +import '../games/event.dart';
  10 +import 'bloc.dart';
  11 +
  12 +
  13 +class GamesPage extends StatelessWidget {
  14 + const GamesPage({super.key});
  15 +
  16 + @override
  17 + Widget build(BuildContext context) {
  18 + return BlocProvider(
  19 + create: (BuildContext context) => GamesBloc()..add(InitEvent()),
  20 + child: Builder(builder: (context) => _GamesPageView()),
  21 + );
  22 + }
  23 +}
  24 +
  25 +class _GamesPageView extends StatelessWidget {
  26 + @override
  27 + Widget build(BuildContext context) {
  28 + return BlocListener<GamesBloc, GamesState>(
  29 + listener: (context, state) {
  30 +
  31 + },
  32 + child: Scaffold(
  33 + appBar: const WEAppBar(
  34 + titleText: '游戏列表',
  35 + centerTitle: false,
  36 + ),
  37 + body: _gamesView(),
  38 + ),
  39 + );
  40 + }
  41 +
  42 + Widget _gamesView() => BlocBuilder<GamesBloc, GamesState>(
  43 + builder: (context, state) {
  44 + final bloc = BlocProvider.of<GamesBloc>(context);
  45 + //屏幕中间横着放四张图片一行展示(尺寸120*200)，每张图片下方有行文字
  46 + return GridView.builder(
  47 + gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
  48 + crossAxisCount: 4,
  49 + crossAxisSpacing: 10,
  50 + mainAxisSpacing: 10,
  51 + childAspectRatio: 0.6,
  52 + ),
  53 + itemCount: 4,
  54 + itemBuilder: (BuildContext context, int index) {
  55 + // final entity = bloc.listData[index];
  56 + return GestureDetector(
  57 + onTap: () {
  58 + bloc.add(GotoGamePageEvent(1));
  59 + },
  60 + child: Container(
  61 + decoration: BoxDecoration(
  62 + border: Border.all(
  63 + width: 1.0,
  64 + color: const Color(0xFF140C10),
  65 + ),
  66 + borderRadius: BorderRadius.circular(21),
  67 + ),
  68 + child: Column(
  69 + children: [
  70 + Image.asset('pic_module_study'.assetPng, width: 120, height: 200),
  71 + Text('游戏名称', style: TextStyle(fontSize: 14.sp, color: const Color(0xFF140C10)))
  72 + ],
  73 + ),
  74 + ),
  75 + );
  76 + });
  77 + });
  78 +}
  79 +
... ...