首页 > 解决方案 > 通过搜索列表访问详细信息页面

问题描述

我有一个列表和一个详细信息页面,每个页面都有我使用 onGenerateRoute 创建的路线。

我的数据源是列表列表。

final MyDataList=<List>[

  //[0][0]  _teamName
  //[0][1]   _info
  //[0][2]  _info2

  ["team1 name","team_1  first info","team_1 second info"],
  ["team2 name","info..","info2.."],
  ["abc team","abc's info","info2"],
  ["xyz ","info","info2"],
  ["klmn","infoklmn","info2klmn"],

];

我想在 MyDataList 中搜索 teamName。这里而不是aSingleList.where((p). MyDataList 是列表列表,我找不到如何执行此操作。(这是我要搜索的地方==> MyDataList[i][0] i==>team names)

    @override
  Widget buildResults(BuildContext context) {}
  
List<String> aSingleList=["a","single","list","."];  //example: a normal list

  @override
  Widget buildSuggestions(BuildContext context) {
    final suggestionList = query.isEmpty
        ? [" "]
        : aSingleList.where((p) => p.toLowerCase().contains(query.toLowerCase()))
            .toList();
    //There is no problem with such a list.
    //But here is where I want to search==> MyDataList[i][0] 

    return ListView.builder(
      itemBuilder: (context, index) => ListTile(
        //onTap: (){},  How can I go to the detail page of the found team name?

        title: Text(suggestionList[index]),
      ),
      itemCount: suggestionList.length,
    );
  }

detail_page.dart

import 'package:flutter/material.dart';
import 'package:teams/main.dart';
import 'package:teams/team_model.dart';


class DetailPage extends StatelessWidget {
  int incomingIndex;
  TeamModel chosenTeam;

  DetailPage(this.incomingIndex);


  @override
  Widget build(BuildContext context) {

    chosenTeam = TeamList.allTeams[incomingIndex];

    return DefaultTabController(
      length: 2,
      child: Scaffold(
          appBar: AppBar(
            title: Text(chosenTeam.teamName),
            bottom: TabBar(tabs: [
              Tab(text: "tab1",),
              Tab(text: "tab2",),

            ]),
          ),
          body: TabBarView(
            children: [
              SingleChildScrollView( child: Center(child: Text(chosenTeam.info,style: TextStyle(fontSize: 33),))),
              SingleChildScrollView(child: Center(child: Text(chosenTeam.info2,style: TextStyle(fontSize: 33),))),

            ],
          )),
    );
  }

}

team_model.dart

class TeamModel{   //model

  String _teamName;
  String _info;
  String _info2;

  TeamModel(this._teamName,this._info,this._info2);


  String get teamName => _teamName;

  set teamName(String value) {_teamName = value;}

  String get info => _info;

  set info(String value) {_info = value;}

  String get info2 => _info2;

  set info2(String value) {_info2 = value;}
}

标签: flutterdartflutter-layout

解决方案


使用 map 函数仅生成名称列表;然后获取您正在搜索的团队的索引:

List searchTeam(String teamName){
    //retrieve from each sublist the first element (which is the name)
    int teamIndex = listOfLists.map((sublist) => sublist[0])
        //get the index of the team
        .toList().indexOf(teamName);
    return listOfLists[teamIndex];
}

请注意:我没有对您的列表结构进行任何检查,因为我假设不存在空子列表。注意那个特别的事情。另外我假设总是搜索团队:您应该检查 teamIndex 的值,看看它是否<0。在这种情况下,搜索失败,因此您必须决定是要抛出异常还是采用替代方法,例如返回空列表


推荐阅读