Flutter高仿微信-第56篇-搜索好友

news2025/7/13 20:28:55

 Flutter高仿微信系列共59篇,从Flutter客户端、Kotlin客户端、Web服务器、数据库表结构、Xmpp即时通讯服务器、视频通话服务器、腾讯云服务器全面讲解。

 详情请查看

效果图:

实现代码:

/**
 * Author : wangning
 * Email : maoning20080809@163.com
 * Date : 2022/8/11 12:16
 * Description : 搜索好友
 */

Color themeDef = Color(0xffEDEDED);

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

  @override
  Widget build(BuildContext context) {
    return const SearchFriendsPage(title: '搜索好友');
  }
}

class SearchFriendsPage extends StatefulWidget {
  const SearchFriendsPage({super.key, required this.title});

  final String title;

  @override
  State<SearchFriendsPage> createState() => _SearchFriendsState();
}

class _SearchFriendsState extends State<SearchFriendsPage> {

  //搜索提示框
  bool hideSearch = true;
  //搜索结果
  bool hideSearchResult = true;

  //从服务器搜索好友
  void _getUserLikeAccount(String searchAccount) async {

    bool isNetwork = await CommonNetwork.isNetwork();
    if(!isNetwork) {
      CommonUtils.showNetworkError(context);
      return;
    }

    if(searchAccount.isEmpty){
      return;
    }
    String account = "";
    List<UserBean> userlist = await UserRepository.getInstance().getUserLikeAccount(account, searchAccount);
    if(userlist.isEmpty){
      hideSearchResult = false;
    }
    setState(() {
      _userlist = userlist;
    });
  }

  @override
  void initState() {
    super.initState();
  }

  String results = "";//原来的内容是空的
  final TextEditingController controller = TextEditingController(text: "");
  ScrollController _controller = ScrollController();
  List<UserBean> _userlist = [];

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: WnAppBar.getAppBar(context, Text("${widget.title}")),

      body: Column(
        children: [
          _getEnterAccountWidget(),
          _getSearchWidget(),
          Offstage(
            offstage: hideSearchResult,
            child: _noDataWidget(),
          ),

          Expanded(
              child: ListView.builder(
                controller: _controller,
                itemBuilder: (BuildContext context, int index) {
                  return ChatContentView(userBean: _userlist[index]);
                },
                itemCount: _userlist.length,
              )
          ),

        ],
      ),
    );
  }

  //没有好友提示
  Widget _noDataWidget() {
    return Center(
      child: Padding(
        padding: EdgeInsets.all(10.0),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            Text('搜索结果为空...',style: TextStyle(fontSize: 16.0),)
          ],
        ),
      ),
    );
  }

  //账号输入框
  Widget _getEnterAccountWidget(){
    return Container(
      height: 60,
      padding: const EdgeInsets.only(left: 20.0, top: 10, right: 10, bottom: 10),//上下左右都设置边距
      child: Row(
        children: [

            Expanded(
              child: Container(
                margin: EdgeInsets.only(right: 20),
                padding: EdgeInsets.only(left: 10, top:10, right: 10),
                height: 60,
                decoration: BoxDecoration(borderRadius: BorderRadius.all(Radius.circular(5.0),),color: Colors.white),
                child: TextField(
                  controller: controller,
                  //decoration: InputDecoration.collapsed(hintText: "账号/手机号"),
                  decoration: InputDecoration(hintText: "账号/手机号", counterText: "", border: InputBorder.none),
                  autocorrect: true,
                  //是否自动更正
                  autofocus: false,
                  maxLines: 1,
                  minLines: 1,
                  maxLength: 20,
                  textAlign: TextAlign.start,
                  style: TextStyle(color: Colors.black),
                  cursorColor: Colors.green,
                  onTap: (){
                  },
                  onChanged: (value){
                    //LogUtils.d("录入的值:${value}");
                    String content = controller.text;
                    if(content.length > 0){
                      hideSearch = false;
                    } else {
                      hideSearch = true;
                    }
                    hideSearchResult = true;
                    setState(() {
                    });
                  },
                  //onSubmitted: _handleSubmitted,
                  enabled: true, //是否禁用
                ),
              ),
          ),

          MaterialButton(
            color: Colors.blue,
            textColor: Colors.white,
            child: Text("取消"),
            onPressed: (){
              Navigator.pop(context);
            },
          ),
        ],
      ),
    );

  }

  //点击搜索按钮
  Widget _getSearchWidget(){
    return InkWell(
      
      onTap: (){
        _getUserLikeAccount(controller.text);
      },

      child: Offstage(
        offstage: hideSearch,
        child: Container(
          height: 70,
          width: double.infinity,
          padding: const EdgeInsets.only(left: 12.0, top: 10, right: 20,bottom: 10),//上下左右都设置边距
          child: Row(
              children: [
                Image.asset(CommonUtils.getBaseIconUrlPng("main_contacts_icon"), width: 50, height: 50,),
                SizedBox(width: 10,),
                Text("搜索:"),
                Expanded(child: Text("${controller.text}"))
              ],
          ),
        ),
      ),
    );
  }
}

