Breaking News: Grepper is joining You.com. Read the official announcement!

flutter get child widget size

nidal bakir answered on May 15, 2022 Popularity 8/10 Helpfulness 2/10

answer flutter get child widget size

flutter get child widget size

Comment

import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';

typedef OnWidgetSizeChange = void Function(Size size);

/// [MeasuredSize] Calculated the size of it's child in runtime.
/// Simply wrap your widget with [MeasuredSize] and listen to size changes with [onChange].
class MeasuredSize extends StatefulWidget {
  /// Widget to calculate it's size.
  final Widget child;

  /// [onChange] will be called when the [Size] changes.
  /// [onChange] will return the value ONLY once if it didn't change, and it will NOT return a value if it's equals to [Size.zero]
  final OnWidgetSizeChange onChange;

  const MeasuredSize({
    Key? key,
    required this.onChange,
    required this.child,
  }) : super(key: key);

  @override
  _MeasuredSizeState createState() => _MeasuredSizeState();
}

class _MeasuredSizeState extends State<MeasuredSize> {
  bool _calculating = true;
  @override
  void initState() {
    SchedulerBinding.instance!.addPostFrameCallback(postFrameCallback);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    SchedulerBinding.instance!.addPostFrameCallback(postFrameCallback);

    return AnimatedOpacity(
      duration: const Duration(milliseconds: 100),
      opacity: _calculating ? 0.0 : 1.0,
      child: Container(
        key: widgetKey,
        child: widget.child,
      ),
    );
  }

  var widgetKey = GlobalKey();
  Size? oldSize;

  void postFrameCallback(_) {
      _calculating = true;
      
    var context = widgetKey.currentContext!;
    
    // await Future.delayed(
    //     Duration(milliseconds: 100)); // wait till the image is drawn
    
    Size newSize = context.size!;
    _calculating = false;
    if (newSize == Size.zero) return;
    if (oldSize == newSize) return;
    oldSize = newSize;
    widget.onChange(newSize);
  }
}

Popularity 8/10 Helpfulness 2/10 Language dart

Source: Grepper

Tags: dart flutter-get size widget

Link to this answer
Share Copy Link

Contributed on May 15 2022

nidal bakir

0 Answers Avg Quality 2/10

flutter get child widget size

Contents

More Related Answers

flutter get child widget size

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.