Sam Scolari
Sam Scolari

Reputation: 5

SizedBox.shrink() or Container() not returning empty Widget?

I am using List.generate() to create a list of emojis for each category from a JSON object. I have a search bar that is used to narrow down the search results. If one of the emoji keywords contains the characters in the search bar it should only display that emoji.

The problem is SizedBox.shrink() is not empty like I want it to be. Isn't SizedBox.shrink() the recommended way to return an empty widget?

Thanks!

enter image description here enter image description here

          Padding(
            padding: EdgeInsets.only(left: 16, right: 16, top: 8),
            child: ClipRRect(
              borderRadius: BorderRadius.circular(20.0),
              child: Container(
                padding: EdgeInsets.only(left: 12, right: 12),
                color: Colors.grey[200],
                child: TextField(
                  onChanged: (change) {
                    setState(() {
                      searchTarget = change;
                    });
                  },
                  controller: searchController,
                  cursorColor: Colors.black,
                  decoration: InputDecoration(
                      border: InputBorder.none,
                      hintText: "Search for Icon..."),
                ),
              ),
            ),
          ),
          Expanded(
            child: Container(
              padding: EdgeInsets.only(
                top: 16,
                left: 16,
              ),
              child: ListView.builder(
                scrollDirection: Axis.vertical,
                itemCount: this.jsonData.keys.length,
                itemBuilder: (context, index) {
                  return Column(
                    children: [
                      Padding(
                        padding: EdgeInsets.only(
                            bottom: 16, top: (index == 0) ? 0 : 16),
                        child: Align(
                          alignment: Alignment.centerLeft,
                          child: Text(
                            this.jsonData.keys.toList()[index],
                            style: TextStyle(
                                fontSize: 20, fontWeight: FontWeight.bold),
                          ),
                        ),
                      ),
                      GridView.count(
                        shrinkWrap: true,
                        physics: NeverScrollableScrollPhysics(),
                        crossAxisCount: 8,
                        children: List.generate(
                          this.jsonData[this.jsonData.keys.toList()[index]].length, (jndex) {

                          var emoji = this.jsonData[this.jsonData.keys.toList()[index]][jndex];

                          if (this.searchTarget.length > 0 || this.searchTarget != " "){
                            for (int i = 0; i < emoji['keywords'].length; i++){
                              if (emoji['keywords'][i].contains(this.searchTarget)){
                                return Text(
                                emoji['emoji'],
                                style: TextStyle(fontSize: 25),
                                );
                              }
                            }
                          }

                          return SizedBox.shrink();
                        }),
                      ),
                    ],
                  );
                },
              ),
            ),
          ),

Upvotes: 1

Views: 5697

Answers (1)

Sam Scolari
Sam Scolari

Reputation: 5

I solved it. Instead of building the grid view directly I created a method that generated the list itself.

Upvotes: 3

Related Questions