import 'package:flutter/material.dart';
import 'package:netrain_flutter_app/common/Images.dart';
import 'CustomUnderlineTabIndicator.dart';

class CustomTabPage extends StatefulWidget{
  @override
  _CustomTabPageState createState() =>  _CustomTabPageState();
}

class _CustomTabPageState extends State<CustomTabPage> with TickerProviderStateMixin{
  TabController _tabController;
  PageController _pageController;
  List<String> _titleList = <String>['关注','推荐', '抗疫', '热榜', '精品课', '旅游'];
  List widgets = [];

  @override
  void initState() {
    super.initState();
    _tabController = TabController(vsync: this, length: _titleList.length);
    _pageController = PageController();
    for (int i = 0; i < 10; i++) {
      widgets.add(getRow(i));
    }
  }

  void _changeTab(int index) {
    _pageController.animateToPage(index, duration: Duration(milliseconds: 300), curve: Curves.ease);
  }

  void _onPageChanged(int index) {
    _tabController.animateTo(index, duration: Duration(milliseconds: 300));
  }

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


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('自定义PageController', style: TextStyle(color: Colors.black54),),
        backgroundColor: Colors.white,
        brightness: Brightness.light,
        elevation: 0,
        iconTheme: IconThemeData(
            color: Colors.black54
        ),
      ),
      body: Column(
        children: <Widget>[
          Container(
            width: double.infinity,
            color: Colors.white,
            padding: EdgeInsets.symmetric(vertical: 10, horizontal: 5),
            height: 45,
            child: TabBar(
              labelColor: Colors.blue,
              //选中的颜色
              labelStyle: TextStyle(color: Colors.white, fontSize: 14),
              unselectedLabelColor: Colors.black54,
              //未选中的颜色
              unselectedLabelStyle: TextStyle(
                  color: Colors.black54, fontSize: 14),
              isScrollable: true,
              //自定义indicator样式
              indicator: CustomUnderlineTabIndicator(
                borderSide: BorderSide(color: Colors.blue,width: 3),
                insets: EdgeInsets.only(left: 50,right: 50,top: 0,bottom: -5),
              ),
              controller: _tabController,
              onTap: _changeTab,
              tabs: _titleList.map((e) => Tab(text: e)).toList(),
            ),
          ),
          Expanded(
              child: PageView.builder(
                  physics: BouncingScrollPhysics(),
                  controller: _pageController,
                  onPageChanged: _onPageChanged,
                  itemCount: _titleList.length,
                  itemBuilder: (context, index) {
                    return PageItemView(index);
                  }
              )
          )
        ],
      ),
    );
  }

  PageItemView(int index) {
    return ListView.builder(
      itemCount: widgets.length,
      itemBuilder: (BuildContext context, int position) {
        return getRow(position);
      },
    );
  }
  Widget getRow(int i) {
    return GestureDetector(
      child: Container(
        padding: EdgeInsets.all(16),
        child: Row(
          children: [
            Container(
              child: Image(image: AssetImage(Images.ic_doctor_avatar)),
              padding: EdgeInsets.only(right: 10),
            ),
            Text("患者 $i"),
          ],
        ),
      ),
      onTap: () {
        setState(() {
          widgets.add(getRow(widgets.length + 1));
          print('row $i');
        });
      },
    );
  }
}