I got issue. The Checkbox not display in box. Refer below image

And this my code

Container(
    child: Row(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
            SizedBox(
                height: 105.0,
                child: ListView.builder(
                    scrollDirection: Axis.horizontal,
                    shrinkWrap: true,
                    // ignore: missing_return
                    itemBuilder: (context, index) {
                        Checkbox(
                            checkColor: Colors.blue,
                            value: _state[index] ?? false,
                            onChanged: (value) {
                                setState(() {
                                    _state[index] = value;
                                });
                                print(index);
                            },
                        );
                    }),
            ),
        ],
    )),

And when I add return checkbox it become like image below..

My main container code

child: Container(
    // Row(children: [
    // child: Row(children: [],),
    decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(25.0),
        boxShadow: [
            BoxShadow(color: Colors.grey[500], blurRadius: 3.0, spreadRadius: 1.0),
        ],
    ),
    width: data.size.width * 0.26,
    height: data.size.width * 0.26 * 1.2,
    padding: EdgeInsets.all(data.size.width * 0.02),
    child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
            Row(
                children: [
                    Container(
                        child: AvatarLetter(
                            size: 100,
                            backgroundColor: getBackColor(),
                            textColor: Colors.white,
                            fontSize: 40,
                            upperCase: true,
                            numberLetters: 3,
                            letterType: LetterType.Circular,
                            text: this.widget.inspect.insType,
                            backgroundColorHex: null,
                            textColorHex: null,
                        ),
                    ),
                    SizedBox(width: 10),
                    Container(
                        margin: EdgeInsets.all(10),
                        child: Row(
                            children: [
                                Align(
                                    // alignment: Alignment.topLeft,
                                    child: Column(
                                        children: [
                                            Text(
                                                'Cert No: '   this.widget.inspectDetails.certId,
                                                textAlign: TextAlign.left,
                                                style: TextStyle(
                                                    color: Colors.black87,
                                                    fontSize: data.size.width * 0.025,
                                                    fontWeight: FontWeight.bold),
                                            ),
                                            Text(
                                                this.widget.inspect.insType ?? '',
                                                textAlign: TextAlign.left,
                                                style: TextStyle(
                                                    color: Colors.black87,
                                                    fontSize: data.size.width * 0.022,
                                                    fontWeight: FontWeight.bold),
                                            ),
                                            Text(
                                                DateFormat('dd MMMM yyyy')
                                                .format(DateTime.parse(this.widget.inspect.testDate))
                                                .toString(),
                                                textAlign: TextAlign.left,
                                                style: TextStyle(
                                                    color: Colors.grey[400],
                                                    fontSize: data.size.width * 0.02,
                                                    fontWeight: FontWeight.bold,
                                                ),
                                            ),
                                        ],
                                    ),
                                ),
                                // Spacer(flex: 1),
                            ],
                            // size: 60.0,
                        ),
                    ),
                    // Spacer(flex: 1),
                    Container(
                        child: Row(
                            mainAxisAlignment: MainAxisAlignment.start,
                            children: [
                                SizedBox(
                                    height: 105.0,
                                    child: ListView.builder(
                                        scrollDirection: Axis.horizontal,
                                        shrinkWrap: true,
                                        // ignore: missing_return
                                        itemBuilder: (context, index) {
                                            Checkbox(
                                                checkColor: Colors.blue,
                                                value: _state[index] ?? false,
                                                onChanged: (value) {
                                                    setState(() {
                                                        _state[index] = value;
                                                    });
                                                    print(index);
                                                },
                                            );
                                        }),
                                ),
                            ],
                        )),
                ],
            ),
        ],
    ),
),

CodePudding user response：

Your first issue is you forgot use return in itemBuilder and second issue is you forgot to use itemCount inside ListView.builder, try this:

ListView.builder(
      scrollDirection: Axis.horizontal,
      shrinkWrap: true,
      itemCount: _state.length, // <---add this
      itemBuilder: (context, index) {
        return Checkbox( // <---add this
          checkColor: Colors.blue,
          value: _state[index] ?? false,
          onChanged: (value) {
            setState(() {
              _state[index] = value;
            });
            print(index);
          },
        );
      },
    )

CodePudding user response：

Try the following code:

Container(
  child: Row(
    mainAxisAlignment: MainAxisAlignment.start,
    children: [
      SizedBox(
        height: 105.0,
        child: ListView.builder(
          scrollDirection: Axis.horizontal,
          shrinkWrap: true,
          itemCount: _state.length,
          itemBuilder: (context, index) {
            return Checkbox(
              checkColor: Colors.blue,
              value: _state[index] ?? false,
              onChanged: (value) {
                setState(() {
                  _state[index] = value;
                });
                print(index);
              },
            );
          },
        ),
      ),
    ],
  ),
),

CodePudding user response：

Specify the itemCount: constructor then only the list will be built.