import 'package:flutter/material.dart';
import 'package:skywood/main/lib_file.dart';
import 'package:skywood/utils/models/drama/skywood_category.dart';
import 'package:skywood/utils/tools/widgets/sky_common_widget.dart';

import '../players/page/drama_detail_page.dart';

class HomeCateWidget extends StatelessWidget {

  const HomeCateWidget({super.key,
    required this.categories,
  });
  
  final List<SkywoodCategory> categories;

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 270, width: double.infinity,
      child: GridView.builder(
          scrollDirection: Axis.horizontal,
          gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 2,              // 🔥 上下2行
            crossAxisSpacing: 14,           // 行间距（垂直方向）
            mainAxisSpacing: 10,            // 列间距（水平方向）
            childAspectRatio: 140 / 131.0,          // 宽高比（宽度/高度）
          ),
          itemCount: categories.length,
          itemBuilder: (context, index) {
            return _buildCateItem(categories[index], index);
          }
      ),
    );
  }
  
  Widget _buildCateItem(SkywoodCategory category, int index) {
    String imgName = index%3 == 0 ? ConstImg.purpleBg : (index%3 == 1 ? ConstImg.yellowBg : ConstImg.redBg);
    return Stack(
      children: [
        HelpImg.asset(imgName, width: 140.w, height: 131.w, fit: BoxFit.fill),
        Positioned(
          bottom: 24.h, left: 10.w, right: 10.w,
          child: _customText(category.name,),
        )
      ],
    ).addInkWell(onTap: () {
      // HelpNav.to(DramaDetailPage(dramaBean: drama));
    });
  }

  _customText(String text) {
    return Text(
      text,
      textAlign: TextAlign.center,
      style: TextStyle(
        fontSize: 16,
        color: Colors.white, // 内部字体白色
        fontStyle: FontStyle.italic,
        fontFamily: 'Inter',
        fontWeight: FontWeight.w600,
        shadows: [
          Shadow(
            color: Colors.black, // 描边颜色
            offset: Offset(1, 1), // 偏移量
            blurRadius: 0, // 不模糊，形成硬边描边
          ),
          Shadow(
            color: Colors.black,
            offset: Offset(-1, -1),
            blurRadius: 0,
          ),
          Shadow(
            color: Colors.black,
            offset: Offset(1, -1),
            blurRadius: 0,
          ),
          Shadow(
            color: Colors.black,
            offset: Offset(-1, 1),
            blurRadius: 0,
          ),
          // 四个角再加一些，让描边更饱满
          // Shadow(
          //   color: Colors.black,
          //   offset: Offset(2, 0),
          //   blurRadius: 0,
          // ),
          // Shadow(
          //   color: Colors.black,
          //   offset: Offset(-2, 0),
          //   blurRadius: 0,
          // ),
          // Shadow(
          //   color: Colors.black,
          //   offset: Offset(0, 2),
          //   blurRadius: 0,
          // ),
          // Shadow(
          //   color: Colors.black,
          //   offset: Offset(0, -2),
          //   blurRadius: 0,
          // ),
        ],
      ),
    );
  }
}