墨水池小部件需要一个材料设计的祖先小部件。

Question

我在Row中添加InkWell作为Widget，但是它报错了：

flutter: ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
flutter: The following assertion was thrown building InkWell(gestures: [tap], clipped to BoxShape.rectangle,
flutter: dirty, state: _InkResponseState<InkResponse>#0e6c5):
flutter: No Material widget found.
flutter: InkWell widgets require a Material widget ancestor.

这是我的代码：

Container(
  color: Colors.red,
  child: Row(
    mainAxisAlignment: MainAxisAlignment.spaceBetween,
    crossAxisAlignment: CrossAxisAlignment.start,
    children: <Widget>[
      InkWell(
        onTap: (){
          //Forgot password Tapped
        },
      child: Text(Constants.forgotPassword),),
    ],
),

- Code Hunter

---

请尝试使用Material小部件包装您的Inkwell，代码如下：Material( child: InkWell(), ) - HaSnen Tai

Answer 1

InkWell 类始终与 Material 类一起使用。

请尝试以下代码。

代码：将 InkWell 类与 Material 类包装在一起。

  Material(
          child: InkWell(
      onTap: (){
        //Forgot password Tapped
      },
    child: Text(Constants.forgotPassword),),
  ),

谢谢

- HaSnen Tai

---

如果我这样做，我的内容就会开始在文本中显示白色背景。 - Code Hunter

材料( child: InkWell( onTap: (){ //点击忘记密码 }, child: Text(Constants.forgotPassword,style: new TextStyle(color: Colors.black26),),), ), - HaSnen Tai

请使用Text样式类并更改文本的颜色。 - HaSnen Tai

@CodeHunter 你可以在Material小部件中使用这个属性：MaterialType.transparency。 - mohmdezeldeen

Answer 2

解决上述问题的方法有两种。

1. Replace InkWell with GestureDetector

    GestureDetector(
      onTap: () {
   
    },);
   

2. Wrap InkWell with Material, as InkWell required Material Widget to wrap

    InkWell(
      onTap: () {
   
        },);
   

注意: 要引入一个Material小部件，您可以直接包含一个，或使用包含Material本身的小部件，例如Card、Dialog、Drawer或Scaffold。

- Jitesh Mohite

Answer 3

将InkWell类与Scaffold包装在一起，问题就会解决。

- Haley Huynh

Answer 4

并不是说Material必须作为父级添加。

如果它是一个StatelessWidget，并且您跳转到此页面，它会自动将其视为小部件的父级，例如Scaffold。

这也发生在我身上，最终Flutter中许多组件已经扩展了Material，因此问题可能会更早地出现。

- AlexPad