Keep Flutter widget at fixed size upon resizing window-CodePudding

I have the following in my widget's build method:

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
      appBar: AppBar(
        title: const Text('Title bar'),
      ),
      body: Center(
        child: SizedBox(
          width: 250,
          child: ListView(
            children: [
              const Text('Text goes here'),
              Container(
                  width: 250,
                  height: 250,
                  color: Colors.green,
                  child: Texture(textureId: textureId)), // ID of a texture that displays pixels
            ],
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        child: const Text('Button'),
        onPressed: () {
          noisy();
        },
      ),
    ));

What I want to have take place is that the Texture widget is always 250x250 pixels, regardless of what I resize the window to. When I resize the window vertically, this is what happens, and the overflow of the widget that goes past the bottom of the screen is just clipped and ignored. However, when I resize horizontally making the window less wide than the widget, the widget is scaled horizontally, getting compressed in that direction instead of being clipped to the right. What arrangement if widgets would I need in order to keep the Container/Texture at 250x250 pixels and have it clipped past the end of the window instead of being compressed?

I have tried surrounding the inner Container in another horizontal ListView, as the outer ListView appears to clip the window vertically correctly, but that causes RenderBox was not laid out: RenderRepaintBoundary#51231 relayoutBoundary=up5 NEEDS-PAINT.... I also attempted placing that inner ListView in another Container/SizedBox, though this did not fix the shrinking issue and cause it to clip instead.

CodePudding user response：

Try using unconstrainedBox

UnconstrainedBox(
  child: SizedBox(
  )
)

This allows a child to render at the size it would render if it were alone on an infinite canvas with no constraints. This container will then attempt to adopt the same size, within the limits of its own constraints. If it ends up with a different size, it will align the child based on alignment. If the box cannot expand enough to accommodate the entire child, the child will be clipped.

In debug mode, if the child overflows the container, a warning will be printed on the console, and black and yellow striped areas will appear where the overflow occurs.

CodePudding user response：

simple, use ConstraintBox & set it minHeight and minWidth

 ConstrainedBox(
     constraints: const BoxConstraints(
                minWidth: 100,
                minHeight: 100
            ),
          )