import 'package:flutter/material.dart';
import 'package:geolocator/geolocator.dart';
import 'package:huixiang/generated/l10n.dart';
import 'package:huixiang/data/article.dart';
import 'package:huixiang/data/headlines.dart';
import 'package:huixiang/retrofit/retrofit_api.dart';
import 'package:huixiang/utils/font_weight.dart';
import 'package:huixiang/view_widget/custom_image.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class HeadlinesCollection extends StatefulWidget {
  final List<Headlines> headlines;
  final List<Article> articles;

  HeadlinesCollection(this.headlines, this.articles);

  @override
  State<StatefulWidget> createState() {
    return _HeadlinesCollection();
  }
}

class _HeadlinesCollection extends State<HeadlinesCollection> {
  ApiService? apiService;
  Position? latLng;

  final TextEditingController editingController = TextEditingController();

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

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 100.h,
      margin: EdgeInsets.only(top:10),
      child: ListView.builder(
        scrollDirection: Axis.horizontal,
        physics: BouncingScrollPhysics(),
        padding: EdgeInsets.symmetric(horizontal: 10),
        itemCount: widget.headlines == null ? 0 : widget.headlines.length,
        itemBuilder: (context, position) {
          return GestureDetector(
            onTap: () {
              Navigator.of(context).pushNamed(
                  '/router/headlines_column_details',
                  arguments: {"id": widget.headlines[position].id});
            },
            child: headlinesCollectionItem(widget.headlines[position]),
          );
        },
      ),
    );
  }

  Widget headlinesCollectionItem(Headlines headlines) {
    return Container(
      width: 225.w,
      height:100.h,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(4),
        boxShadow: [
          BoxShadow(
            color: Colors.black.withAlpha(10),
            offset: Offset(0, 3),
            blurRadius: 14,
            spreadRadius: 0,
          )
        ],
        color: Colors.black,
      ),
      margin: EdgeInsets.symmetric(
        horizontal:6,
      ),
      child: Stack(
        children: [
          ClipRRect(
            child: Opacity(
              opacity: 0.8,
              child: MImage(
                headlines.coverImg ?? "",
                width: 225.w,
                height: 100.h,
                fit: BoxFit.cover,
                errorSrc: "assets/image/default_1.webp",
                fadeSrc: "assets/image/default_1.webp",
              ),
            ),
            borderRadius: BorderRadius.vertical(
              top: Radius.circular(4),
              bottom: Radius.circular(4),
            ),
          ),
          Container(
            padding: EdgeInsets.only(left:12.w,right: 12.w,bottom: 8),
            alignment: Alignment.bottomLeft,
            child: Row(
              children: [
                Container(
                  margin: EdgeInsets.only(right:4),
                  padding:EdgeInsets.only(left:2,right:2),
                  height:22.h,
                  alignment: Alignment.center,
                  decoration: BoxDecoration(
                    borderRadius:
                    BorderRadius.circular(2),
                    color: Color(0xFF007EFF),
                  ),
                  child: Text(
                    S.of(context).zhuanlan,
                    style: TextStyle(
                      fontSize: 12.sp,
                      fontWeight: MyFontWeight.medium,
                      color: Colors.white,
                    ),
                  ),
                ),
                Expanded(child:Text(
                  headlines.name ?? "",
                  overflow: TextOverflow.ellipsis,
                  maxLines: 2,
                  style: TextStyle(
                    fontSize: 15.sp,
                    fontWeight: MyFontWeight.semi_bold,
                    color: Colors.white,
                  ),
                ),),
              ],)
          ),
        ],
      ),
    );
  }

}