The snippet is a bit long I am really sorry for this

Widget customListTile3(List<Datum> articles, int index, BuildContext context) {
  final urlImages = [
    articles[0].imageUrl!,
    articles[1].imageUrl!,
    articles[2].imageUrl!,
    articles[3].imageUrl!,
    articles[4].imageUrl!,
    articles[5].imageUrl!,
    articles[6].imageUrl!,
    articles[7].imageUrl!,
    articles[8].imageUrl!,
    articles[9].imageUrl!,
  ];

  String? time = DateFormat(
    'd MMMM yy',
  ).format(
    DateTime.parse(
      '${articles[index].date!}'.toString(),
    ),
  );
  Container(
    // padding: const EdgeInsets.all(20.0),
    margin: const EdgeInsets.all(6),
    decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(5.0),
        boxShadow: const [
          BoxShadow(color: Colors.white, blurRadius: 1, offset: Offset(0, 0)),
        ]),
    child: Column(
      children: <Widget>[
        Center(
          child: CarouselSlider.builder(
            options: CarouselOptions(
              viewportFraction: 1,
              // autoPlay: true,
            ),
            itemCount: 10,
            itemBuilder: (context, idx, realIndex) {
              return buildImage(articles, urlImages[idx], idx, context);
            },
          ),
        ),
      ],
    ),
  );
}

@override
Widget buildImage(articles, String urlImage, int idx, context) {
  return Container(
      margin: const EdgeInsets.all(2),
      decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(5.0),
          boxShadow: const [
            BoxShadow(
                color: Colors.black12, blurRadius: 5, offset: Offset(0, 3)),
          ]),
      child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
        Stack(alignment: Alignment.center, children: [
          GestureDetector(
            child: Container(
              height: 196,
              width: double.infinity,
              decoration: BoxDecoration(
                image: DecorationImage(
                  fit: BoxFit.cover,
                  // alignment: FractionalOffset.center,
                  image: NetworkImage(articles[idx].imageUrl!),
                ),
                borderRadius: const BorderRadius.only(
                    topLeft: Radius.circular(5),
                    topRight: Radius.circular(5),
                    bottomRight: Radius.circular(5),
                    bottomLeft: Radius.circular(5)),
              ),
              child: Container(
                margin: const EdgeInsets.only(top: 120, left: 0),
                color: Colors.black45.withOpacity(0.4),
                padding: const EdgeInsets.all(10.0),
                child: Text(
                  '${articles[idx].title}',
                  textAlign: TextAlign.left,
                  softWrap: true,
                  maxLines: 2,
                  overflow: TextOverflow.ellipsis,
                  style: const TextStyle(
                      color: Colors.white,
                      fontSize: 16,
                      fontWeight: FontWeight.w500,
                      fontFamily: ''),
                ),
              ),
            ),
            onTap: () {
              Icons.message;

              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => NewsViewDetail(
                    id: articles[idx].id!,
                  ),
                ),
              );
            },
          ),
        ])
      ]));

  Column(
    children: [
      DotsIndicator(
        dotsCount: 10,
        position: idx.toDouble(),
        decorator: DotsDecorator(
          size: const Size.square(6.0),
          activeSize: const Size(22.0, 6.0),
          activeShape:
              RoundedRectangleBorder(borderRadius: BorderRadius.circular(5.0)),
          activeColor: Colors.blue,
          spacing: const EdgeInsets.all(3.0),
        ),
      ),
    ],
  );
}

The problem is I have Dot Indicator and I want to use it under the slider container. If I put the DotsIndicator after the container close I am getting Dead Code error.

if I remove the return from first container I am getting this time null safety error.How can I handle this?

CodePudding user response：

your last Column isn't in build method change this

      ]));

  Column(
    children: [
      DotsIndicator(
        dotsCount: 10,
        position: idx.toDouble(),
        decorator: DotsDecorator(
          size: const Size.square(6.0),
          activeSize: const Size(22.0, 6.0),
          activeShape:
              RoundedRectangleBorder(borderRadius: BorderRadius.circular(5.0)),
          activeColor: Colors.blue,
          spacing: const EdgeInsets.all(3.0),
        ),
      ),
    ],
  );

on this

  Column(
    children: [
      DotsIndicator(
        dotsCount: 10,
        position: idx.toDouble(),
        decorator: DotsDecorator(
          size: const Size.square(6.0),
          activeSize: const Size(22.0, 6.0),
          activeShape:
              RoundedRectangleBorder(borderRadius: BorderRadius.circular(5.0)),
          activeColor: Colors.blue,
          spacing: const EdgeInsets.all(3.0),
        ),
      ),
    ],
  )]));

null safety error you i mean because you use (articles, String urlImage, int idx) in if-else how notEmpty change your parameters to nullable as (dynamic articles, String? urlImage, int? idx)