flutter-sport/lib/pages/game/rank_detail.dart

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:scrollable_positioned_list/scrollable_positioned_list.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:sport/bean/achievement_info.dart';
import 'package:sport/bean/post_user.dart';
import 'package:sport/bean/rank_game_info.dart';
import 'package:sport/bean/user.dart';
import 'package:sport/pages/game/rank_introduce.dart';
import 'package:sport/router/navigator_util.dart';
import 'package:sport/services/api/inject_api.dart';
import 'package:sport/services/api/resp.dart';
import 'package:sport/services/userid.dart';
import 'package:sport/widgets/image.dart';
import 'package:sport/widgets/loading.dart';
import 'package:sport/widgets/persistent_header.dart';
import 'package:sport/widgets/user_widget.dart';
import 'package:umeng_common_sdk/umeng_common_sdk.dart';

class RankDetailPage extends StatefulWidget {
  final int id;
  final int type;

  RankDetailPage(this.id, this.type);

  @override
  State<StatefulWidget> createState() {
    return _RankDetailPageState();
  }
}

class _RankDetailPageState extends State<RankDetailPage> with TickerProviderStateMixin, InjectApi, UserId {
  bool _isLoading = true;
  Rank? rank;
  User? user;
  List<User> records = [];

  final ScrollController _controller = new ScrollController();
  final ItemScrollController itemScrollController = ItemScrollController();
  final ItemPositionsListener itemPositionsListener = ItemPositionsListener.create();
  final List<String> _tabs = [
    '世界榜',
    '好友榜',
  ];
  final List<String> rankImages = [
    "",
    "rank_icon_first.png",
    "rank_icon_second.png",
    "rank_icon_third.png",
  ];

