OverflowBox Widget

What is OverflowBox Widget?

The OverflowBox is to impose different constraints on its child than it gets from its parent, possibly allowing the child to overflow the parent.

Default Constructor

The default constructor creates a widget that lets its child overflow itself.

OverflowBox(
    alignment: Alignment.center,
    minWidth:
    maxWidth:
    minHeight:
    maxHeight:
    child:
)

Constructor Parameters

It contains many input parameters which can be configured to change its behavior and appearance.

The alignment is to add alignment to child both horizontally and vertically. Default to Alignment.center

The minWidth is to add minimum width constraint to its child. Set this to null (the default) to use the constraint from the parent instead.

The maxWidth is to add maximum width constraint to its child. Set this to null (the default) to use the constraint from the parent instead.

The minHeight is to add minimum height constraint to its child. Set this to null (the default) to use the constraint from the parent instead.

The maxHeight is to add maximum height constraint to its child. Set this to null (the default) to use the constraint from the parent instead.

Code snippet

The following code snippet shows how to configure OverflowBox widget.

OverflowBox(
      minHeight: 50,
      minWidth: 50,
      child: Container(
        width: 70,
        height: 70,
        color: Colors.blue,
        child: Text('OverflowBox widget demo'),
      ),
    );

Demo Code

This example shows widget of size 50x50 that lets its child overflow itself.

import 'package:flutter/material.dart';

class OverflowBoxDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return OverflowBox(
      minHeight: 50,
      minWidth: 50,
      child: Container(
        width: 70,
        height: 70,
        color: Colors.blue,
        child: Text('OverflowBox widget demo'),
      ),
    );
  }
}

class MyApp extends StatelessWidget {
  static const String _title = 'OverflowBox Demo';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: _title,
      home: Scaffold(
        appBar: AppBar(title: const Text(_title)),
        body: OverflowBoxDemo(),
      ),
    );
  }
}

void main() => runApp(MyApp());