Flutter can't align widget above another widget even when using the stack widget?

Question

I'm trying to align the dog image circle widget above the white card I'm using stack and align but it's not working I also tried padding

You can see here it's not going above the white card the idea is the circle will be above the card halfway

Like the following

Here is my code

if (snapshot.hasData && !snapshot.hasError) {
          return SizedBox(
            height: 375,
            child: ListView.builder(
              scrollDirection: Axis.horizontal,
              shrinkWrap: true,
              padding: const EdgeInsets.symmetric(vertical: 5.0),
              itemCount: snapshot.docs.length,
              itemBuilder: (context, index) {
                return Column(
                  children: <Widget>[
                    SizedBox(
                      // you may want to use an aspect ratio here for tablet support
                      height: 200.0,
                      width: MediaQuery.of(context).size.width,
                      child: PageView.builder(
                        itemCount: snapshot.docs.length,
                        // store this controller in a State to save the carousel scroll position
                        controller: PageController(
                          viewportFraction: 0.6,
                        ),
                        onPageChanged: (page) {
                          setState(() {
                            selectedDog = page;
                          });
                        },
                        itemBuilder: (context, itemIndex) {
                          return Stack(
                            children: [
                              DogCarouselCard(
                                snapshotData: snapshot.docs[itemIndex].data(),
                              ),
                              Align(
                                alignment: Alignment.topCenter,
                                child: SizedBox(
                                  height: 50,
                                  width: 50,
                                  child: snapshot.docs[itemIndex]
                                              .data()
                                              .dogImage ==
                                          null
                                      ? Image.asset(
                                          'assets/images/placeholder.png',
                                        )
                                      : CachedNetworkImage(
                                          width: 50,
                                          height: 50,
                                          imageUrl: snapshot.docs[itemIndex]
                                              .data()
                                              .dogImage
                                              .toString(),
                                          imageBuilder: (
                                            context,
                                            imageProvider,
                                          ) =>
                                              Container(
                                            decoration: BoxDecoration(
                                              shape: BoxShape.circle,
                                              image: DecorationImage(
                                                image: imageProvider,
                                                fit: BoxFit.cover,
                                              ),
                                              border: Border.all(
                                                color: accentColor,
                                                width: 2,
                                              ),
                                              boxShadow: [
                                                BoxShadow(
                                                  color: Colors.black87
                                                      .withOpacity(0.6),
                                                  spreadRadius: 0.8,
                                                  blurRadius: 2,
                                                  offset: const Offset(
                                                    1,
                                                    1,
                                                  ), // changes position of shadow
                                                ),
                                              ],
                                            ),
                                          ),
                                          placeholder: (context, url) =>
                                              const CircularProgressIndicator(
                                            color: primaryColor,
                                          ),
                                          errorWidget: (context, url, error) =>
                                              const Icon(Icons.error),
                                        ),
                                ),
                              ),
                            ],
                          );
                        },
                      ),
                    ),
                    Padding(
                      padding: const EdgeInsets.all(10.0),
                      child: SizedBox(
                        width: MediaQuery.of(context).size.width,
                        child: PageViewDotIndicator(
                          currentItem: selectedDog,
                          count: snapshot.docs.length,
                          unselectedColor: Colors.white,
                          selectedColor: accentColor,
                          duration: const Duration(milliseconds: 200),
                          padding: EdgeInsets.zero,
                          fadeEdges: false,
                        ),
                      ),
                    ),
                  ],
                );
              },
            ),
          );
        }

Answer 1

I got it working but doing the following

Adding Positioned widget

return Stack(
                            clipBehavior: Clip.none,
                            alignment: Alignment.topCenter,
                            children: [
                              DogCarouselCard(
                                snapshotData: snapshot.docs[itemIndex].data(),
                              ),
                              Positioned(
                                top: 0,
                                child: snapshot.docs[itemIndex]
                                            .data()
                                            .dogImage ==
                                        null
                                    ? Image.asset(
                                        'assets/images/placeholder.png',
                                      )
                                    : CachedNetworkImage(
                                        width: 50,
                                        height: 50,
                                        imageUrl: snapshot.docs[itemIndex]
                                            .data()
                                            .dogImage
                                            .toString(),
                                        imageBuilder: (
                                          context,
                                          imageProvider,
                                        ) =>
                                            Container(
                                          decoration: BoxDecoration(
                                            shape: BoxShape.circle,
                                            image: DecorationImage(
                                              image: imageProvider,
                                              fit: BoxFit.cover,
                                            ),
                                            border: Border.all(
                                              color: whiteColor, //accentColor,
                                              width: 2,
                                            ),

                                            /*
                                            boxShadow: [
                                              BoxShadow(
                                                color: Colors.black87
                                                    .withOpacity(0.6),
                                                spreadRadius: 0.8,
                                                blurRadius: 2,
                                                offset: const Offset(
                                                  1,
                                                  1,
                                                ), // changes position of shadow
                                              ),
                                            ],
                                            */
                                          ),
                                        ),
                                        placeholder: (context, url) =>
                                            const CircularProgressIndicator(
                                          color: primaryColor,
                                        ),
                                        errorWidget: (context, url, error) =>
                                            const Icon(Icons.error),
                                      ),
                              ),
                            ],
                          );