how to simplify dinamically this PopupMenuButton arrangement in Flutter?

Question

I'm creating a PopupMenuButton in the AppBar() widget. Retrieving the elements in the List, dinamically,to make a PopupMenuButton.

      final List<String> entries = <String>['Choose a category','Verbs','Nouns','Adjectives','Adverbs','Determiners','Prepositions','Pronouns','Conjunctions','Expressions','Sentences' ];


 PopupMenuButton(
              itemBuilder: (context) => [
                PopupMenuItem(
                  value: 1,
                  child: Text(entries[1]),
                ),
                PopupMenuItem(
                  value: 2,
                  child: Text(entries[2]),
                ),
                PopupMenuItem(
                  value: 3,
                  child: Text(entries[3]),
                ),
                PopupMenuItem(
                  value: 4,
                  child: Text(entries[4]),
                ),
                PopupMenuItem(
                  value: 5,
                  child: Text(entries[5]),
                ),
                PopupMenuItem(
                  value: 6,
                  child: Text(entries[6]),
                ),
                PopupMenuItem(
                  value: 7,
                  child: Text(entries[7]),
                ),
                PopupMenuItem(
                  value: 8,
                  child: Text(entries[8]),
                ),
                PopupMenuItem(
                  value: 9,
                  child: Text(entries[9]),
                ),
                PopupMenuItem(
                  value: 10,
                  child: Text(entries[10]),
                ),
              ],
              onSelected: (value) {
                if (value > 0) {
                  Navigator.pushNamed(
                    context,
                    "/home",
                    arguments: {
                      'wordType': entries[value],
                      'page': "no_home",
                    },
                  );
                }
              },
            ),

I'm expecting something like this.

PopupMenuButton(
          itemBuilder: (context, index) => [
            PopupMenuItem(
              value: index,
              child: Text(entries[index]),
            ),
       onSelected: (value) {
            if (value > 0) {
              Navigator.pushNamed(
                context,
                "/home",
                arguments: {
                  'wordType': entries[value],
                  'page': "no_home",
                },
                                           ],
             ),

I have seen some solutions where an external method, even a class is needed to be created. Is there a built- in solution to do so?

thank you.

I tried looping ´PopupMenuItem(´ using for , but it shows red signs of error inside the ´PopupMenuButton(´ widget. — Jean, Nov 01 '22 at 15:39

score 1 · Accepted Answer · answered Nov 01 '22 at 15:43

1

You can do something like this

 PopupMenuButton(
  itemBuilder: (context) => List.generate(
    entries.length,
    (index) => PopupMenuItem(
      value: index,
      child: Text(
        entries[index],
      ),
    ),
  ),
),

answered Nov 01 '22 at 15:43

Md. Yeasin Sheikh

54,221
7
29
56

1

you can separate the method to feed on `itemBuilder: itemBuilder,` and `List itemBuilder(BuildContext context) => List.generate(...` – Md. Yeasin Sheikh Nov 01 '22 at 15:47
Looks awesome. In the arrangement the List starts with entries[1]. your arrangement, its awesome and works, but it shows the menu starting from entries[0]. So it shows 'Choose a category' in the list menu, I tried to use ternary operator (index) =>index == 0 ? Visibility( visible:false) : PopupMenuItem(...); but it doesnt allows a widget in the arrangement, – Jean Nov 01 '22 at 15:54
I will prefer removing that string, and use nullable value to store. Also you can use for loop, `return [ for (int index = 1; index < entries.length; index++)PopupMenuItem(..)];` – Md. Yeasin Sheikh Nov 01 '22 at 16:14
1

thank you. I ended up removing the first item from the List and it works like a charm now. `final List entries2 = List.from(entries..removeAt(0));` I accept your answer. – Jean Nov 01 '22 at 19:47

how to simplify dinamically this PopupMenuButton arrangement in Flutter?

1 Answers1