Reputation: 1909
what I want to achieve is to make the parent only clickable not the child of the parent. Suppose, there is a clickable container with the size of 400x400, and the child of that container is another container with the size of 200x200.
Now if we touch the second container(smaller one), it is also clickable. How can I prevent the small container from getting clicked?
I have tried almost everything but I may don't have that good skills at flutter, please help.
Code:
InkWell(onTap: (){print('Container Clicked');},child:
Container(height: 400, width: 400, color: Colors.blue,
child: Center(child: Container(height: 200,width: 200, color: Colors.green,)),),)
Upvotes: 0
Views: 203
Reputation: 1216
I hope I got your question right. This is the code if you want to make only the bigger container clickable,
Stack(
children:[
InkWell(
onTap: (){
print('Container Clicked');
},
child: Container(
height: 400, width: 400,
color: Colors.blue,
),
),
Center(
child: Container(
height: 200,width: 200,
color: Colors.green,
),
),
],
),
Upvotes: 1
Reputation: 852
try this
InkWell(
onTap: (){
print('Container Clicked');
},
child: Container(
height: 400,
width: 400,
color: Colors.blue,
child: Center(
child: GestureDetector(
onTap: () {}, /// <-- locked inkwell tap
child: Container(
height: 200,
width: 200,
color: Colors.green,)
),
),
),
)
Upvotes: 1