2021年3月30日星期二

Button getting overlapped because of being close to each other now I can't tap on the button beneath in Flutter

I am unable to make the buttons not overlap so I can tap on them separately like below

Flutter Inspection

As you can see I cannot tap on the button which lies beneath those other 3 buttons.

Inspection off

Here is the normal picture of the screen where the clouds seems to be clickable but it isn't reachable easily.

Here is the code for my Cloud Button

class Cloud extends StatelessWidget {    Cloud({this.width,this.height,this.bottom,this.left,this.lineUpLink,this.right,this.top,this.videoLink});    final String videoLink;    final String lineUpLink;    final double bottom;    final double left;    final double right;    final double top;    final double height;    final double width;    @override    Widget build(BuildContext context) {        return Positioned(        bottom: bottom,        left: left,        width: width,        height: height,        top: top,        right: right ,        child: IconButton(          icon: Image.asset('images/cloud30.png'),          onPressed: () {            final getLink = GetLink(              link: videoLink,                lineLink: lineUpLink,              );              Navigator.push(              context,              MaterialPageRoute(                  builder: (context) => VideoApp(link: getLink.link,lineupLink: getLink.lineLink,)),            );          },        ),      );    }  }    

Here is my Stack code in the main screen.

      fit: StackFit.expand,        children: [          //T Smokes          Center(child: Image.asset('images/nuke.png')),          Cloud(top: 310/782 * height,left: 185/392 * width,videoLink: 'https://giant.gfycat.com/NarrowImpassionedCero.webm',lineUpLink: 'https://firebasestorage.googleapis.com/v0/b/flash-chats-2f263.appspot.com/o/Nuke%2F1.png?alt=media&token=1116e338-07b3-4780-b919-4ce3fa1b68a6',),//Ramp          Cloud(top: 350/782 * height,right: 125/392 * width,videoLink: 'https://giant.gfycat.com/ThreadbareSecondBat.webm', lineUpLink: 'https://firebasestorage.googleapis.com/v0/b/flash-chats-2f263.appspot.com/o/Nuke%2F2.png?alt=media&token=884fed00-8d42-41be-87f5-65cc81c2a684',),//Heaven          Cloud(top: 355/782 * height,right: 95/392 * width,videoLink: 'https://giant.gfycat.com/InformalHeartfeltAfricanclawedfrog.webm',lineUpLink: 'https://firebasestorage.googleapis.com/v0/b/flash-chats-2f263.appspot.com/o/Nuke%2F3.png?alt=media&token=f0d61fd2-8527-48cf-8062-5187f6be7cf1',),//Outside Heaven          Cloud(bottom: 290/782 * height,left: 180/392 * width,videoLink: 'https://giant.gfycat.com/AdolescentThisCornsnake.webm',lineUpLink: 'https://firebasestorage.googleapis.com/v0/b/flash-chats-2f263.appspot.com/o/Nuke%2F4.png?alt=media&token=ce9e6dca-4dbc-42b1-8de3-c5f68576ca47',),//T Red          Cloud(bottom: 325/782 * height,left: 205/392 * width,videoLink: 'https://giant.gfycat.com/JovialQuaintHackee.webm',lineUpLink: 'https://firebasestorage.googleapis.com/v0/b/flash-chats-2f263.appspot.com/o/Nuke%2F6.png?alt=media&token=37d4ca8e-e39b-479c-a7cc-c8dac7c37ec0',),//Mini Inside          Cloud(bottom: 275/782 * height, right: 130/392 * width,videoLink: 'https://giant.gfycat.com/HomelyGiganticGallinule.webm',lineUpLink: 'https://firebasestorage.googleapis.com/v0/b/flash-chats-2f263.appspot.com/o/Nuke%2F7.png?alt=media&token=73d4f4bd-9f78-42da-8102-cdb341c8ebef',),//Outside passing red          Cloud(bottom: 300/782 * height,right: 100/392 * width,videoLink: 'https://giant.gfycat.com/WarpedGrandioseHerald.webm',lineUpLink: 'https://media.discordapp.net/attachments/688396703685935154/826611169145126932/unknown.png',),//Garage          Cloud(bottom: 335/782 * height,left: 180/392 * width,videoLink: 'https://giant.gfycat.com/DazzlingUnsightlyHairstreakbutterfly.webm',lineUpLink: 'https://media.discordapp.net/attachments/763777060636065812/826612884212678656/unknown.png',),// Vent          Cloud(bottom: 300/782 * height,left: 205/392 * width,videoLink: 'https://giant.gfycat.com/ForcefulExaltedErne.webm',lineUpLink: 'https://firebasestorage.googleapis.com/v0/b/flash-chats-2f263.appspot.com/o/Nuke%2F5.png?alt=media&token=189d94eb-cde6-452d-a0a3-56ec7c544c11',),//T red T side left          Cloud(bottom: 330/782 * height,right: 112/392 * width,videoLink: 'https://giant.gfycat.com/FeistyReasonableEkaltadeta.webm',lineUpLink: 'https://media.discordapp.net/attachments/763777060636065812/826614730097426522/unknown.png',),//CT Red          ],        ),  

Please someone can help me find the solution for this problem?

Thank you.

https://stackoverflow.com/questions/66828624/button-getting-overlapped-because-of-being-close-to-each-other-now-i-cant-tap-o March 27, 2021 at 02:31PM

没有评论:

发表评论