0

I'm trying to implement checkbox for my project, which is invisible unless tapped on remove like in a game where ontap select the unwanted items and remove them when tapped on remove/delete. If there is a limit on deleting items that will be very much helpful...

Thank you.

class Inventory extends StatefulWidget {
  @override
  _InventoryState createState() => _InventoryState();
}

class _InventoryState extends State<Inventory> {
  Color _color = Colors.white;

  @override
  Widget build(BuildContext context) {
    double width = MediaQuery.of(context).size.width;
    double height = MediaQuery.of(context).size.height;
    return Scaffold(
        resizeToAvoidBottomInset: false,
        appBar: PreferredSize(
          preferredSize: Size.fromHeight(60),
          child: AppBar(
              backgroundColor: Theme.Colors.darkBlue,
              //iconTheme: IconThemeData(size: 10, color: Colors.white),
              elevation: 0,
              title: Row(
                mainAxisAlignment: MainAxisAlignment.end,
                children: <Widget>[
                  AutoSizeText(
                    "Inventory ",
                    style: TextStyle(
                      fontSize: 35,
                    ),
                  ),
                ],
              )),
        ),
        drawer: MainDrawer(),
        backgroundColor: Color(0xFF09182C),
        body: Center(
          child: Column(
            children: <Widget>[
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
                  Container(
                    height: height*0.07,
                    width: width * 0.76,
                    child: TextField(
                      decoration: InputDecoration(
                          contentPadding: EdgeInsets.all(10.0),
                          enabledBorder: UnderlineInputBorder(
                            borderSide: BorderSide(color: Colors.white),
                          ),
                          hintText: 'Search Inventory',
                          hintStyle:
                              TextStyle(color: Color(0xFFE0E0E0), fontSize: 20),
                          suffixIcon: Icon(
                            Icons.search,
                            color: Colors.white,
                            size: 30,
                          )),
                      style: TextStyle(color: _color),
                    ),
                  ),
                  Container(
                    padding: EdgeInsets.only(bottom: 30),
                    child: IconButton(
                      onPressed: () {},
                      icon: Icon(Icons.filter_list,
                          size: 40, color: Color(0xFFFFAE40)),
                    ),
                  ),
                ],
              ),
              SizedBox(height: height * 0.02),
              LoadingPage(),
              Spacer(),
              Container(
                margin: EdgeInsets.only(bottom: 70),
                padding: EdgeInsets.only(left: 30, right: 30),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Material(
                      type: MaterialType.transparency,
                      child: Ink(
                        decoration: BoxDecoration(
                          border:
                              Border.all(color: Color(0xFF57D0F4), width: 2.0),
                          color: Colors.transparent,
                          shape: BoxShape.circle,
                        ),
                        child: InkWell(
                          onTap: () {
                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => AddProduct()),
                            );
                          },
                          child: Padding(
                            padding: EdgeInsets.all(13.0),
                            child: Icon(
                              Icons.add,
                              size: 55.0,
                              color: Color(0xFF57D0F4),
                            ),
                          ),
                        ),
                      ),
                    ),
                    Material(
                      type: MaterialType.transparency,
                      child: Ink(
                        decoration: BoxDecoration(
                          border:
                              Border.all(color: Color(0xFF57D0F4), width: 2.0),
                          color: Colors.transparent,
                          shape: BoxShape.circle,
                        ),
                        child: InkWell(
                          onTap: () {
                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => RemoveProduct()),
                            );
                          },
                          child: Padding(
                            padding: EdgeInsets.all(13.0),
                            child: Icon(
                              Icons.delete_outline,
                              size: 55.0,
                              color: Color(0xFF57D0F4),
                            ),
                          ),
                        ),
                      ),
                    ),
                    Material(
                      type: MaterialType.transparency,
                      child: Ink(
                        decoration: BoxDecoration(
                          border:
                              Border.all(color: Color(0xFF57D0F4), width: 2.0),
                          color: Colors.transparent,
                          shape: BoxShape.circle,
                        ),
                        child: InkWell(
                          onTap: () {
                            Navigator.push(
                              context,
                              MaterialPageRoute(builder: (context) => Notify()),
                            );
                          },
                          child: Padding(
                            padding: EdgeInsets.all(13.0),
                            child: Icon(
                              Icons.notifications_none,
                              size: 55.0,
                              color: Color(0xFF57D0F4),
                            ),
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              )
            ],
          ),
        ));
  }
}

class LoadingPage extends StatefulWidget {
  @override
  _LoadingPageState createState() => _LoadingPageState();
}

class _LoadingPageState extends State<LoadingPage> {
  List prd;
  ScrollController _scrollController = ScrollController();
  int _currentMax = 10;

  @override
  void initState() {
    super.initState();
    prd = List.generate(10, (i) => "Product ${i + 1}");
    _scrollController.addListener(() {
      if (_scrollController.position.pixels ==
          _scrollController.position.maxScrollExtent) {
        _getMoreData();
      }
    });
  }

  _getMoreData() {
    for (int i = _currentMax; i < _currentMax + 10; i++) {
      prd.add("Product ${i + 1}");
    }

    _currentMax = _currentMax + 10;

    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.only(top: 10.0, bottom: 10.0),
      height: 450,
      width: 350,
      decoration: BoxDecoration(
          color: Color(0xFF707070),
          borderRadius: BorderRadius.all(
            Radius.circular(
              10.0,
            ),
          )),
      child: Flexible(
        child: ListView.builder(
            controller: _scrollController,
            itemCount: prd.length + 1,
            itemExtent: 42.5,
            itemBuilder: (context, i) {
              if (i == prd.length) {
                return CupertinoActivityIndicator();
              }
              return ListTile(
                title: AutoSizeText(prd[i]),
              );
            }),
      ),
    );
  }
}

I'm sorry if the coding is very bad...

  • So what is the *exact* problem you are having? Where are you stuck? Can you post what you did so far? – nvoigt Sep 08 '20 at 08:54
  • @nvoigt I have a product page which contains say Product 1-100 and a remove icon below that, I don't know exactly how to implement the above question. If u want i can add the those two code... –  Sep 08 '20 at 09:20
  • 1
    So what exactly is it that you don't know how to do? Can you bind a checkbox's visibility to a boolean variable of your state? Can you set this boolean variable using a button? Where is it that you are stuck? – nvoigt Sep 08 '20 at 09:22
  • 1
    Add the code so that we can help – Madhavam Shahi Sep 08 '20 at 09:22
  • I need both binding and setting boolean @nvoigt. –  Sep 08 '20 at 09:28
  • Do you know anything about stateful widgets? Can you create a button that sets a number that you display? – nvoigt Sep 08 '20 at 09:45
  • Ya using a bool and setState _tap = true... –  Sep 08 '20 at 09:56
  • I will work on it, if I don't get I will ask again... Thanks for your time :) –  Sep 08 '20 at 13:19

0 Answers0