class ChatContentView extends StatefulWidget {

  final UserBean userBean;

  ChatContentView({required this.userBean});

  @override
  State<ChatContentView> createState() => _ChatContentViewState();

}


class _ChatContentViewState extends State<ChatContentView> {

  String account = SpUtils.getString(CommonUtils.LOGIN_ACCOUNT);
  @override
  void initState() {
    super.initState();
  }

  void _clickDetails(String searchAcccount) async{
    ContactsBean? contactsBean = await ContactsRepository.getInstance().findContactByFromOrToAccount(account, searchAcccount);
    if(contactsBean != null && contactsBean.type == ContactsBean.typeReceive){
     //好友直接跳转到聊天页面
      Navigator.popUntil(context, (route) {return route.isFirst;});
      await Navigator.push(context, MaterialPageRoute(builder: (c) {return HomeChatPage(toChatId: searchAcccount);}));
    } else {
      Navigator.pop(context);
      Navigator.push(context,MaterialPageRoute(builder: (context)=>AddFriends(userBean: widget.userBean,)));
    }
  }

  @override
  Widget build(BuildContext context) {

    return InkWell(
      onTap: (){
        _clickDetails(widget.userBean.account??"");
      },
      child: Container(
        //decoration: BoxDecoration(color: Colors.white70),
        decoration: BoxDecoration(color: Colors.white70, border: Border(bottom:BorderSide(color: Color(0xffd9d9d9), width: 0.3))),
        //margin: EdgeInsets.only(top: 8.0, bottom: 8),
        padding: EdgeInsets.all(16.0),
        child: Row(
          children: <Widget>[
            Expanded(
              child: Stack(
                alignment: AlignmentDirectional.centerStart,
                children: [
                  Text("账号:${widget.userBean.account}   昵称:${widget.userBean.nickName}",style: TextStyle(fontSize: 18),),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/38808.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Java---Stream流详解

目录​​​​​​​ 一、Stream流详解 二、Stream流的获取 &#xff08;1&#xff09;单列集合 &#xff08;2&#xff09;双列集合 &#xff08;3&#xff09;数组 &#xff08;4&#xff09;一些零散数据 三、Stream流中常用的API方法 &#xff08;1&#xff09;中间…

含可再生能源的热电联供型微网经济运行优化_粒子群PSO算法_matlab程序

含可再生能源的热电联供型微网经济运行优化matlab程序 参考文献&#xff1a;含可再生能源的热电联供型微网经济运行优化 热电联供系统具有节能! 环保! 经济等特点" 有着良好的发展前景和应用价值# 文中针对由 风电机组! 光伏电池! 燃料电池! 余热锅炉! 燃气锅炉! 蓄电池以…

含电热联合系统的微电网运行优化附Matlab代码

✅作者简介&#xff1a;热爱科研的Matlab仿真开发者&#xff0c;修心和技术同步精进&#xff0c;matlab项目合作可私信。 &#x1f34e;个人主页&#xff1a;Matlab科研工作室 &#x1f34a;个人信条&#xff1a;格物致知。 更多Matlab仿真内容点击&#x1f447; 智能优化算法 …

SpringBoot+Vue项目投稿和稿件处理系统

文末获取源码 开发语言&#xff1a;Java 使用框架&#xff1a;spring boot 前端技术&#xff1a;JavaScript、Vue.js 、css3 开发工具&#xff1a;IDEA/MyEclipse/Eclipse、Visual Studio Code 数据库&#xff1a;MySQL 5.7/8.0 数据库管理工具&#xff1a;phpstudy/Navicat JD…

MYSQL中的锁

全局锁 就是对整个数据库进行加锁&#xff0c;加锁之后整个数据库就处于只读状态&#xff0c;后续的DML写语句&#xff0c;DDL语句&#xff0c;以及对更新事务的提交操作都会被阻塞&#xff0c;典型地使用场景就是做整个数据库的逻辑备份&#xff0c;对所有的表进行锁定&#x…

非凡社群管理之如何高效的进行社群管理

一、初始成员的严格筛选 我们建立社群初期&#xff0c;就要严格筛选初始会员&#xff0c;争取让我们找到的第一批种子用户&#xff0c;就是有着共同的连接点。而不是找到一群人之后&#xff0c;再去培养大家的同好。这样不仅吃力不讨好&#xff0c;往往效果也不太高&#xf…

Kafka系列之:实现Kafka Connect集群访问认证

Kafka系列之:实现Kafka Connect集群访问认证 一、Kafka Connect访问控制二、Kafka Connect技术知识三、详细介绍Kafka connect访问认证实现过程四、启动Kafka Connect集群五、测试Kafka Connect集群访问认证一、Kafka Connect访问控制 实现的效果如下所示: 错误的用户名和密…

nginx降权及匹配php

1.nginx降权 1.1 capabilities的介绍与运用 1.2 用普通用户启动nginx 1.3 root用户权限赋予 1.4 查看普通用户的nginx权限 1.5 查看nginx的欢迎网页 2.nginx与php的相互匹配 2.1 安装php及php-fpm包 2.2 检查php-fpm服务运行状态 2.3 php-fpm上的配置 2.4 nginx上的配…

基于matlab的精馏塔作业模拟仿真

欢迎订阅《FPGA学习入门100例教程》、《MATLAB学习入门100例教程》 目录 一、理论基础 二、核心程序 三、测试结果 一、理论基础 原料物性表如下&#xff1a; 表3-1原料物理性质表 组分 质量流率 质量分数 摩尔流率 摩尔分数 分子量 常压沸点 丙烷 472.938 7.567…

SpringBoot SpringBoot 原理篇 1 自动配置 1.9 bean 的加载方式【七】

SpringBoot 【黑马程序员SpringBoot2全套视频教程&#xff0c;springboot零基础到项目实战&#xff08;spring boot2完整版&#xff09;】 SpringBoot 原理篇 文章目录SpringBootSpringBoot 原理篇1 自动配置1.9 bean 的加载方式【七】1.9.1 ImportBeanDefinitionRegistrar1 …

mysql 到底是 join性能好,还是in一下更快呢

先总结&#xff1a; 数据量小的时候&#xff0c;用join更划算数据量大的时候&#xff0c;join的成本更高&#xff0c;但相对来说join的速度会更快数据量过大的时候&#xff0c;in的数据量过多&#xff0c;会有无法执行SQL的问题&#xff0c;待解决 事情是这样的&#xff0c;去…

浅谈Spring Cloud Gateway源码

本文不谈Spring Cloud Gateway相关的使用&#xff0c;仅梳理在微服务项目中&#xff0c;在使用Spring Cloud Gateway做为服务网关后&#xff0c;接收到请求后的大体执行流程。 文章目录大致流程图具体流程一、DispatcherHandler二、getHandler1、getHandlerInternal2、lookupRo…

【GlobalMapper精品教程】027:路径剖面和和视线工具的使用

文章目录 一、路径剖面简介二、创建剖面图1. 加载DEM2. 创建剖面图3. 计算填挖方3. 保存剖面图一、路径剖面简介 路径剖面视线工具允许您使用加载的高程数据集沿用户指定的路径获取垂直剖面。 要定义生成3D路径剖面所遵循的路径,只需单击鼠标左键选择路径的点,然后石键单击…

[acwing周赛复盘] 第 60 场周赛20220716

[acwing周赛复盘] 第 60 场周赛20220716 一、本周周赛总结二、 4722. 数列元素1. 题目描述2. 思路分析3. 代码实现三、4723. 队列1. 题目描述2. 思路分析3. 代码实现四、4724. 靓号1. 题目描述2. 思路分析3. 代码实现六、参考链接一、本周周赛总结 第一次打acwing&#xff0c;…

POJ1007:DNA排序

一、Description One measure of unsortedness in a sequence is the number of pairs of entries that are out of order with respect to each other. For instance, in the letter sequence DAABEC’‘, this measure is 5, since D is greater than four letters to its ri…

傻白入门芯片设计,典型的2D/2D+/2.5D/3D封装技术(六)

集成电路终于成为了一级学科&#xff0c;对集成电路领域的投入也日益加大&#xff0c;集成电路属于电子集成技术的一种&#xff0c;那么&#xff0c;现在的电子集成技术发展到了什么程度呢&#xff1f; 先进的电子集成技术可以在不到芝麻粒大小的1平方毫米内集成1亿只以上的晶体…

Tableau 合集3:格式设置之可视化图显示百分比和提示工具对齐问题

一、前言 本文通过可视化图中显示不了百分比和提示工具无法对齐两个小问题出发&#xff0c;介绍了关于Tableau设置格式和工具提示的一些使用方法。 环境&#xff1a;Windows11 64位、Tableau desktop 2021.2 二、问题1&#xff1a;可视化图中显示不了百分比 问题描述&#…

springboot整合其它项目(连接池和监控)

目录 一、整合Druid 1. Druid是什么&#xff1f; 2.如何在Spring Boot中集成Druid连接池和监控&#xff1f; 二、整合Redis 1.集成redis之非注解式开发 2.集成redis之注解缓存开发 一、整合Druid 1. Druid是什么&#xff1f; Druid是Java语言中最好的数据库连接池。…

paddleocr识别模型训练记录

准备数据集 自己新建目录 下载识别预训练模型 下载之后是一个压缩包&#xff0c;解压后&#xff08;注意&#xff1a;rec是自己新建的目录&#xff09; 修改配置文件 修改内容&#xff1a; 1.训练后模型存储目录&#xff1b; 2.是否训练可视化&#xff1b; 3.训练数据集图…

tensorflow2 minist手写数字识别数据训练

✨ 博客主页&#xff1a;小小马车夫的主页 ✨ 所属专栏&#xff1a;Tensorflow 文章目录前言一、tenosrflow minist手写数字识别代码二、输出三、参考资料总结前言 刚开始学习tensorflow&#xff0c; 首先接触的是minist手写数字识别&#xff0c;用的梯度下降算法&#xff0c;…