import 'package:betting/commom/utils/color_utils.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'default_sport_controller.dart';


class DefaultSportPage extends GetView<DefaultSportController> {
  @override
  final controller = Get.put(DefaultSportController());

  DefaultSportPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        Image.asset(
          "assets/images/background_app_betting.jpg",
          height: MediaQuery.of(context).size.height,
          width: MediaQuery.of(context).size.width,
          fit: BoxFit.cover,
        ),
        Scaffold(
          appBar: AppBar(
            backgroundColor: Colors.transparent,
            bottom: const PreferredSize(preferredSize: Size(double.infinity, 1), child: Divider(color: Colors.white,)),
            title: const Text("Default Sport",style: TextStyle(color: Colors.white),),
            centerTitle: true,
          ),
          backgroundColor: Colors.transparent,
          resizeToAvoidBottomInset: true,
          body: ListView.builder(
            itemCount: controller.listTitle.length,
            shrinkWrap: true,
            physics: const NeverScrollableScrollPhysics(),
            padding: EdgeInsets.zero,
            itemBuilder: (context, index) {
              return Obx(() => InkWell(
                onTap: () {
                  controller.indexSport.value = index;
                },
                child: Container(
                  decoration: const BoxDecoration(
                    border: Border(
                      bottom: BorderSide(color: Colors.white54),
                    ),),
                  padding: EdgeInsets.only(bottom: 4.h),
                  margin: EdgeInsets.only(bottom: 2.h),
                  child: Row(
                    children: [
                      SizedBox(width: 8.w,),
                      Icon(Icons.sports_soccer_outlined,color: controller.indexSport.value == index ?ColorUtils.PRIMARY_COLOR:Colors.white,),
                      SizedBox(width: 8.w,),
                      Text(controller.listTitle[index],
                        style: TextStyle(color: controller.indexSport.value == index ?ColorUtils.PRIMARY_COLOR:Colors.white),),
                      const Spacer(),
                      Visibility(
                          visible: controller.indexSport.value == index,
                          child: const Icon(Icons.check_circle,color: ColorUtils.PRIMARY_COLOR,size: 18,)),
                      SizedBox(width: 8.w,),
                    ],
                  ),
                ),
              ));
            },),
        )
      ],
    );
  }
}
