import 'package:flutter/material.dart';
import 'package:hoshan/data/model/banner_model.dart';
import 'package:hoshan/ui/widgets/components/image/network_image.dart';

class CustomeBanner extends StatefulWidget {
  final BannerModel bannerModel;
  final double width;
  final double height;
  const CustomeBanner(
    this.bannerModel, {
    super.key,
    required this.width,
    required this.height,
  });

  @override
  State<CustomeBanner> createState() => _CustomeBannerState();
}

class _CustomeBannerState extends State<CustomeBanner> {
  @override
  Widget build(BuildContext context) {
    return ClipRRect(
      borderRadius: BorderRadius.circular(16),
      child: SizedBox(
        width: widget.width,
        height: widget.height,
        child: Stack(
          children: [
            Row(
              children: [
                const Expanded(child: SizedBox.shrink()),
                Expanded(
                    flex: 2,
                    child: ImageNetwork(
                      height: widget.height,
                      url: widget.bannerModel.imageUrl,
                      error: AspectRatio(
                        aspectRatio: 1 / 1,
                        child: Container(
                          decoration: BoxDecoration(
                              gradient: LinearGradient(
                                  begin: Alignment.topLeft,
                                  end: Alignment.bottomRight,
                                  colors: [
                                ...widget.bannerModel.colors,
                              ])),
                        ),
                      ),
                      placeholder: AspectRatio(
                        aspectRatio: 1 / 1,
                        child: Container(
                          decoration: BoxDecoration(
                              gradient: LinearGradient(
                                  begin: Alignment.topLeft,
                                  end: Alignment.bottomRight,
                                  colors: [
                                ...widget.bannerModel.colors,
                              ])),
                        ),
                      ),
                    )),
              ],
            ),
            Positioned.fill(
              child: Container(
                decoration: BoxDecoration(
                    gradient: LinearGradient(colors: [
                  Colors.transparent,
                  ...widget.bannerModel.colors
                ], begin: Alignment.bottomRight, end: Alignment.topLeft)),
              ),
            ),
            Positioned.fill(child: widget.bannerModel.child),
          ],
        ),
      ),
    );
  }
}