Created
December 8, 2019 18:46
-
-
Save onatcipli/8108816d23654b06116930b2ca027a0e to your computer and use it in GitHub Desktop.
detect hover in flutter web
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 'package:flutter/gestures.dart'; | |
| import 'package:flutter/material.dart'; | |
| import 'package:universal_html/html.dart' as html; | |
| // Also add id="app_container" to web/index.html body tag | |
| // | |
| // | |
| //<!DOCTYPE html> | |
| //<html> | |
| //<head> | |
| //<meta charset="UTF-8"> | |
| //<title>onatcipli_github_io</title> | |
| //</head> | |
| //<body id="app_container"> | |
| //<script src="main.dart.js" type="application/javascript"></script> | |
| //</body> | |
| //</html> | |
| // | |
| class HoverDetector extends MouseRegion { | |
| // get a reference to the body element that we previously altered | |
| static final appContainer = | |
| html.window.document.getElementById('app_container'); | |
| HoverDetector({Widget child, void onHover(), void onExit()}) | |
| : super( | |
| onHover: (PointerHoverEvent evt) { | |
| appContainer.style.cursor = 'pointer'; | |
| onHover(); | |
| // you can use any of these: | |
| // 'help', 'wait', 'move', 'crosshair', 'text' or 'pointer' | |
| // more options/details here: http://www.javascripter.net/faq/stylesc.htm | |
| }, | |
| onExit: (PointerExitEvent evt) { | |
| onExit(); | |
| // set cursor's style 'default' to return it to the original state | |
| appContainer.style.cursor = 'default'; | |
| }, | |
| child: child); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment