Siddharth Mehra
Siddharth Mehra

Reputation: 1909

How to make parent only CLICKABLE?

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

Answers (2)

Shaan Mephobic
Shaan Mephobic

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

novol
novol

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

Related Questions