Если я вас правильно понял, то вам нужно что вроде такого:
import 'dart:async';
import 'package:flutter/material.dart';
import 'dart:convert';
import 'package:http/http.dart' as http;
const String url = 'https://jsonplaceholder.typicode.com/users';
void main() => runApp(
const MaterialApp(
home: HomePage(),
debugShowCheckedModeBanner: false,
),
);
class HomePage extends StatefulWidget {
const HomePage();
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
final List<UserDetails> _searchResult = <UserDetails>[];
final List<UserDetails> _userDetails = <UserDetails>[];
TextEditingController controller = TextEditingController();
// Get json result and convert it to model. Then add
Future<void> getUserDetails() async {
final response = await http.get(Uri.parse(url));
final responseJson = json.decode(response.body);
setState(() {
for (Map user in responseJson) {
_userDetails.add(UserDetails.fromJson(user));
}
});
}
@override
void initState() {
super.initState();
getUserDetails();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Home'),
),
body: Column(
children: <Widget>[
ColoredBox(
color: Theme.of(context).primaryColor,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Card(
child: ListTile(
leading: const Icon(Icons.search),
title: TextField(
controller: controller,
decoration: const InputDecoration(
hintText: 'Search',
border: InputBorder.none,
),
onChanged: onSearchTextChanged,
),
trailing: IconButton(
icon: const Icon(Icons.cancel),
onPressed: () {
controller.clear();
onSearchTextChanged('');
},
),
),
),
),
),
Expanded(
child: _searchResult.isNotEmpty || controller.text.isNotEmpty
? ListView.builder(
itemCount: _searchResult.length,
itemBuilder: (context, i) {
return Card(
child: ListTile(
leading: CircleAvatar(
backgroundImage: NetworkImage(
_searchResult[i].profileUrl,
),
),
title: Text(_searchResult[i].firstName +
' ' +
_searchResult[i].lastName),
),
margin: const EdgeInsets.all(0.0),
);
},
)
: ListView.builder(
itemCount: _userDetails.length,
itemBuilder: (context, index) {
return Card(
child: ListTile(
leading: CircleAvatar(
backgroundImage: NetworkImage(
_userDetails[index].profileUrl,
),
),
title: Text(_userDetails[index].firstName +
' ' +
_userDetails[index].lastName),
),
margin: const EdgeInsets.all(0.0),
);
},
),
),
],
),
);
}
void onSearchTextChanged(String text) async {
_searchResult.clear();
if (text.isEmpty) {
setState(() {});
return;
}
for (UserDetails userDetail in _userDetails) {
if (userDetail.firstName.contains(text) ||
userDetail.lastName.contains(text)) _searchResult.add(userDetail);
}
setState(() {});
}
}
class UserDetails {
final int id;
final String firstName, lastName, profileUrl;
UserDetails({
this.id,
this.firstName,
this.lastName,
this.profileUrl =
'https://i.amz.mshcdn.com/3NbrfEiECotKyhcUhgPJHbrL7zM=/950x534/filters:quality(90)/2014%2F06%2F02%2Fc0%2Fzuckheadsho.a33d0.jpg',
});
factory UserDetails.fromJson(Map<String, dynamic> json) {
return UserDetails(
id: json['id'],
firstName: json['name'],
lastName: json['username'],
);
}
}