时间戳

首页 > 解决方案 > Dart，Flutter List onTap 以获取磁带项目的索引

list - Dart，Flutter List onTap 以获取磁带项目的索引

问题描述

我创建了一个搜索委托类，我想要的东西在逻辑上听起来很简单，但我无法绕开它，因为我是新编程我想获取文本，或者我应该说 listTile 中的文本字符串我点击，然后通过该文本到搜索委托的 showResult 并在文本小部件中查看...这是我的代码

import 'package:flutter/material.dart';
import 'package:schooler/style/const.dart';
//follow steps 1 - 3
class DataSearch extends SearchDelegate<String> {
  final List<String> languages = [//3.here is my list
    'dart',
    'Csharp',
    'Java',
    'JavaScript',
    'C++',
    'go ',
    'python',
    'php'
  ];

  final List<String> recentSearch = [
    'go ',
    'python',
    'php',
  ];
  @override
  List<Widget> buildActions(BuildContext context) {
    return [
      IconButton(
        icon: Icon(Icons.clear),
        onPressed: () {
          query = '';
        },
      )
    ];
  }

  @override
  Widget buildLeading(BuildContext context) {
    return IconButton(
      icon: AnimatedIcon(
        icon: AnimatedIcons.menu_arrow,
        progress: transitionAnimation,
      ),
      onPressed: () {
        close(context, null);
      },
    );
  }

  @override
  Widget buildResults(BuildContext context) {
    return Scaffold(
      body: ListView(
        physics: BouncingScrollPhysics(),
        children: <Widget>[
          Row(
            children: <Widget>[
              CircleAvatar(),
              Text(languages[0].substring(query.length)),//2.i want to return the gotten index here
            ],
          ),
        ],
      ),
    );
  }

  @override
  Widget buildSuggestions(BuildContext context) {
    final suggestionList = query.isEmpty
        ? recentSearch
        : languages.where((element) => element.startsWith(query)).toList();
    return ListView.builder(
      physics: BouncingScrollPhysics(),
      itemBuilder: (context, index) => ListTile(
        onTap: () {
          showResults(context); //1.when i tap the item on the listTile i want it to get the index of the taped item
        },
        leading: query.isEmpty
            ? Icon(
                Icons.history,
              )
            : Icon(Icons.search),
        title: RichText(
          text: TextSpan(
            text: suggestionList[index].substring(
              0,
              query.length,
            ),
            style: TextStyle(
              color: kBlackColor,
              fontWeight: kBold,
            ),
            children: [
              TextSpan(
                text: suggestionList[index].substring(query.length),
                style: TextStyle(color: kGreyColor),
              ),
            ],
          ),
        ),
      ),
      itemCount: suggestionList.length,
    );
  }
}

在这里，如果我点击“开始”，它应该获取文本并将其传递给 showResult

这是我的显示结果..但我只是硬编码了我的“列表[0]索引”我想我想说的是从我录制的项目中获取文本并在此处显示

标签： listflutterdartindexing

解决方案

首先让我们在 ListView 中修复 itemBuilder，以便它索引每个元素，然后将该索引添加到 showResults() 函数调用中，以便您可以访问它：

ListView.builder(
      physics: BouncingScrollPhysics(),
      itemBuilder: (context, index) => ListTile( // Add index here to pass the index to the builder.
        onTap: () {
          showResults(context, index); // Add the index to function call
        },

只要确保你的 showResults() 函数被修改为接受一个 int 索引参数，虽然我没有看到那个函数，但我假设它在某个需要修改以接受索引的时候调用 buildResults() ：

@override
  Widget buildResults(BuildContext context, int index) {
    return Scaffold(
      body: ListView(
        physics: BouncingScrollPhysics(),
        children: <Widget>[
          Row(
            children: <Widget>[
              CircleAvatar(),
              Text(languages[index].substring(query.length)),// Use the index here to return the desired text
            ],
          ),
        ],
      ),
    );
  }

推荐阅读