androidflutterimage-size

How to move image in flutter Card by small amount


I am making a flutter app and I am using the same image in two places. The first place is a carousel and the second is a Full size Container. The image in the carousel is being cut and I want to shift it slightly to the right so that it does not get cut from the text area.

Currently this is how it looks

enter image description here

I want to ensure that the box with the text is not cropped.

Below is the image for reference

enter image description here

This is the code I am using

child: Card(
                    elevation: 4,
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(20),
                    ),
                    margin: const EdgeInsets.all(24),
                    child: ClipRRect(
                      borderRadius: BorderRadius.circular(
                          12.0),
                      child: Image.asset(
                        imageName,
                        fit: BoxFit.cover,
                        width: double.infinity,
                        height: double.infinity,
                      ),
                    ),
                  ),

Solution

  • You can utilize the alignment property within the Image.asset widget.

    To align it from the left, simply assign alignment as Alignment.centerLeft.

    For more customization, you can set it from Alignment(-1.0, 0.0), which represents Alignment.centerLeft, to Alignment(0.0, 0.0), representing Alignment.center.

    For example:

    child: Image.asset(
      imageName,
      fit: BoxFit.cover,
      alignment: Alignment.centerLeft,
      width: double.infinity,
      height: double.infinity,
    ),