import 'package:flutter/material.dart'; import '../theme.dart'; /// 消息列表 / 通讯录共用的搜索框(效果图 m1/m3): /// 未输入时「放大镜 + 搜索」居中显示,输入后正常左对齐。 class SearchBox extends StatefulWidget { final ValueChanged onChanged; const SearchBox({super.key, required this.onChanged}); @override State createState() => _SearchBoxState(); } class _SearchBoxState extends State { final TextEditingController _ctrl = TextEditingController(); @override void dispose() { _ctrl.dispose(); super.dispose(); } @override Widget build(BuildContext context) { return Padding( padding: const EdgeInsets.symmetric(horizontal: AppGap.x3, vertical: AppGap.x2), child: Stack( alignment: Alignment.centerLeft, children: [ TextField( controller: _ctrl, onChanged: (v) { setState(() {}); widget.onChanged(v.trim()); }, decoration: InputDecoration( filled: true, fillColor: AppColors.searchBg, isDense: true, contentPadding: const EdgeInsets.symmetric(horizontal: AppGap.x3, vertical: AppGap.x2), border: OutlineInputBorder( borderRadius: BorderRadius.circular(8), borderSide: BorderSide.none, ), ), ), // 空内容时的居中占位(不拦截点击,点按穿透到输入框) if (_ctrl.text.isEmpty) const IgnorePointer( child: Center( child: Row( mainAxisSize: MainAxisSize.min, children: [ Icon(Icons.search, size: 20, color: AppColors.textSecondary), SizedBox(width: AppGap.x1), Text('搜索', style: TextStyle(fontSize: AppFont.sub, color: AppColors.textSecondary)), ], ), ), ), ], ), ); } }