列表到 class 在 flutter 中的可点击 ListView.builder 之后显示它

Question

I created these classes and this list to make it clickable in flutter with a ListView.builder. When I click on a name I take me to the clan page. How do I show the list of members in the clan class and make it tapable to the "Member profile page"? or is there a different way to do it?

These are the classes

class Clan{
  String name;int member;DateTime born;
  List<MemberClan> listMemberClan;
  List<Videogame> listVieogame;
  Clan ({this.born,this.member,this.name, this.listMemberClan, this.listVieogame});
}

class MemberClan{
  String memberClanName, email; int age;
  List<Videogame> memberVideogamelist;
  MemberClan({this.age,this.email,this.memberClanName, this.memberVideogamelist});
}

class Videogame{
  String videogameName, softwarehouse, type;
  Videogame({this.softwarehouse,this.videogameName,this.type});
}

List<Clan> clanList =[
  Clan(
    name: "Wof",
    member: 2,
    listMemberClan: [
      MemberClan(
        memberClanName: "redwolf",
        email: "redwolf@email.com",
        memberVideogamelist: [
          Videogame(
            videogameName: "fifa20",
            softwarehouse: "Ea",
            type: "sport"
          ),
        ]
      ),
      MemberClan(
        memberClanName: "shaps",
        email: "shaps@email.com",
        memberVideogamelist: [
          Videogame(
            videogameName: "fifa21",
            softwarehouse: "Ea",
            type: "sport"
          ),
          Videogame(
            videogameName: "callofduty MW",
            softwarehouse: "Activision",
            type: "fps"
          ),
        ]
      ),
    ],
  ),
  Clan(
    name: "Ika",
    member: 1,
     listMemberClan: [
      MemberClan(
        memberClanName: "stinfo",
        email: "stinfo@email.com",
        memberVideogamelist: [
          Videogame(
            videogameName: "Call Of Duty: MW",
            softwarehouse: "Activision",
            type: "fps"
          ),
        ]
      ),
    ],
    
  ),
];

these are the the simply widget for the list and the clanpage are just a simply example there isn't UI

class ClanList extends StatelessWidget {
  final Clan clan;
  final MemberClan memberClan;
  final Videogame videogame;

  const ClanList({Key key, this.clan, this.memberClan, this.videogame})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Expanded(
          child: ListView.builder(
            itemCount: clanList.length,
            itemBuilder: (context, index) => InkWell(onTap: (){Navigator.push(context, MaterialPageRoute(builder: (context)=> ClanPage(clan: clanList[index],)));},
                          child: ListTile(
                title: Text(clanList[index].name),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

class ClanPage extends StatelessWidget {
  final Clan clan;
  final MemberClan memberClan;
  final Videogame videogame;

  const ClanPage({Key key, this.clan, this.memberClan, this.videogame})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Column(
          children: [
            Text(clan.name),
            Text(clan.member.toString()),
            //here i want show a clickable list of the member
            //and tap or clik on name I want show the member profilepage
          ],
        ),
      ),
    );
  }
}

Answer 1

In your clan class add the following code:-

 class ClanPage extends StatelessWidget { final Clan clan; final MemberClan memberClan; final Videogame videogame; const ClanPage({Key key, this.clan, this.memberClan, this.videogame}): super(key: key); @override Widget build(BuildContext context) { return Scaffold( body: SafeArea( child: Expanded( child: ListView.builder( itemCount: clan.listMemberClan.length, itemBuilder: (context, index) => ListTile( onTap: (){Navigator.push(context, MaterialPageRoute(builder: (context)=> MemberPage(memberClan: clan.listMemberClan[index],)));}, title: Text(clan.listMemberClan[index]), ), ), ), ), ); } } class MemberPage extends StatelessWidget { final MemberClan memberClan; const ClanPage({this.memberClan}); @override Widget build(BuildContext context) { return Scaffold( body: SafeArea( //show your details here like:- child:Text(memberClan.email), ) ); } }