  late TabController _tabController;

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: _tabs.length, initialIndex: 0, vsync: this);
    initData(0);
    UmengCommonSdk.onEvent("rank_detail", {});
  }

  @override
  void dispose() {
    super.dispose();
    _tabController.dispose();
    _controller.dispose();
  }

  // 缓存数据...
  initData(int index) async {
    setState(() {
      records = [];
      _isLoading = true;
    });
    String id = "${widget.id}";
    String scope = index == 1 ? "friend" : "world";
    SharedPreferences prefs = await SharedPreferences.getInstance();
    RespData<RankGameInfoData> data;
    if (widget.type == 1) {
      data = await api.getRankGameInfo(id, scope: scope);
    } else {
      data = await api.getRankSportInfo(id, scope: scope);
    }
    RankGameInfoData? infoData = data.data;
    if (infoData == null) return;
    setState(() {
      rank = data.data?.rank;
      user = data.data?.user;

      var list = data.data?.records ?? [];

      if (user == null) {
        list.add(new User(
          userName: prefs.getString("name"),
          userAvatar: prefs.getString("avatar"),
          userLevel: prefs.getInt("level_infolevel"),
          userLevelLogo: prefs.getString("level_infologo"),
        ));
      }

      records = list;
      _isLoading = false;
    });
  }

  Widget _buildRankItemWidget(int number, User data) {
    bool isSelf = data.userId == int.parse(selfId) || data.userId == null;
    return Column(
      children: <Widget>[
        InkWell(
          onTap: () {
            if (data.id != 0 && data.duration != null) NavigatorUtil.goSocialUserDetail(context, PostUser(id: "${data.userId}", name: data.userName, avatar: data.userAvatar));
          },
          child: Container(
            decoration: isSelf
                ? BoxDecoration(
                    image: DecorationImage(image: AssetImage("lib/assets/img/rank_bg_my.png"), fit: BoxFit.cover),
                  )
                : null,
            padding: const EdgeInsets.symmetric(horizontal: 12.0, vertical: 6.0),
            child: Row(
              children: <Widget>[
                _buildTitle(number, data.id != null),
                Padding(
                  padding: const EdgeInsets.fromLTRB(0, 6, 10.0, 6),
                  child: CircleAvatar(backgroundColor: Colors.black26, backgroundImage: userAvatarProvider(data.userAvatar == null ? "" : data.userAvatar), radius: 22),
                ),
                Expanded(
                  child: Row(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Text(
                        data.userName ?? "",
                        style: Theme.of(context).textTheme.subtitle1!,
                        maxLines: 1,
                      ),
                      UserLevelWidget(
                        level: Level(level: data.userLevel, logo: data.userLevelLogo),
                      )
                    ],
                  ),
                ),
                _dataText(rank, data),
              ],
            ),
          ),
        ),
        Divider(
          height: 1,
          indent: 12,
          endIndent: 12,
        ),
      ],
    );
  }

  Widget _dataText(Rank? rank, User user) {
    var unit = _dataUnit(rank);
    if (rank != null) {
      if (rank.field == null || rank.field == "") {
        return Text(user.score == null || user.score == 0 ? "暂无成绩" : "${user.score?.toStringAsFixed(1)}$unit", style: TextStyle(color: Color.fromRGBO(255, 196, 0, 1)));
      } else {
        if (rank.field == 'consume') {
          return Text(user.consume == null ? "" : "${user.consume?.round()}$unit", style: TextStyle(color: Color.fromRGBO(255, 196, 0, 1)));
        } else if (rank.field == 'duration') {
          return Text(user.duration == null ? "" : "${(user.duration ?? 0) ~/ 60}$unit", style: TextStyle(color: Color.fromRGBO(255, 196, 0, 1)));
        }
      }
    }
    return Container();
  }

  String _dataUnit(Rank? rank) {
    if (rank != null) {
      if (rank.field == null || rank.field == "") {
        return "分";
      } else {
        if (rank.field == 'consume') {
          return "大卡";
        } else if (rank.field == 'duration') {
          return "分钟";
        }
      }
    }
    return "";
  }

  Widget _buildTitle(int number, bool isInRank) {
    // 直接先未上榜的...
    if (isInRank == false)
      return Container(
        width: 50,
        child: Center(
          child: Text(
            "未上榜",
            style: Theme.of(context).textTheme.bodyText2!.copyWith(fontSize: 11.0),
          ),
        ),
      );
    // 这里是 看是 前三 还是后七
    if (number <= rankImages.length - 1)
      return Container(
          width: 50.0,
          child: Center(
              child: Image.asset(
            "lib/assets/img/${rankImages[number]}",
            width: 25.0,
          )));
    else {
      return Container(
        width: 50,
        child: Center(
          child: Text(
            "$number",
            style: Theme.of(context).textTheme.bodyText2!,
          ),
        ),
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    double height = widget.type != 1 ? MediaQuery.of(context).size.width * 611 / 1125 : MediaQuery.of(context).size.width * 500 / 750;
    return AnnotatedRegion<SystemUiOverlayStyle>(
        value: SystemUiOverlayStyle.light,
        child: Scaffold(
            backgroundColor: Colors.white,
            body: Stack(
              fit: StackFit.expand,
              children: <Widget>[
                Align(
                  alignment: Alignment.topCenter,
                  child: Container(
                      width: MediaQuery.of(context).size.width,
                      height: height,
                      decoration: BoxDecoration(
                          color: Colors.grey,
                          image: DecorationImage(
                              image: rank?.isGame == 1
                                  ? AssetImage("lib/assets/img/rank_bg.png")
                                  : rank == null
                                      ? widget.type == 1
                                          ? AssetImage("lib/assets/img/rank_bg.png")
                                          : widget.id == 1
                                              ? AssetImage("lib/assets/img/rank_bg_consume.png")
                                              : AssetImage("lib/assets/img/rank_bg_time.png")
                                      : rank?.id == 1
                                          ? AssetImage("lib/assets/img/rank_bg_consume.png")
                                          : AssetImage("lib/assets/img/rank_bg_time.png"),
                              fit: BoxFit.cover)),
                      child: rank != null
                          ? (widget.type != 0
                              ? Center(
                                  child: Column(
                                    mainAxisSize: MainAxisSize.min,
                                    children: <Widget>[
                                      ClipRRect(borderRadius: BorderRadius.circular(8), child: CachedNetworkImage(imageUrl: rank!.logo ?? "", width: 80, height: 80)),
                                      Padding(
                                        padding: EdgeInsets.only(top: 10.0),
                                        child: Text(
                                          "${rank!.name}",
                                          style: Theme.of(context).textTheme.headline4,
                                        ),
                                      ),
                                      GestureDetector(
                                          onTap: () {
                                            itemScrollController.scrollTo(index: user?.position != null ? (user?.position ?? 0) - 1 : records.length - 1, duration: Duration(milliseconds: 500));
                                          },
                                          child: Container(
                                              margin: EdgeInsets.fromLTRB(0.0, 12.0, 0, 0),
                                              child: Image.asset(
                                                "lib/assets/img/rank_btn_myrank.png",
                                                width: 103.0,
                                                height: 28.0,
                                              ))),
                                    ],
                                  ),
                                )
                              : SafeArea(
                                  child: Padding(
                                    padding: EdgeInsets.fromLTRB(24.0, 36.0, 0, 0),
                                    child: Column(
                                      crossAxisAlignment: CrossAxisAlignment.start,
                                      mainAxisSize: MainAxisSize.min,
                                      children: <Widget>[
                                        Padding(
                                          padding: EdgeInsets.symmetric(vertical: 6.0),
                                          child: Text(
                                            "${rank!.name}",
                                            style: TextStyle(color: Colors.white, fontSize: 20, fontWeight: FontWeight.w600),
                                          ),
                                        ),
                                        Padding(
                                          padding: EdgeInsets.symmetric(vertical: 2.0),
                                          child: Text(
                                            "${rank!.introduce}",
                                            style: Theme.of(context).textTheme.bodyText1!,
                                          ),
                                        ),
                                        GestureDetector(
                                            onTap: () {
                                              itemScrollController.scrollTo(index: user?.position != null ? (user?.position ?? 0) - 1 : records.length - 1, duration: Duration(milliseconds: 500));
                                            },
                                            child: Container(
                                                margin: EdgeInsets.fromLTRB(0.0, 12.0, 0, 0),
                                                child: Image.asset(
                                                  "lib/assets/img/rank_btn_myrank.png",
                                                  width: 103.0,
                                                  height: 28.0,
                                                ))),
                                      ],
                                    ),
                                  ),
                                ))
                          : Container()),
                ),
                Positioned(
                    left: 0.0,
                    top: 0.0,
                    child: SafeArea(
                      child: IconButton(
                        icon: Image.asset("lib/assets/img/topbar_return_white.png"),
                        onPressed: () {
                          Navigator.pop(context);
                        },
                      ),
                    )),
                // Positioned(
                //     top: 0,
                //     right: 0,
                //     child: SafeArea(
                //       child: IconButton(
                //         icon: Image.asset("lib/assets/img/topbar_problom.png"),
                //         onPressed: () {
                //           if (rank != null) {
                //             NavigatorUtil.goPage(context, (context) => RankIntroduce(rank!));
                //           }
                //         },
                //       ),
                //     )),
                Positioned(
                    top: height - 10,
                    left: 0,
                    right: 0,
                    bottom: 0,
                    child: CustomScrollView(
                      controller: _controller,
                      slivers: <Widget>[
                        SliverPersistentHeader(
                          delegate: PersistentHeader(
                              min: 60,
                              max: 60,
                              child: Container(
                                height: 80.0,
                                alignment: Alignment.center,
                                decoration: BoxDecoration(
                                  borderRadius: BorderRadius.only(topRight: Radius.circular(10.0), topLeft: Radius.circular(10.0)),
                                  color: Colors.white,
                                ),
                                padding: EdgeInsets.only(bottom: 10, top: 10.0),
                                child: TabBar(
                                  isScrollable: true,
                                  indicatorPadding: EdgeInsets.symmetric(horizontal: 8),
                                  indicatorWeight: 3,
                                  labelPadding: EdgeInsets.symmetric(horizontal: 30),
                                  controller: _tabController,
                                  tabs: _tabs.map((e) => Tab(text: e)).toList(),
                                  onTap: (i) {
                                    initData(i);
                                  },
                                ),
                              )),
                          pinned: true,
                        ),
                        if (_isLoading)
                          SliverToBoxAdapter(
                            child: RequestLoadingWidget(),
                          ),
                        if (records.isNotEmpty == true)
                          SliverFillRemaining(
                            child: ScrollablePositionedList.builder(
                              itemCount: records.length,
                              itemBuilder: (context, index) {
                                return _buildRankItemWidget(index + 1, records[index]);
                              },
                              itemScrollController: itemScrollController,
                              itemPositionsListener: itemPositionsListener,
                            ),
                          ),
                      ],
                    ))
              ],
            )));
  }
}