build method

  1. @override
Widget build(
  1. BuildContext context
)
override

Builds a Row widget that displays detailed information about a product.

This widget includes the following components:

  • A ClipRRect that displays the product's image with rounded corners.
  • A Column containing:
    • A Row with the product name and a CupertinoButtonComponent to contact the producer via WhatsApp.
    • A Text displaying the production family name.
    • A Row with the production family's website and a button to visit the URL.
    • A Row showing the product price in Saudi Riyals (SAR).
    • A Row displaying the product's rating using a RatingBar and the number of reviews.

Implementation

@override
/// Builds a [Row] widget that displays detailed information about a product.
///
/// This widget includes the following components:
/// - A [ClipRRect] that displays the product's image with rounded corners.
/// - A [Column] containing:
///   - A [Row] with the product name and a [CupertinoButtonComponent] to contact
///     the producer via WhatsApp.
///   - A [Text] displaying the production family name.
///   - A [Row] with the production family's website and a button to visit the URL.
///   - A [Row] showing the product price in Saudi Riyals (SAR).
///   - A [Row] displaying the product's rating using a [RatingBar] and the number
///     of reviews.
Widget build(BuildContext context) {
  final tr = AppLocalizations.of(context)!; // Get AppLocalizations instance
  return CupertinoButtonComponent(
    onPressed: onPressed,
    child: Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        ClipRRect(
          borderRadius: BorderRadius.circular(AppConstants.inBorderRadius),
          child: Image.asset(
            product.imagePaths.first,
            width: 120,
            height: 90,
            fit: BoxFit.cover,
          ),
        ),
        const SizedBox(width: 8),
        Expanded(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                children: [
                  Text(
                    product
                        .name, // Name is already in English from ProductModel
                    style: const TextStyle(
                      fontSize: 18,
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                  const Spacer(),
                  CupertinoButtonComponent(
                    icon: const Icon(CupertinoIcons.phone),
                    onPressed: () {
                      UrlRunServices.launchURL(
                        'https://wa.me/${product.productWhatsappNumber}',
                      );
                    },
                  ),
                ],
              ),
              Text(
                '${tr.productionFamily} ${product.productionFamilyName}',
              ), // Translated "الاسرة المنتجة:"
              Row(
                children: [
                  Text(
                    '${tr.theirWebsite} ',
                  ), // Translated "موقعهم الالكتروني:"
                  CupertinoButtonComponent(
                    onPressed: () {
                      UrlRunServices.launchURL(
                        product.productionFamilyWebsiteUrl,
                      );
                    },
                    text: tr.clickHere, // Translated "اضغط هنا"
                  ),
                ],
              ),
              Row(
                children: [
                  Text(
                    '${tr.productPrice} ${product.productPrice} ${tr.sar}',
                  ), // Translated "سعر المنتج: ... ريال"
                ],
              ),
              Row(
                children: [
                  Text('${tr.productRating} '), // Translated "تقييم المنتج:"
                  RatingBar(
                    ratingWidget: RatingWidget(
                      full: const Icon(
                        CupertinoIcons.star_fill,
                        color: CupertinoColors.activeOrange,
                      ),
                      half: const Icon(
                        CupertinoIcons.star_lefthalf_fill,
                        color: CupertinoColors.activeOrange,
                      ),
                      empty: const Icon(
                        CupertinoIcons.star,
                        color: CupertinoColors.systemGrey,
                      ),
                    ),
                    onRatingUpdate: (_) {},
                    initialRating: product.productRating,
                    minRating: 0,
                    direction: Axis.horizontal,
                    allowHalfRating: true,
                    tapOnlyMode: false,
                    ignoreGestures: true,
                    itemSize: 20,
                  ),
                  Text('(${product.productReviweCount})'),
                ],
              ),
            ],
          ),
        ),
      ],
    ),
  );
}