IntrinsicHeight works incorrectly with Images

[QuasiStellar]

IntrinsicHeight fails to calculate its height in various cases (i.e. when Text is present #87571), but this issue is about Images.

UPD: the following example is broken, check this one instead: #117079 (comment)
Code snippet:
https://dartpad.dev/?id=41c3233072b062e4f754f253c4326da7

Code above produces a Row of a VerticalDivider and a Column that contains some 1-line Texts and an Image. You can tell by the visible height of the VerticalDivider the resulting height of the Row isn't right:

Now change the line 40 from this
width: 100,
to this
height: 100,
and it corrects itself:

Seems like Images report their original height to IntrinsicHeight without considering that it could've changed due to custom width parameter. Changing its height pareameter, however, does the trick.

[darshankawar]

Thanks for the report @QuasiStellar
I tried the code sample on iOS and observed below:

1. With height: 200:

2. With width: 200:

Comparing both (left image with height, right with width):

I wrapped the second Column with Expanded so as not to get the overflow error and that's probably the reason the text in second column is wrapped to next line, but with width: 200, it seems to be properly stretched as you can see above.

Can you confirm if this is the correct interpretation of the issue or you still see a different behavior ?

code sample used

import 'package:flutter/material.dart';

const Color darkBlue = Color.fromARGB(255, 18, 32, 47);

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark(),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Stack(
          children: [Center(child: MyWidget())],
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return IntrinsicHeight(
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const VerticalDivider(color: Colors.yellow),
          Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Text(
                'Hello, World!',
                style: Theme.of(context).textTheme.headlineMedium,
              ),
              Text(
                'Hello, World!',
                style: Theme.of(context).textTheme.headlineMedium,
              ),
              Text(
                'Hello, World!',
                style: Theme.of(context).textTheme.headlineMedium,
              ),
              Image.network(
                'https://flutter.github.io/assets-for-api-docs/assets/widgets/owl.jpg',
                height: 200,
              )
            ],
          ),
          const VerticalDivider(color: Colors.yellow),
          Expanded(
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                Text(
                  'Hello, World!',
                  style: Theme.of(context).textTheme.headline4,
                ),
                Text(
                  'Hello, World!',
                  style: Theme.of(context).textTheme.headline4,
                ),
                Image.network(
                  'https://flutter.github.io/assets-for-api-docs/assets/widgets/owl.jpg',
                  height: 200,
                )
              ],
            ),
          ),
          const VerticalDivider(color: Colors.yellow),
        ],
      ),
    );
  }
}

[QuasiStellar]

@darshankawar oops, the code snippet my link is pointing to doesn't reflect what I wrote in the issue since I didn't save local changes before posting it here...

So here is an even simplier example:

import 'package:flutter/material.dart';

const Color darkBlue = Color.fromARGB(255, 18, 32, 47);

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark(),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(child: MyWidget()),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return IntrinsicHeight(
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const VerticalDivider(color: Colors.yellow),
          Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              const SizedBox(
                height: 20,
                width: 400,
              ),
              Image.network(
                'https://flutter.github.io/assets-for-api-docs/assets/widgets/owl.jpg',
                width: 100,
              ),
            ],
          ),
        ],
      ),
    );
  }
}

The result:

This happens when there is another element present whose width exeeds the width of the Image. In this case it's the SizedBox of width 400.

After specifying the height of the image explicitly (replace width: 100 with height: 100) we get the desired result:

This issue has nothing to do with Text widgets so I removed them from this example. Let me know if I should just replace my first broken example with this one.

[darshankawar]

Thanks for the update and clarification. Using the code sample provided above, seeing same behavior as reported.

stable, master flutter doctor -v

[✓] Flutter (Channel stable, 3.3.9, on macOS 12.2.1 21D62 darwin-x64, locale
    en-GB)
    • Flutter version 3.3.9 on channel stable at
      /Users/dhs/documents/fluttersdk/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision b8f7f1f986 (12 days ago), 2022-11-23 06:43:51 +0900
    • Engine revision 8f2221fbef
    • Dart version 2.18.5
    • DevTools version 2.15.0

[!] Xcode - develop for iOS and macOS (Xcode 12.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    ! Flutter recommends a minimum Xcode version of 13.
      Download the latest version or update via the Mac App Store.
    • CocoaPods version 1.11.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] VS Code (version 1.62.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.21.0

[✓] Connected device (5 available)
    • SM G975F (mobile)       • RZ8M802WY0X • android-arm64   • Android 11 (API 30)
    • Darshan's iphone (mobile)  • 21150b119064aecc249dfcfe05e259197461ce23 •
      ios            • iOS 14.4.1 18D61
    • iPhone 12 Pro Max (mobile) • A5473606-0213-4FD8-BA16-553433949729     •
      ios            • com.apple.CoreSimulator.SimRuntime.iOS-14-3 (simulator)
    • macOS (desktop)            • macos                                    •
      darwin-x64     • Mac OS X 10.15.4 19E2269 darwin-x64
    • Chrome (web)               • chrome                                   •
      web-javascript • Google Chrome 98.0.4758.80

[✓] HTTP Host Availability
    • All required HTTP hosts are available

! Doctor found issues in 1 category.

[!] Flutter (Channel master, 3.7.0-10.0.pre.15, on macOS 12.2.1 21D62
    darwin-x64, locale en-GB)
    • Flutter version 3.7.0-10.0.pre.15 on channel master at
      /Users/dhs/documents/fluttersdk/flutter
    ! Warning: `flutter` on your path resolves to
      /Users/dhs/Documents/Fluttersdk/flutter/bin/flutter, which is not inside
      your current Flutter SDK checkout at
      /Users/dhs/documents/fluttersdk/flutter. Consider adding
      /Users/dhs/documents/fluttersdk/flutter/bin to the front of your path.
    ! Warning: `dart` on your path resolves to
      /Users/dhs/Documents/Fluttersdk/flutter/bin/dart, which is not inside your
      current Flutter SDK checkout at /Users/dhs/documents/fluttersdk/flutter.
      Consider adding /Users/dhs/documents/fluttersdk/flutter/bin to the front
      of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 76bb8ead5a (62 minutes ago), 2022-12-15 19:38:53 -0800
    • Engine revision 29196519c1
    • Dart version 3.0.0 (build 3.0.0-21.0.dev)
    • DevTools version 2.20.0
    • If those were intentional, you can disregard the above warnings; however
      it is recommended to use "git" directly to perform update checks and
      upgrades.


[!] Xcode - develop for iOS and macOS (Xcode 12.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    ! Flutter recommends a minimum Xcode version of 13.
      Download the latest version or update via the Mac App Store.
    • CocoaPods version 1.11.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] VS Code (version 1.62.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.21.0

[✓] Connected device (5 available)
    • SM G975F (mobile)       • RZ8M802WY0X • android-arm64   • Android 11 (API 30)
    • Darshan's iphone (mobile)  • 21150b119064aecc249dfcfe05e259197461ce23 •
      ios            • iOS 14.4.1 18D61
    • iPhone 12 Pro Max (mobile) • A5473606-0213-4FD8-BA16-553433949729     •
      ios            • com.apple.CoreSimulator.SimRuntime.iOS-14-3 (simulator)
    • macOS (desktop)            • macos                                    •
      darwin-x64     • Mac OS X 10.15.4 19E2269 darwin-x64
    • Chrome (web)               • chrome                                   •
      web-javascript • Google Chrome 98.0.4758.80

[✓] HTTP Host Availability
    • All required HTTP hosts are available

! Doctor found issues in 1 category.