0

I found a checkboxlist tile code example on the internet and I didn't quite understand the code, I'm very new to flutter. Why is there no main function in the code and 3. why is the imported library giving an error? I think I need to create a new dart file, but I don't know what the name of this file will be and what information will be contained in it.

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_listtile_demo/model/listtilemodel.dart';

class CheckBoxListTileDemo extends StatefulWidget {
  @override
  CheckBoxListTileDemoState createState() => new CheckBoxListTileDemoState();
}

class CheckBoxListTileDemoState extends State<CheckBoxListTileDemo> {
  List<CheckBoxListTileModel> checkBoxListTileModel =
      CheckBoxListTileModel.getUsers();

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        backgroundColor: Colors.white,
        centerTitle: true,
        title: new Text(
          'CheckBox ListTile Demo',
          style: TextStyle(color: Colors.black),
        ),
      ),
      body: new ListView.builder(
          itemCount: checkBoxListTileModel.length,
          itemBuilder: (BuildContext context, int index) {
            return new Card(
              child: new Container(
                padding: new EdgeInsets.all(10.0),
                child: Column(
                  children: <Widget>[
                    new CheckboxListTile(
                        activeColor: Colors.pink[300],
                        dense: true,
                        //font change
                        title: new Text(
                          checkBoxListTileModel[index].title,
                          style: TextStyle(
                              fontSize: 14,
                              fontWeight: FontWeight.w600,
                              letterSpacing: 0.5),
                        ),
                        value: checkBoxListTileModel[index].isCheck,
                        secondary: Container(
                          height: 50,
                          width: 50,
                          child: Image.asset(
                            checkBoxListTileModel[index].img,
                            fit: BoxFit.cover,
                          ),
                        ),
                        onChanged: (bool val) {
                          itemChange(val, index);
                        })
                  ],
                ),
              ),
            );
          }),
    );
  }

  void itemChange(bool val, int index) {
    setState(() {
      checkBoxListTileModel[index].isCheck = val;
   });
  }
}
class CheckBoxListTileModel {
  int userId;
  String img;
  String title;
  bool isCheck;

  CheckBoxListTileModel({this.userId, this.img, this.title, this.isCheck});

  static List<CheckBoxListTileModel> getUsers() {
    return <CheckBoxListTileModel>[
      CheckBoxListTileModel(
          userId: 1,
          img: 'assets/images/android_img.png',
          title: "Android",
          isCheck: true),
      CheckBoxListTileModel(
          userId: 2,
          img: 'assets/images/flutter.jpeg',
          title: "Flutter",
          isCheck: false),
      CheckBoxListTileModel(
          userId: 3,
          img: 'assets/images/ios_img.webp',
          title: "IOS",
          isCheck: false),
      CheckBoxListTileModel(
          userId: 4,
          img: 'assets/images/php_img.png',
          title: "PHP",
          isCheck: false),
      CheckBoxListTileModel(
          userId: 5,
          img: 'assets/images/node_img.png',
          title: "Node",
          isCheck: false),
    ];
  }
}
Md. Yeasin Sheikh
  • 54,221
  • 7
  • 29
  • 56
zeyzey
  • 31
  • 5

1 Answers1

1

The app is created as flutter_listtile_demo(package name). inside it there is a lib directory, and inside lib there is a model folder. Then they created a file name as listtilemodel.dart and then placed the CheckBoxListTileModel class. So the 3rd line of import is referring to this.

The copy paste issue can be raise when the app(package) name is the same, or the exact file path is different. Next issue can be raise from image paths. I will suggest you to start from guides.

You can replace 3rd import with your new created file location, the place you've put the model class. For auto import, little blue bulb can help on based on IDE.

Md. Yeasin Sheikh
  • 54,221
  • 7
  • 29
  • 56
  • Do I need to write only this place in the listtilemodel.dart file? class CheckBoxListTileModel { int userId; String img; String title; bool isCheck; CheckBoxListTileModel({this.userId, this.img, this.title, this.isCheck}); @Yeasin Sheikh – zeyzey Dec 11 '22 at 20:20
  • 1
    place the model class code only one place. like you can create a new file inside lib and then move the model class there. then the place you like to use it , import it. try [this post](https://stackoverflow.com/q/12951989/10157127) – Md. Yeasin Sheikh Dec 11 '22 at 20:28
  • i created a model file, created a listtilemodel.dart in it, and put the CheckBoxListTileModel class in it. I imported it in the main function, everything looked fine, but when I run it, the edit configuration window appears. @Yeasin Sheikh – zeyzey Dec 11 '22 at 20:42
  • 1
    To run a app you need a `main.dart` file inside lib, than use main function, inside there `runApp(MaterialApp(home:CheckBoxListTileDemo()))`, you can check the structure on [dartpad](https://dartpad.dev) by creating new flutter. or any example of of the doc like [tab](https://docs.flutter.dev/cookbook/design/tabs#interactive-example) – Md. Yeasin Sheikh Dec 11 '22 at 20:55
  • Thank you very much, you have been very helpful . @Yeasin Sheikh – zeyzey Dec 11 '22 at 21:20