Flutter position image outside of container

Question

I'am trying to place an image a little bit outside of container on Y axis, i tried to place the image after the container then move it with transform: Matrix4.translationValues(x,Y,z) but it leaves a space on bottom of page which i don't want, basically this is what i want to acheive

this is my code

                        Column(
                      children: [
                        Stack(
                          children: [
                            Container(
                              height: 151.0,
                              width: 122.0,
                              decoration: BoxDecoration(
                                borderRadius: BorderRadius.circular(8.0),
                                gradient: LinearGradient(
                                  begin: Alignment.topCenter,
                                  end: Alignment.bottomCenter,
                                  colors: [
                                    Color(0xffFFF0E5),
                                    Color(0xffdeddc2),
                                    Color(0xffa9ceb1),
                                    Color(0xff68bdb9),
                                    Color(0xff30a6ca)
                                  ],
                                ),
                                boxShadow: [
                                  BoxShadow(
                                    color:
                                        Color.fromARGB(255, 234, 246, 250),
                                    spreadRadius: 8,
                                    blurRadius: 7,
                                    offset: Offset(0, 6),
                                  ),
                                ],
                                border: Border.all(
                                  width: 4,
                                  color: Colors.yellow,
                                ),
                              ),
                              child: Column(
                                mainAxisAlignment: MainAxisAlignment.start,
                                crossAxisAlignment:
                                    CrossAxisAlignment.start,
                                children: [
                                  Container(
                                    child: Row(
                                      crossAxisAlignment:
                                          CrossAxisAlignment.start,
                                      mainAxisAlignment:
                                          MainAxisAlignment.spaceBetween,
                                      children: [
                                        Container(
                                          margin: EdgeInsets.only(
                                            left: 4.0,
                                            top: 9.0,
                                          ),
                                          child: Image.asset(
                                            'assets/images/Group 484.png',
                                            width: 39.52,
                                            height: 39.51,
                                          ),
                                        ),
                                        Container(
                                          transform:
                                              Matrix4.translationValues(
                                                  5.0, 0.0, 0.0),
                                          child: IconButton(
                                            onPressed: () {
                                              setState(() {
                                                selected = true;
                                              });
                                            },
                                            icon: CircleAvatar(
                                              backgroundImage: NetworkImage(
                                                  'https://lh3.googleusercontent.com/zrvgBfLZl94O6yJ_BlEInCIopvsokkrrrpBmVcByKwLSmacEV6B1P-SJA6eKP84ibOjFpA=s26'),
                                              child: selected == false
                                                  ? Image.asset(
                                                      'assets/images/Icon ionic-ios-heart-empty.png')
                                                  : Image.asset(
                                                      'assets/images/Icon ionic-ios-heart.png'),
                                            ),
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                  Expanded(
                                    child: Positioned(
                                      top: -20.0,
                                      child: Container(
                                        child: Image.asset(
                                          'assets/images/watch-gt2-listimage-Matte-Black.png',
                                          width: 125.0,
                                        ),
                                      ),
                                    ),
                                  ),
                                ],
                              ),
                            ),
                          ],
                        ),
                      ],
                    ),

Edit : i just add the full widget tree

Answer 1

Use property

clipBehavior: Clip.hardEdge,

in external widget

Card(
  clipBehavior: Clip.hardEdge, // <---
  shape: RoundedRectangleBorder(
    borderRadius: BorderRadius.circular(10.0),
  ),
  child: Stack(
    children: [
...

Answer 2

Please refer OverFlowBox widget.....you will get what you want...what you have to do is in container child property you have to wrap your another container with OverFlowBox widget and have to give the width and height