ToneSnap_FSX_Flutter/lib/modules/sideb/home/home_view.dart

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:tone_snap/components/base_scrollbar.dart';
import 'package:tone_snap/components/view_state_widget.dart';
import 'package:tone_snap/data/enum/music_type.dart';
import 'package:tone_snap/data/models/browse_group_model.dart';
import 'package:tone_snap/generated/assets.dart';
import 'package:tone_snap/modules/sideb/widgets/browse_item_album_song_list.dart';
import 'package:tone_snap/modules/sideb/widgets/browse_item_atv.dart';
import 'package:tone_snap/modules/sideb/widgets/remove_padding_music_bar.dart';
import 'package:tone_snap/utils/obj_util.dart';

import 'home_controller.dart';

class HomeView extends GetView<HomeController> {
  const HomeView({super.key});

  @override
  Widget build(BuildContext context) {
    Get.put(HomeController());

    return SafeArea(
      child: Column(
        children: [
          _buildTitle(),
          _buildList(context),
          const RemovePaddingMusicBar(),
        ],
      ),
    );
  }

  Widget _buildTitle() {
    return Container(
      margin: const EdgeInsets.symmetric(vertical: 10).h,
      height: 32.h,
      child: Row(
        children: [
          SizedBox(width: 18.w),
          Expanded(
            child: GestureDetector(
              onTap: controller.openSearch,
              child: Container(
                height: 32.h,
                padding: EdgeInsets.symmetric(horizontal: 18.w),
                decoration: BoxDecoration(
                  color: const Color(0xFF212121),
                  borderRadius: BorderRadius.circular(20).r,
                ),
                child: Row(
                  children: [
                    Image.asset(
                      Assets.sideBSearchWhite,
                      width: 16.w,
                      height: 16.w,
                    ),
                    SizedBox(width: 10.w),
                    Text(
                      'Search songs,playlists',
                      overflow: TextOverflow.ellipsis,
                      style: TextStyle(
                        color: const Color(0xFF666666),
                        fontSize: 14.sp,
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ),
          SizedBox(width: 12.w),
          ClipOval(
            child: Material(
              color: Colors.transparent,
              child: InkWell(
                onTap: controller.openSetting,
                child: Padding(
                  padding: const EdgeInsets.all(6).w,
                  child: Image.asset(
                    Assets.sideBLineMenu,
                    width: 24.w,
                    height: 24.w,
                  ),
                ),
              ),
            ),
          ),
          SizedBox(width: 12.w),
        ],
      ),
    );
  }

  Widget _buildList(BuildContext context) {
    return Expanded(
      child: Obx(() {
        return ViewStateWidget(
          viewState: controller.viewState.value,
          child: BaseScrollbar(
            child: Obx(() {
              return ListView.separated(
                padding: const EdgeInsets.only(bottom: 16).h,
                itemCount: controller.groupList.length,
                separatorBuilder: (context, index) => SizedBox(height: 16.h),
                itemBuilder: (context, index) {
                  final browseGroupModel = controller.groupList[index];
                  if (!MusicTypeExtension.isThereAny(browseGroupModel.musicType)) {
                    return Container();
                  }
                  return Column(
                    children: [
                      _buildGroupTitle(ObjUtil.getStr(browseGroupModel.groupTitle)),
                      if (browseGroupModel.musicType == MusicType.musicVideoTypeAtv.name) ...[
                        _buildGroupAtv(browseGroupModel),
                      ] else ...[
                        _buildGroupPlaylist(browseGroupModel),
                      ],
                    ],
                  );
                },
              );
            }),
          ),
        );
      }),
    );
  }

  Widget _buildGroupAtv(BrowseGroupModel browseGroupModel) {
    return SizedBox(
      height: 200.h,
      child: GridView.builder(
        padding: EdgeInsets.symmetric(horizontal: 16.w),
        scrollDirection: Axis.horizontal,
        itemCount: browseGroupModel.browseList != null ? browseGroupModel.browseList!.length : 0,
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 3,
          mainAxisSpacing: 0,
          crossAxisSpacing: 10.h,
          childAspectRatio: 60.w / (1.sw - 16.w),
        ),
        itemBuilder: (context, index) {
          final musicModel = browseGroupModel.browseList![index];
          return BrowseItemAtv(
            musicModel: musicModel,
            onTap: () => controller.openPlayPage(musicModel),
          );
        },
      ),
    );
  }

  Widget _buildGroupPlaylist(BrowseGroupModel browseGroupModel) {
    return SizedBox(
      height: 160.h,
      child: ListView.separated(
        padding: EdgeInsets.symmetric(horizontal: 16.w),
        scrollDirection: Axis.horizontal,
        itemCount: browseGroupModel.browseList != null ? browseGroupModel.browseList!.length : 0,
        separatorBuilder: (context, index) => SizedBox(width: 8.w),
        itemBuilder: (context, index) {
          final musicModel = browseGroupModel.browseList![index];
          return BrowseItemAlbumSongList(
            musicModel: musicModel,
            onTap: () => controller.openAlbumSong(musicModel),
          );
        },
      ),
    );
  }

  Widget _buildGroupTitle(String title, {bool showMore = false}) {
    return InkWell(
      onTap: () {},
      child: Container(
        height: 40.h,
        padding: const EdgeInsets.symmetric(horizontal: 16).w,
        child: Row(
          children: [
            Expanded(
              child: Text(
                title,
                maxLines: 1,
                overflow: TextOverflow.ellipsis,
                style: TextStyle(
                  color: Colors.white,
                  fontSize: 18.sp,
                ),
              ),
            ),
            if (showMore) ...[
              SizedBox(width: 16.w),
              Image.asset(
                Assets.sideBArrowRightItem,
                width: 24.w,
                height: 24.w,
              ),
            ],
          ],
        ),
      ),
    );
  }
}