如何在flutter中实现栈后可点击控件

trnvg8h3  于 2023-03-04  发布在  Flutter
关注(0)|答案(4)|浏览(138)

我在堆栈中有两个scaffold小部件用于某些目的..每个scaffold都有自己的内容。第二个支架有透明的背景色,所以第一个支架是可见的。

Stack(
  children: [
    Scaffold(
      body: GestureDetector(
        onTap: () {},
        child: myBody(),
      ),
    ),
    Scaffold(
      backgroundColor: Colors.transparent,
      body: ListView.builder(
        itemBuilder: (context, index) => ...,
      ),
    )
  ],
),

第一个Scaffold中的GestureDetector不起作用,这是因为脚手架堆栈
注意:我不能用IgnorePointer Package 第二个Scaffold,因为它有可点击的ListView.bulder,它也会忽略任何指针
如何解决这个问题

unftdfkk

unftdfkk1#

你可以从第二个scaffold列表项tap中获取回调方法,并在第一个scaffold GestureDetector中提供的level上创建一个函数。

void main(List<String> args) {
  Widget myBody() {
    return Container(
      color: Colors.cyanAccent.withOpacity(.3),
    );
  }

  void topLevelGesture() {
    debugPrint("got hit on GestureDetector");
  }

  runApp(
    MaterialApp(
      home: Stack(
        children: [
          Scaffold(
            body: GestureDetector(
              onTap: topLevelGesture,
              child: myBody(),
            ),
          ),
          Scaffold(
            backgroundColor: Colors.transparent,
            body: ListView.builder(
              itemBuilder: (context, index) => ListTile(
                title: Text("item $index"),
                onTap: () {
                  topLevelGesture();
                  print("tapped $index");
                },
              ),
            ),
          ),
        ],
      ),
    ),
  );
}
xoshrz7s

xoshrz7s2#

你可以把手势设置在栈外,用这个内部列表点击也可以,但是当你把第一个支架主体设置为可点击的时候,它就不起作用了,因为第二个支架覆盖了它。

GestureDetector(
         onTap(){}
         child:Stack(
    children[
       Scaffold(
       body:   myBody()
        
         )
      Scaffold(
       backGroundColor: Colors.transparent
       body: ListView.bulder(){....}
       )
     ]
    ))
q43xntqr

q43xntqr3#

您需要在堆栈小部件的末尾添加可点击小部件,如下所示:

Stack(
    children[
      firstWidget(),
      GestureDetector(
      onTap(){},
      child:  secondWidget()
      )
      
   ]
   )
ozxc1zmp

ozxc1zmp4#

只要像这样使用IgnorePointersecondWidget()就可以点击了。

Stack(
        children[
          firstWidget(),
          IgnorePointer(
            child: secondWidget(),
          ),
        ]
    )

相关问题