dating_touchme_app/lib/pages/mine/my_friend_page.dart

import 'package:dating_touchme_app/components/page_appbar.dart';
import 'package:dating_touchme_app/controller/mine/my_friend_controller.dart';
import 'package:dating_touchme_app/generated/assets.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:tdesign_flutter/tdesign_flutter.dart';

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

  @override
  Widget build(BuildContext context) {
    return GetX<MyFriendController>(
      init: MyFriendController(),
      builder: (controller){
        return Scaffold(
          appBar: PageAppbar(title: "我的关注${controller.sum.value}"),
          body: SingleChildScrollView(
            child: Container(
              padding: EdgeInsets.all(22.w),
              child: Column(
                children: [
                  TDTabBar(
                    tabs: [
                      TDTab(
                        child: Padding(
                          padding: EdgeInsets.only(right: 16, left: 16),
                          child: Text('全部'),
                        ),
                      ),
                      TDTab(
                        child: Padding(
                          padding: EdgeInsets.only(right: 16, left: 16),
                          child: Text('同城'),
                        ),
                      ),
                      TDTab(
                        child: Padding(
                          padding: EdgeInsets.only(right: 12, left: 12),
                          child: Text('相亲视频'),
                        ),
                      ),
                      TDTab(
                        child: Padding(
                          padding: EdgeInsets.only(right: 12, left: 12),
                          child: Text('相亲语音'),
                        ),
                      ),
                    ],
                    backgroundColor: Colors.transparent,
                    labelPadding: const EdgeInsets.only(right: 4, top: 10, bottom: 10, left: 4),
                    selectedBgColor: const Color.fromRGBO(108, 105, 244, 1),
                    unSelectedBgColor: Colors.transparent,
                    labelColor: Colors.white,
                    dividerHeight: 0,
                    tabAlignment: TabAlignment.start,
                    outlineType: TDTabBarOutlineType.capsule,
                    controller: controller.tabController,
                    showIndicator: false,
                    isScrollable: true,
                    onTap: (index) {
                      print('相亲页面 Tab: $index');
                    },
                  ),
                  if(false) ...[
                    Container(
                      padding: EdgeInsets.only(top: 60.w,bottom: 13.w),
                      child: Center(
                        child: Image.asset(
                          Assets.imagesEmptyIcon,
                          width: 91.w,
                          height: 91.w,
                        ),
                      ),
                    ),
                    Text(
                      "你还没有关注任何人噢",
                      style: TextStyle(
                          fontSize: 12.w,
                          fontWeight: FontWeight.w500,
                          color: const Color.fromRGBO(144, 144, 144, 1)
                      ),
                    ),
                    Container(
                      width: 151.w,
                      height: 32.w,
                      margin: EdgeInsets.only(top: 11.w),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.all(Radius.circular(32.w)),
                        gradient: LinearGradient(
                          begin: Alignment.centerLeft,
                          end: Alignment.centerRight,
                          stops: [0.0, 0.7753, 1.0],
                          colors: [
                            Color.fromRGBO(131, 89, 255, 1),
                            Color.fromRGBO(77, 127, 231, 1),
                            Color.fromRGBO(61, 138, 224, 1),
                          ],
                        ),
                      ),
                      child: Center(
                        child: Text(
                          "去聊聊",
                          style: TextStyle(
                              fontSize: 12.w,
                              color: Colors.white,
                              fontWeight: FontWeight.w500
                          ),
                        ),
                      ),
                    ),
                  ],
                  ...[
                    UserItem(),
                    UserItem(),
                    UserItem(),
                    UserItem(),
                    UserItem(),
                    UserItem(),
                    UserItem(),
                  ]
                ],
              ),
            ),
          ),
        );
      },
    );
  }
}

class UserItem extends StatefulWidget {
  const UserItem({super.key});

  @override
  State<UserItem> createState() => _UserItemState();
}

class _UserItemState extends State<UserItem> {
  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.symmetric(
        vertical: 15.w
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Row(
            children: [
              ClipRRect(
                borderRadius: BorderRadius.all(Radius.circular(45.w)),
                child: Image.asset(
                  Assets.imagesUserAvatar,
                  width: 45.w,
                  height: 45.w,
                ),
              ),
              SizedBox(width: 9.w,),
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Row(
                    children: [
                      Text(
                        "叫我大王",
                        style: TextStyle(
                          fontSize: 14.w,
                          fontWeight: FontWeight.w500
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.only(left: 7.w),
                        width: 12.w,
                        height: 12.w,
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.all(Radius.circular(12.w)),
                          color: const Color.fromRGBO(255, 237, 255, 1)
                        ),
                        child: Center(
                          child: Image.asset(
                            Assets.imagesFemale,
                            width: 7.w,
                          ),
                        ),
                      )
                    ],
                  ),
                  Text(
                    "30岁·广州",
                    style: TextStyle(
                      fontSize: 11.w,
                      color: const Color.fromRGBO(144, 144, 144, 1),
                      fontWeight: FontWeight.w500
                    ),
                  )
                ],
              )
            ],
          ),
          Container(
            width: 60.w,
            height: 22.w,
            decoration: BoxDecoration(
              borderRadius: BorderRadius.all(Radius.circular(22.w)),
              color: const Color.fromRGBO(224, 224, 224, .5)
            ),
            child: Center(
              child: Text(
                "已关注",
                style: TextStyle(
                  fontSize: 11.w,
                  color: const Color.fromRGBO(144, 144, 144, 1),
                  fontWeight: FontWeight.w500
                ),
              ),
            ),
          )
        ],
      ),
    );
  }
}