HandCursor for Flutter Web

Flutter logo and a hand cursor

⚠ Starting with dev channel build version 1.19.0–3.0.pre there is built-in support for the pointer cursor. ⚠

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Your awesome app</title>
<script defer src="main.dart.js" type="application/javascript"></script>
</head>
<body id="app-container">
</body>
</html>
import 'package:flutter_web/gestures.dart';
import 'package:flutter_web/widgets.dart';
import 'dart:html' as html;
class HandCursor extends Listener { static final appContainer = html.window.document.getElementById('app-container'); HandCursor({Widget child}) : super(
onPointerHover: (PointerHoverEvent evt) {
appContainer.style.cursor='pointer';
},
onPointerExit: (PointerExitEvent evt) {
appContainer.style.cursor='default';
},
child: child
);
}
import 'package:awesome_app/widgets/containers/hand_cursor.dart';
import 'package:flutter_web/material.dart';
import 'package:flutter_web/widgets.dart';
class AwesomeButton extends StatelessWidget { @override
Widget build(BuildContext context) {
return Stack(
children: <Widget>[
HandCursor(
child: IconButton(
onPressed: () {
// let others know
// you can
// do some magic
},
icon: Icon(Icons.star)
),
),
],
);
}
}