Chris
Chris

Reputation: 2274

Flutter Container Column is not aligning correclty

I simply would like to have a couple of Containers inside a Column but somehow I can not align them correctly... This is my setup:

child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              ShimmerContainer(
                height: 50,
                width: 200,
              ),
              ShimmerContainer(
                height: 50,
                width: 200,
              ),
              ShimmerContainer(
                height: 50,
                width: 200,
              )
            ],
          ),

And somehow my Containers are all aligned in the center. The really weird thing is that if I wrap one of these ShimmerContainers inside a Align with Alignment.centerLeft all other containers are also aligning left. I have no idea why this happens.

This is my ShimmerContainer:

class ShimmerContainer extends StatelessWidget {
  final double? height;
  final double? width;
  final double borderRadius;

  const ShimmerContainer({
    this.height,
    this.width,
    this.borderRadius = 0,
  });

  @override
  Widget build(BuildContext context) {
    return Shimmer.fromColors(
      baseColor: Colors.grey[200]!,
      highlightColor: Colors.white,
      child: Container(
        height: height != null ? height!.scaled : null,
        width: width != null ? width!.scaled : null,
        decoration: BoxDecoration(
          color: white,
          borderRadius: BorderRadius.circular(
            borderRadius,
          ),
        ),
      ),
    );
  }
}

Upvotes: 1

Views: 156

Answers (1)

Md. Yeasin Sheikh
Md. Yeasin Sheikh

Reputation: 63569

Ouput of your code I added background color to view properly.

your result

I think you should use flutter clean and run again. Else error is happening from parent side.Does it solve your issue?

Upvotes: 1

Related Questions