import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:wallpaperx/generated/assets.dart';
import 'package:wallpaperx/page/browse_history/browse_history_view.dart';
import 'package:wallpaperx/page/collection/collection_view.dart';
import 'package:wallpaperx/page/library/library_controller.dart';

class LibraryView extends GetView<LibraryController> {
  const LibraryView({super.key});

  @override
  Widget build(BuildContext context) {
    Get.put(LibraryController());
    return Scaffold(
      body: Container(
        decoration: const BoxDecoration(
          image: DecorationImage(
            image: AssetImage(Assets.imagesSettingBackground),
            fit: BoxFit.cover,
          ),
        ),
        child: Column(
          children: [
            SizedBox(height: MediaQuery.of(context).padding.top),
            _buildTabBar(),
            _buildBody(),
          ],
        ),
      ),
    );
  }

  Widget _buildTabBar() {
    return GetBuilder<LibraryController>(
      id: "buildTopBar",
      builder: (_) {
        return TabBar(
          overlayColor: WidgetStateProperty.all(Colors.transparent),
          dividerHeight: 0,
          padding: EdgeInsets.zero,
          indicatorColor: Colors.transparent,
          controller: controller.tabController,
          tabAlignment: TabAlignment.center,
          labelStyle: TextStyle(
            color: Colors.white,
            fontSize: 22.sp,
            fontWeight: FontWeight.w600,
          ),
          unselectedLabelStyle: TextStyle(
            color: Colors.grey,
            fontSize: 18.sp,
          ),
          tabs: [
            Stack(
              clipBehavior: Clip.none,
              alignment: AlignmentDirectional.bottomEnd,
              children: [
                Visibility(
                  visible: controller.tabController.index == 0,
                  child: Positioned(
                    right: -5.5.w,
                    bottom: 10.w,
                    child: Image.asset(
                      Assets.iconTabbarSelected,
                      width: 30.w,
                      height: 9.w,
                      fit: BoxFit.fill,
                    ),
                  ),
                ),
                const Tab(text: "Favorites"),
              ],
            ),
            Stack(
              clipBehavior: Clip.none,
              alignment: AlignmentDirectional.bottomEnd,
              children: [
                Visibility(
                  visible: controller.tabController.index == 1,
                  child: Positioned(
                    right: -5.5.w,
                    bottom: 10.w,
                    child: Image.asset(
                      Assets.iconTabbarSelected,
                      width: 30.w,
                      height: 9.w,
                      fit: BoxFit.fill,
                    ),
                  ),
                ),
                const Tab(text: "History"),
              ],
            ),
          ],
        );
      },
    );
  }

  Widget _buildBody() {
    return Expanded(
      child: TabBarView(
        controller: controller.tabController,
        children: const [
          CollectionView(),
          BrowseHistoryView(),
        ],
      ),
    );
  }
}