import 'package:convex_bottom_bar/convex_bottom_bar.dart';
import 'package:flutter/material.dart';
import 'package:rmosflutterguest/page/profil/profil_page.dart';
import 'package:bottom_navy_bar/bottom_navy_bar.dart';

import '../anasayfa/anasayfa_page.dart';
import '../bildirimler/bildirim_page.dart';
import '../hotelbilgileri/hotel_bilgileri_page.dart';

class BottomNavigationPage extends StatefulWidget {
  const BottomNavigationPage({Key? key}) : super(key: key);

  @override
  State<BottomNavigationPage> createState() => _MyStatefulWidgetState();
}

class _MyStatefulWidgetState extends State<BottomNavigationPage> {
  late PageController _pageController;



  void _onItemTapped(int index) {
    setState(() {
      currentTabIndex = index;
      currentPage = pages[index];
    });
  }

  late Widget currentPage;
  late List<Widget> pages;
  int currentTabIndex = 0;
  late AnaSayfaPage homePage;
  late HotelBilgileriPage hotelBilgileriPage;
  late BildirimPage bildirimPage;
  late ProfilPage profilPage;

late AnaSayfaPage anaSayfaPage;

  @override
  void initState() {
    super.initState();

    anaSayfaPage =  AnaSayfaPage();

    hotelBilgileriPage = const HotelBilgileriPage();
    bildirimPage = const BildirimPage();
    profilPage = const ProfilPage();

    pages = [
      anaSayfaPage,
      hotelBilgileriPage,
      bildirimPage,
      profilPage,
    ];

    currentPage = anaSayfaPage;

    _pageController = PageController();
  }

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

  Widget bottomStyle1(){
    return BottomNavyBar(
      selectedIndex: currentTabIndex,
      showElevation: true,
      itemCornerRadius: 24,
      curve: Curves.easeIn,
      onItemSelected: (index) {
        _onItemTapped(index);
        _pageController.jumpToPage(index);
      },
      items: <BottomNavyBarItem>[
        BottomNavyBarItem(
          icon: Icon(Icons.home),
          title: Text("AnaSayfa"),//"Anasayfa"
          activeColor: Colors.red,
          textAlign: TextAlign.center,
        ),
        BottomNavyBarItem(
          icon: Icon(Icons.hotel),
          title: Text("Hotel Bilgileri"),
          activeColor: Colors.purpleAccent,
          textAlign: TextAlign.center,
        ),
        BottomNavyBarItem(
          icon: Icon(Icons.notifications),
          title: Text("Bildirimler"),
          activeColor: Colors.pink,
          textAlign: TextAlign.center,
        ),
        BottomNavyBarItem(
          icon: Icon(Icons.person),
          title: Text("Profilim"),
          activeColor: Colors.blue,
          textAlign: TextAlign.center,
        ),
      ],
    );
  }

  GlobalKey<ConvexAppBarState> _appBarKey = GlobalKey<ConvexAppBarState>();



  Widget bottomStyle2(){
    return StyleProvider(
      style: Style(),
      child: ConvexAppBar(
       // style: TabStyle.react,
        key: _appBarKey,
        initialActiveIndex: currentTabIndex,
        onTap: (index) {
          _pageController.jumpToPage(index);
          _onItemTapped(index);
        },
        items: [
          TabItem(
            icon: Icon(Icons.home,color: currentTabIndex==0?Colors.green.shade800:Colors.white,),
            title: "AnaSayfa",
          ),
          TabItem(
            icon: Icon(Icons.hotel,color: currentTabIndex==1?Colors.green.shade800:Colors.white,),
            title: "Hotel Bilgileri",
          ),
          TabItem(
            icon: Icon(Icons.notifications,color: currentTabIndex==2?Colors.green.shade800:Colors.white,),
            title:"Bildirimler"

          ),
          TabItem(
            icon: Icon(Icons.person,color: currentTabIndex==3?Colors.green.shade800:Colors.white,),
            title: "Profilim",
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: null,
      body: SizedBox.expand(
        child: PageView(
          controller: _pageController,
          onPageChanged: (index) {
            if(_appBarKey.currentState!=null){
              _appBarKey.currentState!.animateTo(index);
            }
            _onItemTapped(index);
          },
          children: pages,
        ),
      ),
      bottomNavigationBar:  bottomStyle2(), // bottomStyle2
    );
  }
}

class Style extends StyleHook {
  @override
  double get activeIconSize => 10;

  @override
  double get activeIconMargin => 10;

  @override
  double get iconSize => 10;

  @override
TextStyle textStyle(Color color, String? fontFamily) {
  return TextStyle(
      color: Colors.white,
      overflow: TextOverflow.ellipsis,
      fontSize: 12,
      fontWeight: FontWeight.bold);
}

}

Widget bottomStyle3() {
  // https://pub.dev/packages/bubble_bottom_bar/example
  return BubbleBottomBar(
    opacity: .4,
    currentIndex: currentTabIndex,
    onTap: (index) {
      _onItemTapped(index!);
      _pageController.jumpToPage(index);
    },
    borderRadius: BorderRadius.vertical(top: Radius.circular(16)),
    elevation: 8,
    fabLocation: BubbleBottomBarFabLocation.end,
    //new
    hasNotch: true,
    //new
    hasInk: true,
    //new, gives a cute ink effect
    backgroundColor: ThemeProvider.themeOf(context).data.bottomAppBarColor,

    inkColor: Colors.black12,

    //optional, uses theme color if not specified
    items: <BubbleBottomBarItem>[
      BubbleBottomBarItem(
        backgroundColor:getSeciliColor(),
        icon: Icon(
          Icons.home,
          color: getSeciliDegilColor(),
        ),
        activeIcon: Icon(
          Icons.home,
          color: getTextColor(),
        ),
        title: Text(
          "İlanlar",
          style: TextStyle(color: getTextColor()),
        ),
      ),
      BubbleBottomBarItem(
        backgroundColor:
        getSeciliColor(),
        icon: Icon(
          Icons.library_books,
          color: getSeciliDegilColor(),
        ),
        activeIcon: Icon(
          Icons.library_books,
          color: getTextColor(),
        ),
        title: Text(
          "Teklif",
          style: TextStyle(color: getTextColor()),
        ),
      ),
      BubbleBottomBarItem(
        backgroundColor:
        getSeciliColor(),
        icon: Icon(
          Icons.notifications,
          color: getSeciliDegilColor(),
        ),
        activeIcon: Icon(
          Icons.home,
          color: getTextColor(),
        ),
        title: Text(
          "Bildirimler",
          style: TextStyle(color: getTextColor()),
        ),
      ),
      BubbleBottomBarItem(
        backgroundColor:
        getSeciliColor(),
        icon: Icon(
          Icons.person,
          color: getSeciliDegilColor(),
        ),
        activeIcon: Icon(
          Icons.person,
          color: getTextColor(),
        ),
        title: Text(
          "Profilim",
          style: TextStyle(color: getTextColor()),
        ),
      ),
    ],
  );
}