Search code examples
flutterimagewidget

Flutter BoxFit.cover - Show top of image, not center

I have a cell where I have some place for an image. The height of that place is smaller than actual image height, so I use BoxFit.cover option to fit it.

Its look ok, but it shows the middle part of image, but I want to show the top of image.

Is there any option to show top of Image when using BoxFit.cover?

My Code:

  Container(
    height: 200,
    width: double.infinity,
    child: Image.network(
      appointment.imageUrl!,
      fit: BoxFit.cover,
    ),
  ),

Thanks for help.

Solution

  • Yes, there is way to do so by using alignment property of image same as below

    Container(
  height: 200, // set your desired height here
  child: Image.asset(
    'path/to/your/image.jpg',
    fit: BoxFit.cover,
    alignment: Alignment.topCenter,
  ),
);