当用户将鼠标悬停、点击或聚焦在某个元素上时,工具提示会显示一条信息性消息。 在 Flutter 中,您可以使用名为 Tooltip 的内置小部件轻松创建工具提示。本文将带您了解 Tooltip 小部件的基础知识以及在实践中使用它的示例。 为了向小部件添加工具提示,您需要做的是将该小部件包装在一个工具提示小部件中,如下所示: Tooltip( message: 'This is a tooltip', child: OutlinedButton(onPressed: () {}, child: const Text('A Button')), ) 常用选项:
Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: const Text('KindaCode.com'), ), body: Center( child: Tooltip( message: 'This is a cute dog. Do you like him?', padding: const EdgeInsets.all(30), margin: const EdgeInsets.only(top: 80, left: 50), decoration: BoxDecoration( color: Colors.indigo, borderRadius: BorderRadius.circular(20)), textStyle: const TextStyle( fontSize: 15, fontStyle: FontStyle.italic, color: Colors.white), child: SizedBox( width: 320, height: 240, child: Image.network( 'https://luckly007.oss-cn-beijing./image/image-20210507081032836.png', fit: BoxFit.cover, ), ))), ); } |
|