dating_touchme_app/lib/pages/home/event_info.dart

import 'package:cached_network_image/cached_network_image.dart';
import 'package:dating_touchme_app/components/page_appbar.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class EventInfo extends StatelessWidget {
  const EventInfo({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: const PageAppbar(title: "活动详情"),
      body: SingleChildScrollView(
        child: Container(
          padding: EdgeInsets.all(15.w),
          child: ClipRRect(
            borderRadius: BorderRadius.all(Radius.circular(8.w)),
            child: Container(
              width: 345.w,
              color: Colors.white,
              child: Column(
                children: [
                  CachedNetworkImage(
                    imageUrl: "https://dating-agency-test.oss-accelerate.aliyuncs.com/1.png",
                    width: 345.w,
                    fit: BoxFit.cover,
                  ),
                  Container(
                    padding: EdgeInsets.symmetric(horizontal: 10.w, vertical: 15.w),
                    margin: EdgeInsets.only(bottom: 15.w),
                    child: Column(
                      children: [
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              "星河 DEEP--轻奢浪漫之旅",
                              style: TextStyle(
                                fontSize: 18.w,
                                color: const Color.fromRGBO(255, 66, 236, 1),
                                fontWeight: FontWeight.w500
                              ),
                            ),
                            Row(
                              children: [
                                Icon(
                                    Icons.group,
                                  color: const Color.fromRGBO(255, 66, 236, 1),
                                  size: 12.w,
                                ),
                                SizedBox(width: 5.w,),
                                Text(
                                  "0人已报名",
                                  style: TextStyle(
                                    fontSize: 12.w,
                                    color: const Color.fromRGBO(144, 144, 144, 1)
                                  ),
                                )
                              ],
                            )
                          ],
                        ),
                        SizedBox(height: 5.w,),
                        Row(
                          children: [
                            Icon(
                                Icons.access_time,
                              color: const Color.fromRGBO(255, 66, 236, 1),
                              size: 12.w,
                            ),
                            Text(
                              "活动时间：",
                              style: TextStyle(
                                  fontSize: 12.w,
                                  color: const Color.fromRGBO(144, 144, 144, 1)
                              ),
                            ),
                            Text(
                              "08-21 00:00至08-22 23:59",
                              style: TextStyle(
                                  fontSize: 12.w,
                                  color: const Color.fromRGBO(144, 144, 144, 1)
                              ),
                            )
                          ],
                        ),
                        SizedBox(height: 5.w,),
                        Row(
                          children: [
                            Icon(
                              Icons.location_on_outlined,
                              color: const Color.fromRGBO(255, 66, 236, 1),
                              size: 12.w,
                            ),
                            Text(
                              "地址：",
                              style: TextStyle(
                                  fontSize: 12.w,
                                  color: const Color.fromRGBO(144, 144, 144, 1)
                              ),
                            ),
                            Text(
                              "广州市天河区地址待定",
                              style: TextStyle(
                                  fontSize: 12.w,
                                  color: const Color.fromRGBO(144, 144, 144, 1)
                              ),
                            )
                          ],
                        ),
                        SizedBox(height: 5.w,),
                        Row(
                          children: [
                            Icon(
                              Icons.group_outlined,
                              color: const Color.fromRGBO(255, 66, 236, 1),
                              size: 12.w,
                            ),
                            Text(
                              "人数：",
                              style: TextStyle(
                                  fontSize: 12.w,
                                  color: const Color.fromRGBO(144, 144, 144, 1)
                              ),
                            ),
                            Text(
                              "男10人 女10人",
                              style: TextStyle(
                                  fontSize: 12.w,
                                  color: const Color.fromRGBO(144, 144, 144, 1)
                              ),
                            )
                          ],
                        ),
                        SizedBox(height: 5.w,),
                        Row(
                          children: [
                            Icon(
                              Icons.currency_yen,
                              color: const Color.fromRGBO(255, 66, 236, 1),
                              size: 12.w,
                            ),
                            Text(
                              "费用：",
                              style: TextStyle(
                                  fontSize: 12.w,
                                  color: const Color.fromRGBO(144, 144, 144, 1)
                              ),
                            ),
                            Text(
                              "男：1520元/人",
                              style: TextStyle(
                                  fontSize: 12.w,
                                  color: const Color.fromRGBO(144, 144, 144, 1)
                              ),
                            )
                          ],
                        ),
                        Row(
                          children: [
                            Icon(
                              Icons.currency_yen,
                              color: const Color.fromRGBO(255, 66, 236, 0),
                              size: 12.w,
                            ),
                            Text(
                              "费用：",
                              style: TextStyle(
                                  fontSize: 12.w,
                                  color: const Color.fromRGBO(144, 144, 144, 0)
                              ),
                            ),
                            Text(
                              "女：1520元/人",
                              style: TextStyle(
                                  fontSize: 12.w,
                                  color: const Color.fromRGBO(144, 144, 144, 1)
                              ),
                            )
                          ],
                        ),
                        SizedBox(height: 15.w,),
                        Stack(
                          children: [
                            ClipRRect(
                              borderRadius: BorderRadius.all(Radius.circular(13.w)),
                              child: Row(
                                children: [
                                  Expanded(
                                    child: Container(
                                      height: 13.w,
                                      color: const Color.fromRGBO(237, 245, 255, 1),
                                    ),
                                  ),
                                  Expanded(
                                    child: Container(
                                      height: 13.w,
                                      color: const Color.fromRGBO(255, 237, 255, 1),
                                    ),
                                  ),
                                ],
                              ),
                            ),
                            Positioned(
                              child: Center(
                                child: Transform(
                                    transform: Matrix4.skewX(0.6),
                                  child: Container(width: 20.w, height: 13.w, color: Colors.white,),
                                ),
                              ),
                            )
                          ],
                        ),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Row(
                              children: [
                                Text(
                                  "男",
                                  style: TextStyle(
                                    fontSize: 13.w,
                                    color: const Color.fromRGBO(144, 144, 144, 1)
                                  ),
                                ),
                                Text(
                                  "0人",
                                  style: TextStyle(
                                      fontSize: 13.w,
                                    color: const Color.fromRGBO(237, 245, 255, 1),
                                  ),
                                ),
                              ],
                            ),
                            Row(
                              children: [
                                Text(
                                  "女",
                                  style: TextStyle(
                                      fontSize: 13.w,
                                      color: const Color.fromRGBO(144, 144, 144, 1)
                                  ),
                                ),
                                Text(
                                  "0人",
                                  style: TextStyle(
                                    fontSize: 13.w,
                                    color: const Color.fromRGBO(255, 237, 255, 1),
                                  ),
                                ),
                              ],
                            ),
                          ],
                        ),
                      ],
                    ),
                  ),
                  CachedNetworkImage(
                    imageUrl: "https://dating-agency-test.oss-accelerate.aliyuncs.com/09B987965731.jpg",
                    width: 345.w,
                    fit: BoxFit.cover,
                  )
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}