Created
August 31, 2023 00:45
-
-
Save arif-pandu/e8369a3fbcdd0afdff007cb3eb29d444 to your computer and use it in GitHub Desktop.
Listening physical windows size for Flutter build web. Listen with and without debouncer
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'dart:async'; | |
import 'package:rxdart/rxdart.dart'; | |
import 'package:flutter/material.dart'; | |
import 'package:flutter/widgets.dart'; | |
import 'dart:html' as html; | |
class WindowResizeListener extends StatefulWidget { | |
final Widget child; | |
const WindowResizeListener({super.key, required this.child}); | |
@override | |
WindowResizeListenerState createState() => WindowResizeListenerState(); | |
} | |
class WindowResizeListenerState extends State<WindowResizeListener> { | |
final eventSubject = PublishSubject<html.Event>(); | |
@override | |
void initState() { | |
super.initState(); | |
/// Option 1 | |
html.window.addEventListener('resize', _handleWindowSizeChanged); | |
/// Option 2 | |
Stream<html.Event> debouncedResizeStream = html.window.onResize; | |
debouncedResizeStream.listen((event) { | |
eventSubject.add(event); | |
}); | |
final debouncedStream = eventSubject.debounceTime(const Duration(milliseconds: 100)); | |
debouncedStream.listen(_handleWindowResize); | |
} | |
@override | |
void dispose() { | |
/// Option 1 | |
html.window.removeEventListener('resize', _handleWindowSizeChanged); | |
/// Option 2 | |
eventSubject.close(); | |
super.dispose(); | |
} | |
void _handleWindowResize(_) { | |
// Using Debouncer | |
} | |
void _handleWindowSizeChanged(_) { | |
// Without Debouncer | |
} | |
@override | |
Widget build(BuildContext context) { | |
return widget.child; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment