import 'dart:convert' as convert;
import 'dart:ui';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:zhiying_comm/zhiying_comm.dart';

class MineNavDelegate extends SliverPersistentHeaderDelegate {
  final Map<String, dynamic> data;
  double _height;
  Color _color;

  List<Widget> _icons = List();

  MineNavDelegate(this.data) : super() {
    _height = MediaQueryData.fromWindow(window).padding.top + 44;
    String d = data['data'];
    Map<String, dynamic> json = convert.jsonDecode(d);
    if (json.containsKey('app_bar_bg_color')) {
      _color = HexColor.fromHex(json['app_bar_bg_color']);
    } else {
      _color = Colors.amber;
    }
    if (json.containsKey('app_bar_icons')) {
      List icons = json['app_bar_icons'];
      _icons = icons.map((icon) {
        SkipModel model = SkipModel.fromJson(Map<String, dynamic>.from(icon));
        return GestureDetector(
          child: Container(
            width: 24,
            height: 24,
            margin: EdgeInsets.only(left: 6),
            child: CachedNetworkImage(
              imageUrl: model.icon,
            ),
          ),
          onTap: () {
            print('页面跳转 ${model.skipIdentifier}');
          },
        );
      }).toList();
    }
  }

  @override
  Widget build(
      BuildContext context, double shrinkOffset, bool overlapsContent) {
    double percent = shrinkOffset / _height;
    return MineNav(_color.withOpacity(percent), _icons);
  }

  @override
  double get maxExtent => _height;

  @override
  double get minExtent => _height;

  @override
  bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) =>
      false; // 如果内容需要更新，设置为true
}

class MineNav extends StatelessWidget {
  final Color color;
  final List<Widget> widgets;

  MineNav(this.color, this.widgets);

  @override
  Widget build(BuildContext context) {
    return Container(
        padding: EdgeInsets.only(left: 12, right: 12),
        color: color,
        child: Column(
          children: <Widget>[
            Expanded(child: Container()),
            Container(
              width: double.infinity,
              height: 44,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.end,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: this.widgets,
              ),
            )
          ],
        ));
  }
}