Tengo un problema en mi ListView, quiero que al momento de Buscar el Ítem en mi lista pueda seleccionarlo y abrir una nueva ventana con información adentro. También quisiera dividir mi List cantoslistOnSearch = []; y List cantoslist = []; a un nuevo archivo .dart para no tener exceso de código, ya que estaré llenando cada ítem de mi lista con información. Para escoger el Ítem que quiero vi que se podía usar GestureDetector pero no se como añadirlo a mi código, si podrían ayudarme con eso. De antemano gracias!.
import 'package:flutter/material.dart';
class corariog extends StatefulWidget {
const corariog({Key? key}) : super(key: key);
@override
_corariogState createState() => _corariogState();
}
class _corariogState extends State<corariog> {
TextEditingController? _textEditingController = TextEditingController();
List<String> cantoslistOnSearch = [];
List<String> cantoslist = [
'Mexico',
'USA',
'Colombia',
'Venezuela',
'Peru',
'Rusia',
'China',
'Japon',
'Paris',
'España',
'Puerto Rico',
'Honduras',
'Taiwan',
];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Container(
decoration: BoxDecoration(
color: Colors.blue.shade200,
borderRadius: BorderRadius.circular(30)),
child: TextField(
onChanged: (value) {
setState(() {
cantoslistOnSearch = cantoslist
.where((element) =>
element.toLowerCase().contains(value.toLowerCase()))
.toList();
});
},
controller: _textEditingController,
decoration: InputDecoration(
border: InputBorder.none,
errorBorder: InputBorder.none,
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
contentPadding: EdgeInsets.all(15),
hintText: 'Search'),
),
),
actions: [
TextButton(
onPressed: () {
cantoslistOnSearch.clear();
_textEditingController!.clear();
setState(() {
_textEditingController!.text = '';
});
},
child: Icon(Icons.close, color: Colors.red),
)
],
),
body: _textEditingController!.text.isNotEmpty &&
cantoslistOnSearch.isEmpty
? Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.search_off,
size: 100,
color: Colors.blue,
),
Text('No results found',
style:
TextStyle(fontSize: 35, fontWeight: FontWeight.bold)),
],
),
)
: ListView.builder(
itemCount: _textEditingController!.text.isNotEmpty
? cantoslistOnSearch.length
: cantoslist.length,
itemBuilder: (context, index) {
return Padding(
padding: const EdgeInsets.all(4.0),
child: Row(
children: [
CircleAvatar(
child: Icon(Icons.book),
),
SizedBox(
width: 10,
),
Text(
_textEditingController!.text.isNotEmpty
? cantoslistOnSearch[index]
: cantoslist[index],
style: TextStyle(
fontSize: 20, fontWeight: FontWeight.bold),
),
],
),
);
}),
);
}
}
ListTile
y usar el onTap? o en su caso también puedes usar unRaisedButton
ya que te da la misma funcionalidad que buscas con unGestureDetector