Flutter:搜索页,历史记录,搜索bar封装

在这里插入图片描述

view
使用内置的Chip简化布局

import 'package:chenyanzhenxuan/common/index.dart';
import 'package:ducafe_ui_core/ducafe_ui_core.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:tdesign_flutter/tdesign_flutter.dart';

import 'index.dart';

class SearchGoodsPage extends GetView<SearchGoodsController> {
   
    
    
  const SearchGoodsPage({
   
    
    super.key});

  // 搜索
  Widget _buildSearch() {
   
    
    
    return <Widget>[
      SearchWidget(
        type: 'input',
        inputBgColor: AppTheme.pageBgColor,
        controller: controller.searchController,
        onChange: (value) {
   
    
    
          controller.onSearchChange(value);
        },
      ),
    ].toRow()
    .paddingAll(30.w)
    .card(shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(0)));
  }

  // 热门搜索
  Widget _buildHotSearch() {
   
    
     
    return <Widget>[
      <Widget>[
        TDImage(assetUrl: 'assets/img/hot.png',width: 34.w,height: 34.w,),
        SizedBox(width: 10.w,),
        TextWidget.body('热门搜索',size: 28.sp,),
      ].toRow().paddingHorizontal(30.w),

      <Widget>[
        for(var i = 0; i < 6; i++)
        Chip(
          label: TextWidget.body('热门搜索$i',size: 24.sp,color: AppTheme.color999,),
          backgroundColor: AppTheme.blockBgColor,
          shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10.w)),
        )
      ].toWrap(spacing: 20.w,runSpacing: 0,).paddingLeft(30.w),
    ].toColumn(crossAxisAlignment: CrossAxisAlignment.start);
  }

  // 历史记录
  Widget _buildHistory(BuildContext context) {
   
    
    
    return <Widget>[
      <Widget>[
        TextWidget.body('历史记录',size: 28.sp