美文网首页
Flutter开发踩坑- 使用Stack堆叠布局,点击OnTap

Flutter开发踩坑- 使用Stack堆叠布局,点击OnTap

作者: HHHHysteria | 来源:发表于2022-10-08 17:49 被阅读0次

       在Flutter开发页面中使用Stack布局时,对叠加在上面的视图使用InkWell添加点击事件时,点击事件会穿透到下层父视图,导致父视图同样触发点击事件,这很明显和设计是相悖的. 

       于是我调查后发现是InkWell的原因,以下是对InkWell的英文文档(非官方)解释:

    In addition, InkWell makes the whole area of the material parent widget as a hotspot which can help receive the user’s interaction easily. The InkWell responds to various gestures based on the action the user performs. 

    以上可得知InkWell的事件是会穿透视图达到父视图上,所以导致父视图具有同样事件.

    解决以上问题可以使用GestureDetector替代,以下是对GestureDetector的的英文文档(非官方)解释:

    Gesture detector is another widget to provide interactions in applications and it is used to, as its name suggests, detect gestures of the users. This is used when you want to provide interaction ability to widgets that don’t have a default built-in way to detect gestures such as containers and text widgets. These widgets are usually wrapped with a GestureDetector to detect gestures performed on them. In contrast with InkWell, GestureDetector doesn’t have a visual effect when the event occurs. In addition, GestureDetecor doesn’t make the whole area as a hotspot to detect gestures. If it has a child, then it depends on that child for its size behavior. If it doesn’t have a child, then it’ll grow to fit its parent size.

    亲测方法替换后可以解决此问题,望帮助到有同样开发问题的同学.

    相关文章

      网友评论

          本文标题:Flutter开发踩坑- 使用Stack堆叠布局,点击OnTap

          本文链接:https://www.haomeiwen.com/subject/ksmmhttx.html