CODEWITHSUNDEEP
flutterdartbottom-sheetprogress-indicator
Umair
Umair

Reputation: 1877

How to show circularprogressindicator along with bottomsheet in flutter?

i am using bottomsheet in my code and due to that it is not showing my circularprogressindicator when isLoading is true but else part of ternary operator is working perfectly. Is there anyother way to do that. Or where i am doing wrong in the code?

  (isLoading==true) ? Center(
    child: Container(
      height: 24,
      width: 24,
      child: CircularProgressIndicator(
        backgroundColor: CommonColors.primaryColor,
        strokeWidth: 1,
      ),
    ),
  )
      :
  Column(
    children: <Widget>[
      Expanded(
        child: ListView.separated(
          itemCount: clist.cartlist.length,
          itemBuilder: (BuildContext context, int index) {
            return _buildCartProduct(index);
          },
          separatorBuilder: (context, index) {
            return Divider(
              color: Colors.grey[300],
            );
          },
        ),
      ),
      SizedBox(
        height: 80,
      )
    ],
  ),
  bottomSheet: isLoading?Container():Container(
    height: 80.0,
    color: CommonColors.secondaryBackgroundColor,
    child: Column(crossAxisAlignment: CrossAxisAlignment.end,
      children: <Widget>[
        Container(margin: EdgeInsets.symmetric(horizontal: 16),child:
        Text('Total: \$${clist.getSubTotal()}',
          style: TextStyle(fontWeight: FontWeight.bold,fontSize: 16),)),
        Expanded(
          child: FlatButton(onPressed: (){},
            color: CommonColors.primaryColor,
            child: Row(mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text(
                  'PLACE',
                  style: TextStyle(
                    color: CommonColors.secondaryBackgroundColor,
                    fontSize: 20.0,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ],
            ),
          ),
        ),
      ],
    ),
  ),

Upvotes: 2

Views: 2559

Answers (2)

codrikaz
codrikaz

Reputation: 255

simple put it the code!

static void customBotFtomSheet(BuildContext context) async {
    showModalBottomSheet<void>(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(top: Radius.circular(15.0)),
      ),
      backgroundColor: BrandColors.kWhite,
      elevation: 0,
      context: context,
      // showDragHandle: true,

      isScrollControlled: true,
      isDismissible: true,
      builder: (BuildContext context) {
        return Container(
          height: 100,
          width: MediaQuery.sizeOf(context).width,
            child: CircularProgressIndicator(),
        );
      },
    );
 }

Upvotes: 0

Bassem Abd Allah
Bassem Abd Allah

Reputation: 286

in this part you're showing an empty container if loading

bottomSheet: isLoading?Container():Container(

so change it to be your CircularProgressIndicator

bottomSheet: isLoading ? CircularProgressIndicator():Container(

Upvotes: 0

Related Questions