import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter_swiper/flutter_swiper.dart';
import '../model/PopNotice.dart';

class GuidePage extends StatefulWidget {
  GuidePage(this.popNoticeList);
  List<PopNotice> popNoticeList;
  @override
  _GuidePageState createState() => _GuidePageState();
}

class _GuidePageState extends State<GuidePage> with WidgetsBindingObserver {
  int swiperIndex = 0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Color(0xCC000000),
        body: WillPopScope(
            child: Center(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Container(
                    width: 320,
                    height: 420,
                    child: new Swiper(
                        itemBuilder: (BuildContext context, int index) {
                          return Image.network(
                            widget.popNoticeList[index].image,
                            fit: BoxFit.fill,
                          );
                        },
                        itemCount: widget.popNoticeList.length,
                        loop: false,
                        onIndexChanged: (index) {
                          setState(() {
                            swiperIndex = index;
                          });
                        },
                        pagination: SwiperCustomPagination(builder: (BuildContext context, SwiperPluginConfig config) {
                          Color activeColor = Color(0xFFD4504B);
                          Color color = Colors.white;
                          List<Widget> list = [];

                          int itemCount = config.itemCount;
                          int activeIndex = config.activeIndex;

                          for (int i = 0; i < itemCount; ++i) {
                            bool active = i == activeIndex;
                            list.add(
                              Container(
                                  key: Key("pagination_$i"),
                                  margin: EdgeInsets.symmetric(vertical: 3, horizontal: 2),
                                  child: Container(
                                    width: active ? 12 : 4,
                                    height: 4,
                                    decoration: BoxDecoration(color: active ? activeColor : color, borderRadius: BorderRadius.all(Radius.circular(3))),
                                  )),
                            );
                          }

                          return Container(
                            margin: EdgeInsets.only(top: 406),
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: list,
                            ),
                          );
                        })),
                  ),
                  Container(
                    height: 20,
                  ),
                  InkWell(
                    child: Image.asset('images/icon_xiayiye1.png'),
                    onTap: () {
                      Navigator.of(context).pop(true);
                    },
                  )
                ],
              ),
            ),
            onWillPop: () {}));
  }
}

class GuidItem extends StatelessWidget {
  GuidItem(this.index);
  int index;

  List<String> bgImageList = ['images/yindao_bg_01.png', 'images/yindao_bg_02.png', 'images/yindao_bg_03.png'];
  List<String> textImageList = ['images/yindao_text_01.png', 'images/yindao_text_02.png', 'images/yindao_text_03.png'];

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(image: DecorationImage(image: AssetImage(bgImageList[index]), fit: BoxFit.fill)),
      child: Stack(
        children: <Widget>[
          Positioned(
            bottom: 70,
            left: 0,
            child: Container(
              width: 375,
              child: Center(
                child: Image.asset(textImageList[index]),
              ),
            ),
          )
        ],
      ),
    );
  }
}

class MyFloat extends StatelessWidget {
  MyFloat(this.index);
  int index;
  @override
  Widget build(BuildContext context) {
    return Container(
      height: 70,
      // color: Colors.black,
      child: Center(
          child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: index < 2
            ? <Widget>[_dot(0, index), _dot(1, index), _dot(2, index)]
            : <Widget>[
                InkWell(
                  child: Image.asset('images/icon_inter_000.png'),
                  onTap: () {
                    Navigator.of(context).pop(true);
                  },
                )
              ],
      )),
    );
  }

  Widget _dot(index, activeIndex) {
    return Container(
      margin: EdgeInsets.all(2),
      decoration: BoxDecoration(
        color: (index == activeIndex ? Colors.white : Colors.white24),
        borderRadius: BorderRadius.all(Radius.circular(2)),
      ),
      width: 8,
      height: 4,
    );
  }
}