pmlo pmlo
pmlo pmlo

Reputation: 56

how to build search bar in flutter?

i m a beginner in flutter and i need help. The goal is to have a search bar in order to find users with their name. i call users with provider and their data with the AppUserData model class

here is my code

import 'package:flutter/material.dart';
import 'package:models/user.dart';
import 'package:provider/provider.dart';

class UserList extends StatefulWidget {
  @override
  FilterLocalListPageState createState() => FilterLocalListPageState();
}

class FilterLocalListPageState extends State<UserList> {


  @override
  Widget build(BuildContext context) {
    final users = Provider.of<List<AppUserData>>(context);

    return Scaffold(
      appBar: AppBar(
        title: Text("users"),
        centerTitle: true,
      ),
      body: Column(
        children: <Widget>[
          Expanded(
            child: ListView.builder(
              itemCount: users.length,
              itemBuilder: (context, index) {
                return buildBook(users[index]);
              },
            ),
          ),
        ],
      ),
    );
  }

  Widget buildBook(AppUserData user) => ListTile(
        leading: Image.network(
          user.profilepic,
          fit: BoxFit.cover,
          width: 50,
          height: 50,
        ),
        title: Text(user.name),
      );
}

Thank for your help

Upvotes: 0

Views: 905

Answers (1)

Adnan Alshami
Adnan Alshami

Reputation: 1059

You can use SearchDelegate, check out this tutorial.

it's a little bit boring, but it gets the job done.

Upvotes: 1

Related Questions