flutter setState Delay in bottomSheet

Viewed 34

i made a code which opens bottomSheet. Inside the bottomSheet there are inputs that can be added and subtracted by pressing a button.

but the changes that occur are not in accordance with what I expected. changes are delayed not directly.

Widget buildBottomSheet(BuildContext context) => makeDismissible(
    child: DraggableScrollableSheet(
      initialChildSize: 0.6,
      minChildSize: 0.5,
      maxChildSize: 0.6,
      builder: (_, controller) => Container(
        decoration: const BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
        ),
        padding: const EdgeInsets.only(top: 10),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const Center(child: Icon(Icons.horizontal_rule)),
            ListTile(
              title: Container(
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    Row(
                      children: [
                        ClipRRect(
                          borderRadius:
                              const BorderRadius.all(Radius.circular(20)),
                          child: Image.network(
                            widget.productList.image,
                            width: 125,
                            height: 125,
                            fit: BoxFit.cover,
                          ),
                        ),
                        SizedBox(
                          height: 125,
                          child: Padding(
                            padding:
                                const EdgeInsets.symmetric(horizontal: 15),
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                if (widget.productList.discount == 0)
                                  Text(
                                    CurrencyFormat.convertToIdr(
                                        widget.productList.price, 0),
                                    style: const TextStyle(
                                        fontWeight: FontWeight.w600,
                                        fontSize: 18),
                                  ),
                                if (widget.productList.discount >= 1)
                                  Text(
                                    CurrencyFormat.convertToIdr(
                                        widget.productList.price -
                                            (widget.productList.discount /
                                                    100) *
                                                widget.productList.price,
                                        0),
                                    style: const TextStyle(
                                        fontWeight: FontWeight.w600,
                                        fontSize: 18),
                                  ),
                                if (widget.productList.discount >= 1)
                                  Row(
                                    children: [
                                      Text(
                                        "${widget.productList.discount}%  ",
                                        style: const TextStyle(
                                            color: Colors.red,
                                            fontWeight: FontWeight.w600),
                                      ),
                                      Text(
                                        CurrencyFormat.convertToIdr(
                                            widget.productList.price, 0),
                                        style: const TextStyle(
                                            color: Colors.black38,
                                            fontWeight: FontWeight.w600,
                                            decoration:
                                                TextDecoration.lineThrough),
                                      )
                                    ],
                                  ),
                                Text("Stock : ${widget.productList.stock}")
                              ],
                            ),
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ),
              // minLeadingWidth: 125,
              trailing: SizedBox(
                child: IconButton(
                    onPressed: () => Navigator.pop(context),
                    icon: const Icon(Icons.close)),
              ),
            ),
            const SizedBox(
              height: 10,
            ),
            const Divider(
              indent: 15,
              endIndent: 15,
              color: Colors.black,
            ),
            const SizedBox(
              height: 10,
            ),
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 15),
              child: Column(
                children: const [
                  Text(
                    "Pilihan Varian :",
                    style: TextStyle(fontWeight: FontWeight.w800),
                  ),
                ],
              ),
            ),
            const Spacer(),
            SizedBox(
              child: Padding(
                padding: const EdgeInsets.symmetric(
                    vertical: 15, horizontal: 10),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        ElevatedButton(
                          onPressed: _minCounter,
                          clipBehavior: Clip.antiAlias,
                          style: ElevatedButton.styleFrom(
                            shadowColor: Colors.white,
                            primary: Colors.black,
                            padding: const EdgeInsets.symmetric(
                                horizontal: 0, vertical: 0),
                          ),
                          child: const Icon(Icons.remove),
                        ),
                        Text('${widget.productList.minbuy + counter} '),
                        // const SizedBox(
                        //   width: 50,
                        //   height: 35,
                        //   child: TextField(
                        //     textAlign: TextAlign.center,
                        //     decoration: InputDecoration(
                        //       border: OutlineInputBorder(
                        //           borderSide:
                        //               BorderSide(color: Colors.black)),
                        //     ),
                        //   ),
                        // ),
                        ElevatedButton(
                          onPressed: _incrementCounter,
                          clipBehavior: Clip.antiAlias,
                          style: ElevatedButton.styleFrom(
                            shadowColor: Colors.white,
                            primary: Colors.black,
                            padding: const EdgeInsets.symmetric(
                                horizontal: 0, vertical: 0),
                          ),
                          child: const Icon(Icons.add),
                        ),
                      ],
                    ),
                    ElevatedButton.icon(
                      icon: const Icon(
                        Icons.add,
                        color: Colors.amber,
                        size: 14,
                      ),
                      label: const Text(
                        "Keranjang",
                        style: TextStyle(color: Colors.amber),
                      ),
                      clipBehavior: Clip.antiAlias,
                      onPressed: () {},
                      style: ElevatedButton.styleFrom(
                        side: const BorderSide(color: Colors.amber),
                        shadowColor: Colors.white,
                        primary: Colors.white,
                        padding: const EdgeInsets.symmetric(
                            horizontal: 15, vertical: 10),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    ),
  );

for full code : https://github.com/nazhoir/travel-app/blob/main/lib/views/shop/product_detail.dart

0 Answers
Related