微信交流群

老孟公众号

# Tooltip

Tooltip是一个消息提示组件,当用户点击或者长按时显示提示,在屏幕阅读器能够使它语音化,这有助于视力障碍人士阅读,用法如下:

Tooltip(
  message: '这是提示',
  child: Icon(Icons.storage),
)
1
2
3
4

效果如下:

我们还可以设置提示的宽高、内外边距、垂直偏移,用法如下:

Tooltip(
  padding: EdgeInsets.all(2.0),
  margin: EdgeInsets.all(5.0),
  verticalOffset: 2,
  message: '这是提示',
  child: Icon(Icons.storage),
)
1
2
3
4
5
6
7

设置样式及字体样式,用法如下:

Tooltip(
  textStyle: TextStyle(color: Colors.blue),
  decoration: BoxDecoration(
    color: Colors.red
  ),
  message: '这是提示',
  child: Icon(Icons.storage),
)
1
2
3
4
5
6
7
8

效果如下:

设置显示和等待时长,用法如下:

Tooltip(
  waitDuration: Duration(seconds: 1),
  showDuration: Duration(seconds: 2),
  message: '这是提示',
  child: Icon(Icons.storage),
)
1
2
3
4
5
6