flutter-sport/lib/pages/home/sport_list_page.dart

import 'dart:ui';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_rating_bar/flutter_rating_bar.dart';
import 'package:sport/bean/game.dart';
import 'package:sport/pages/game/game_detail.dart';
import 'package:sport/services/api/inject_api.dart';
import 'package:sport/services/api/resp.dart';
import 'package:sport/widgets/decoration.dart';
import 'package:sport/widgets/game_run.dart';
import 'package:sport/widgets/loading.dart';
import 'package:sport/widgets/misc.dart';

class SportListPage extends StatefulWidget {
  SportListPage();

  @override
  State<StatefulWidget> createState() => _PageState();
}

class _PageState extends State<SportListPage> with InjectApi {
  Future<RespList<GameInfoData>> _future;

  @override
  void initState() {
    super.initState();
    _future = api.getGameAll();
  }

  @override
  Widget build(BuildContext context) {
    var _padding = const EdgeInsets.symmetric(vertical: 6.0);
    return BackdropFilter(
      //背景滤镜
      filter: ImageFilter.blur(sigmaX: 5, sigmaY: 5),
      child: Scaffold(
        backgroundColor: Colors.transparent,
        body: Center(
          child: Padding(
            padding: const EdgeInsets.fromLTRB(0, 80.0, 0, 20.0),
            child: Column(
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.all(12.0),
                  child: Stack(
                    alignment: Alignment.center,
                    children: <Widget>[
                      Image.asset(
                        "lib/assets/img/mine_image_achievement.png",
                        fit: BoxFit.fitWidth,
                        width: 240,
                      ),
                      Text(
                        "运动列表",
                        style: Theme.of(context).textTheme.headline4,
                        strutStyle: fixedLine,
                      )
                    ],
                  ),
                ),
                Expanded(
                  child: SingleChildScrollView(
                    child: Padding(
                      padding: const EdgeInsets.all(12.0),
                      child: Column(
                        children: <Widget>[
                          Container(
                            margin: _padding,
                            child: GameRun(),
                            decoration: circular(),
                          ),
                          FutureBuilder(
                            future: _future,
                            builder: (BuildContext context, AsyncSnapshot<RespList<GameInfoData>> snapshot) {
                              if (snapshot.connectionState != ConnectionState.done) return RequestLoadingWidget();
                              var list = snapshot.data?.results;
                              return Column(
                                  children: list
                                      .map((e) => Padding(
                                            padding: _padding,
                                            child: ClipRRect(
                                                borderRadius: BorderRadius.circular(10.0),
                                                child: Container(
                                                  color: Colors.white,
                                                  child: Row(
                                                    children: <Widget>[
                                                      CachedNetworkImage(
                                                        width: 90.0,
                                                        height: 90.0,
                                                        fit: BoxFit.cover,
                                                        imageUrl: "${e.cover}",
                                                      ),
                                                      const SizedBox(
                                                        width: 12.0,
                                                      ),
                                                      Expanded(
                                                        child: Column(
                                                          crossAxisAlignment: CrossAxisAlignment.start,
                                                          children: <Widget>[
                                                            Text(
                                                              e.name,
                                                              style: Theme.of(context).textTheme.headline3,
                                                            ),
                                                            Text(
                                                              "${e.userCount}人在练",
                                                              style: Theme.of(context).textTheme.bodyText1,
                                                            ),
                                                            const SizedBox(
                                                              height: 5,
                                                            ),
                                                            Row(
                                                              children: <Widget>[
                                                                Text(
                                                                  "难度： ",
                                                                  style: Theme.of(context).textTheme.bodyText1,
                                                                ),
                                                                RatingBarIndicator(
                                                                  rating: e.difficulty / 20.0,
                                                                  itemBuilder: (context, index) => Image.asset(
                                                                    "lib/assets/img/con_icon_difficulty_normal.png",
                                                                    color: const Color(0xffFFC400),
                                                                  ),
                                                                  itemCount: 5,
                                                                  itemSize: 14.0,
                                                                  unratedColor: const Color(0xffCECECE),
                                                                  direction: Axis.horizontal,
                                                                )
                                                              ],
                                                            )
                                                          ],
                                                        ),
                                                      ),
                                                      Container(
                                                        width: 120.0,
                                                        child: PositionedBottom(
                                                          e,
                                                          (v) {
                                                            startGame(context, e);
                                                          },
                                                          height: 35.0,
                                                          width: 93.0,
                                                          textStyle: TextStyle(
                                                            color: Colors.white,
                                                            fontSize: 14.0,
                                                          ),
                                                        ),
                                                      )
                                                    ],
                                                  ),
                                                )),
                                          ))
                                      .toList());
                            },
                          )
                        ],
                      ),
                    ),
                  ),
                ),
                GestureDetector(
                  behavior: HitTestBehavior.opaque,
                  onTap: () => Navigator.maybePop(context),
                  child: Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: Image.asset("lib/assets/img/pop_share_chose.png"),
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}