解决InkWell水波纹颜色效果失效

最新推荐文章于 2024-05-18 21:59:47 发布

「已注销」

最新推荐文章于 2024-05-18 21:59:47 发布

阅读量1.5k

点赞数

分类专栏： Flutter 文章标签： flutter

本文链接：https://blog.csdn.net/qq_52084136/article/details/118676914

版权

Flutter 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

InkWell 在某些地方使用某种方式嵌套widget时会导致水波纹效果失效.

也查阅过其他文章，这里总结一下最实用的，能够解决绝大部分常见场景下的失效问题,上代码;

Material(
      child: Ink(
        child: InkWell(
          onTap: onTap,
          child: Container(
            child:Text("在此处包裹你的组件") ,///Wrap your components here
            ),
          ),
        ),
      ),

当然，这只是最简单的包裹组件的操作，需要详细使用，可参考源码：

///源码注释使用样例
/// Material(
///   color: Colors.grey[800],
///   child: Center(
///     child: Ink.image(
///       image: const AssetImage('cat.jpeg'),
///       fit: BoxFit.cover,
///       width: 300.0,
///       height: 200.0,
///       child: InkWell(
///         onTap: () { /* ... */ },
///         child: const Align(
///           alignment: Alignment.topLeft,
///           child: Padding(
///             padding: EdgeInsets.all(10.0),
///             child: Text(
///               'KITTEN',
///               style: TextStyle(
///                 fontWeight: FontWeight.w900,
///                 color: Colors.white,
///               ),
///             ),
///           ),
///         )
///       ),
///     ),
///   ),
/// )