ElectronicAssistant/lib/module/files/view.dart

import 'package:electronic_assistant/base/base_page.dart';
import 'package:electronic_assistant/module/files/controller.dart';
import 'package:electronic_assistant/resource/colors.gen.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import '../../resource/assets.gen.dart';

class FilesPage extends BasePage<FilesController> {
  const FilesPage({super.key});

  @override
  Widget? buildBody(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Column(
            children: [
              AppBar(
                title: const Text('文件夹'),
                actions: [
                  IconButton(
                    onPressed: () {},
                    icon: ImageIcon(Assets.images.iconFilesNewDir.provider()),
                  ),
                  IconButton(
                    onPressed: () {},
                    icon: ImageIcon(Assets.images.iconMore.provider()),
                  ),
                ],
              ),
              Container(
                margin: EdgeInsets.symmetric(horizontal: 12.w),
                padding: EdgeInsets.symmetric(horizontal: 10.w, vertical: 8.w),
                height: 36.w,
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(8.w),
                ),
                child: TextField(
                  maxLines: 1,
                  textAlignVertical: TextAlignVertical.center,
                  decoration: InputDecoration(
                    hintText: '搜索所有文件标题 / 内容',
                    border: InputBorder.none,
                    icon: ImageIcon(Assets.images.iconSearch.provider()),
                    iconColor: const Color.fromRGBO(95, 95, 97, 1),
                  ),
                  style: TextStyle(fontSize: 14.sp),
                ),
              ),
            ],
          ),
          Expanded(
              child: Padding(
                  padding: EdgeInsets.only(top: 16.w, left: 12.w, right: 12.w),
                  child: CustomScrollView(
                    slivers: [
                      SliverAnimatedGrid(
                        itemBuilder: _buildDirItem,
                        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                          crossAxisCount: 2,
                          crossAxisSpacing: 8.w,
                          mainAxisSpacing: 8.w,
                          childAspectRatio: 164 / 65,
                        ),
                        initialItemCount: 10,
                      ),
                      SliverToBoxAdapter(
                        child: Padding(
                            padding: EdgeInsets.only(top: 20.w, bottom: 12.w),
                            child: Text('全部谈话',
                                style: TextStyle(
                                    fontSize: 14.sp,
                                    color: ColorName.secondaryTextColor,
                                    fontWeight: FontWeight.bold))),
                      ),
                      SliverAnimatedList(
                        itemBuilder: _buildFileItem,
                        initialItemCount: 20,
                      )
                    ],
                  )))
        ],
      ),
    );
  }

  Widget _buildDirItem(
      BuildContext context, int index, Animation<double> animation) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8.w),
      ),
      padding: EdgeInsets.only(left: 8.w),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Image(
              image: Assets.images.iconFilesDir.provider(),
              width: 32.w,
              height: 32.w),
          Expanded(
              child: Padding(
            padding: EdgeInsets.symmetric(horizontal: 8.w),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text('文件夹',
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                    style: TextStyle(
                        fontSize: 14.sp,
                        color: ColorName.primaryTextColor,
                        fontWeight: FontWeight.bold)),
                Text('2021-09-09 12:00:00',
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                    style: TextStyle(
                        fontSize: 12.sp, color: ColorName.secondaryTextColor)),
              ],
            ),
          ))
        ],
      ),
    );
  }

  Widget _buildFileItem(
      BuildContext context, int index, Animation<double> animation) {
    return Padding(
        padding: EdgeInsets.only(bottom: 8.w),
        child: Container(
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(8.w),
          ),
          padding: EdgeInsets.symmetric(horizontal: 10.w, vertical: 14.w),
          child: Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Image(
                  image: Assets.images.iconFilesFile.provider(),
                  width: 28.w,
                  height: 32.w),
              Expanded(
                  child: Padding(
                padding: EdgeInsets.symmetric(horizontal: 8.w),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text('文件标题',
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                        style: TextStyle(
                            fontSize: 14.sp,
                            color: ColorName.primaryTextColor,
                            fontWeight: FontWeight.bold)),
                    Text(
                        '这个群，现在由我管理。目的是把你们训练成一个个社会高薪人士，从本周起，hhhhhhhhhhhhh已经开始执行军事化理...',
                        maxLines: 2,
                        overflow: TextOverflow.ellipsis,
                        style: TextStyle(
                            fontSize: 12.sp,
                            color: ColorName.secondaryTextColor)),
                    Container(
                      margin: EdgeInsets.only(top: 6.w),
                      child: Row(
                        children: [
                          Text("1m12s",
                              style: TextStyle(
                                  fontSize: 12.sp,
                                  color: ColorName.tertiaryTextColor)),
                          Text(" | ",
                              style: TextStyle(
                                  fontSize: 12.sp,
                                  color: ColorName.tertiaryTextColor)),
                          Text("2021-09-09 12:00:00",
                              style: TextStyle(
                                  fontSize: 12.sp,
                                  color: ColorName.tertiaryTextColor)),
                        ],
                      ),
                    )
                  ],
                ),
              )),
            ],
          ),
        ));
  }
}