построитель gridview со случайной шириной его элементов в флаттере

Question

Мне нужно показать что-то вроде этого

Может ли кто-нибудь помочь в этом? Я могу достичь следующих результатов:

Я использую следующий код:

GridView.builder(

          scrollDirection: Axis.vertical,
          physics: ScrollPhysics(),
          shrinkWrap: true,
          itemCount: 6,
          gridDelegate:
              SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2,
                childAspectRatio: MediaQuery.of(context).size.width /
                  (MediaQuery.of(context).size.height / 4),),
          itemBuilder: (BuildContext context, int index) {

            return GestureDetector(
              child: Container(

                padding: EdgeInsets.all(0.0),
                margin: EdgeInsets.only(
                    left: 10.0, right: 10.0, top: 10.0, bottom: 10.0),
                decoration: BoxDecoration(
                  border: Border.all(color: Color(0xFF282f61),width: 2.0),
                  borderRadius: BorderRadius.all(Radius.circular(
                      14.0) //                 <--- border radius here
                  ),
                ),
                child:    Center(
                  child: Text(
                      'Avg-project',
                      style: TextStyle(
                        color: Color(0xFF17b01b),
                        fontSize: 14.0,
                      ),
                  ),
                ),
              ),
              onTap: () {},
            );
          },
        ))

Как мне получить gridview со случайной шириной в флаттере?