Play Again Btn Clickable Area Overlaps Continue Button & Other Parts of Screen

Unity Courses Ask
,
#1

Hi, I’ve been trying to figure this out for a few days and have come up empty so far.

I just finished the advertising lecture and implemented the “Continue” button. But, when I click it, the game crashes giving me an error saying:

MissingReferenceException: The object of type ‘GameObject’ has been destroyed but you are still trying to access it.
Your script should either check if it is null or you should not destroy the object.

After a lot of trial and error I think I figured out what is going on but I can’t figure out how to fix it.

What seems to be happening is the clickable area for the “Play Again” button overlaps both the “Continue” button, the “Return to Menu” button, and other parts of the menu.

Another odd thing is the clickable area for the “Play Again” button does not completely overlap the “Continue” button. It only overlaps the right two-thirds or so. This is how it works:

If I click on the “Play Again” button it all works fine. If I click on the black space between the “Play Again” button and the “Continue” button it works as expected. That is, nothing happens because no button is being clicked on. If I click on the left 1/3 of the “Continue” button it works as expected - the ad shows and I can close the ad and continue playing the game.

But, if I click on the right 2/3rds of the Continue Button or any place right of the Continue Button (the “Return to Menu” button or even any part of the screen right of that) the PlayAgain function that is tied to the “Play Again” button runs. This function even runs if I click the area of the screen below the “Continue” button, the “Return to Menu” button, and the area to the right and below of the “Return to Menu” button .

I determined that the PlayAgain function was running as a result of these clicks by putting in debug statements to print out to the console what part of the code is running when it crashes.

I also tried disabling the “Play Again” button by unchecking the check mark in the inspector that makes my Play Again button inactive / invisible. When I did this, all the other buttons worked properly and clicking elsewhere on the screen does not run the PlayAgain function.

I also tried debugging it by leaving the “Play Again” button visible but unchecking “Interactable” and again the other buttons worked properly now.

So this leads me to believe there is something wrong with the Play Again button and how its clickable area is working. The button itself looks like the correct size on screen. When I select the button in the scene view the outline seems to only surround the button. The outline doesn’t seem to go outside the borders of the button from what I can tell.

I also looked at the child text of the Play Again button and as far as I can tell it is fine too. When I select the child text in the scene view its outline also does not go outside the borders of the button.

And I went back through the lecture where the “Play Again” button is implemented and it seems correct to me. That said, I’m sure I must have missed something or done something wrong.

I just can’t seem to find the issue. If helpful, I’m using Unity version 2021.3.14f1 Personal.

Any thoughts on what might be going on and where to investigate? Happy to share my code if that’s helpful.

Thanks.

#2

My first thought was that you might have been using 2022.3, as the early versions of the 2022 LTS contain some scaling issues…

I don’t think code is an issue in this case, but rather the UI itself.

Check to make sure that your Canvas Scaler is set to Scale With Screen Size, and that the dimensions match the orientation of your game. If, for example, your game is a landscape game, then the larger dimension should be first, with the smaller dimension last, and conversely if it is portrait, then the smaller dimension should be first, and the larger last.

Next, check the anchor position of each of the buttons. They need to be anchored in such a way that however you scale the game (within the same orientation), and then you should check against as many devices as possible in the Device Simulator to ensure that the buttons do not overlap.

In terms of the Play Again Button itself, to use an old but effective solution, you may wish to delete it and construct another one.

#3

Thanks Brian. I’ll try your suggestions tomorrow and report back.

I was thinking about deleting the button and just rebuilding it but was hoping to find the issue just so I could understand what is going on for future reference. But I have a feeling I may have to do that.

I also thought that maybe the version of Unity I’m using had some sort of issue as I saw a few older posts around the internet claiming that older versions of Unity (older than the one I’m using that is) had scaling issues. But it wasn’t clear to me if what they were saying was true or more of an opinion.

I’m pretty new to Unity so it’s really a learning experience for me.

In any event, I’ll try your thoughts first and report back. I appreciate the help.

#4

Often it’s something silly and stupid we’ll never figure out. A mis-serialized bit of data, a hidden component, it can be hard to tell.

#5

Quick update.

I first checked that the canvas (the one inside the GameOverHandler game object) is set to “Scale with screen size” in the “UI Scale Mode” setting and it is.

I then checked my dimensions to see if they match the orientation of my game. I have them set to 2346 x 1125 (matching an iPhone XS) for the Reference Resolution inside the Canvas Scaler section of the canvas that is inside my GameOverHandler game object. My game is set for landscape so I think this is correct?

I then checked the anchor positions for each button. For the buttons from left to right they are

  1. PlayAgainButton: Min X = 0, Min Y = 0, Max X = .33, Max Y = .3
  2. ContinueButton: Min X = .33, Min Y = 0, Max X = .66, Max Y = .3
  3. ReturnToMenyButton: Min X = .66, Min Y = 0, Max X = 1, Max Y = .3

I also checked the padding around the buttons and it looks ok to me.

I also used the device simulator to check about 10 devices and I didn’t see a case where the buttons overlapped.

I then deleted the PlayAgain Button and re-created it by duplicating one of the other buttons since these buttons seem to be working correctly. I then edited this new / duplicated PlayAgain Button’s settings so that it was in the correct location and triggered the correct function. However, doing all this I ran into the same problems again. The PlayAgain button triggered when I clicked on other buttons and when I clicked on some of the other areas of the screen.

So I then deleted the PlayAgain button one more time and re-created the button from scratch rather than duplicating one of the other existing buttons. Same results - the PlayAgain button triggered when I clicked on other buttons and when I clicked on some of the other areas of the screen.

Any thoughts on what else might be the problem?

My next attempt might be to delete the GameOverHandler game object completely and try re-creating the whole thing from scratch.

#6

Here’s something really silly to check… remove the PlayAgain button altogether… Then see if the PlayAgain is triggerred (because at this point, I suspect some other object in the scene is responsible).

#7

Thanks Brian. I just tried that and when I remove the PlayAgain button the PlayAgain function is not triggered.

I also tried deleting the entire GameOverHandler game object and re-creating it step by step. I still got the error with the PlayAgain button.

I also tried making a duplicate of the game project and opening it in Unity version 2022.3.10f1 (I’ve been using 2021.3.14f1) to see if the version of Unity I’m using caused the problem. Unfortunately the problem still existed when I opened it in this new version of Unity.

Last I tried creating a new dummy project in Unity 2021.3.14f1 where I only created the GameOverHandler game object and its canvas, images, buttons, etc. and linked the buttons to dummy algorithms with Debug statements to see what would happen. In this case the bug did not happen.

One of the really weird things is the clickable area is both the button and an area offset to the right plus below the area offset to the right. So you can click the PlayAgain button but not the area immediately to the right or immediately below the PlayAgain button. And then you can click an area offset to the right of the PlayAgian button all the way to the edge of the simulated phone screen and below this offset area. It’s a little hard to explain how the bug works in words, hopefully that makes sense.

I’m going to keep looking around but I am a bit mystified at this point.

#8

Is the image in the PlayAgain button stretched to take up the entire button?

I’m fairly sure it’s not the version of Unity, something in the setup of the menu is the issue… I’m just not sure what it is…

Zip up your project and upload it to https://gdev.tv/projectupload and I’ll take a look. Be sure to remove the Library folder to conserve space.

#9

Thanks. Yes, the image looks like it takes up the entire button to me. I thought maybe there was a setting somewhere that was extending the clickable area or maybe a child object that was causing the problem but as far as I can tell that’s not the case. It is also very odd to me that it’s not one continuous clickable area. Just to the right of the PlayAgain button it works but a little farther right or right and below the error happens.

Another odd thing is sometimes the error doesn’t happen. I’ve been trying to determine if that’s because I clicked on the slightly wrong location or maybe I have to wait a certain amount of time after the menu is displayed but I haven’t been able to determine that yet. The easiest way to see it is to click on the black area below (slightly offset to the right) the Continue and Return To Menu buttons or to the right of them. Since there is no button there but the PlayAgain function still runs that seems to me to be the easiest way to see it.

I look at the console to see the debug statements printing out as I have one in each function related to the buttons (and other functions) in order to see what is executing.

In any event, I uploaded a copy of the project without the Library folder. Thanks for checking it.

#10

Oddly enough, I was unable to duplicate the issue… I can confirm that the menu is created correctly and I couldn’t find any issues in the code, so I’m not sure what’s happening on your end…

#11

Huh, that is perplexing. Maybe it’s just something to do with my computer (an old MacBook Air), operating system (Mac OS 12.7), and/or the way it interacts with Unity’s simulator.

Is there any possibility it is due to not sending you the Library folder? Since Unity rebuilds it, maybe something is wrong with the files in my Library folder for the project and I just need to have Unity rebuild the Library folder?

Also, I just did a video capture of my screen to confirm what I see on my end. Is there a way to send you this video file? It is a .mov file since I recorded it on my Mac. I didn’t see a way to upload a video here. I’d be happy to provide time codes for the movie file to show where I’m seeing the bug.

But if after all that, you still can’t reproduce it on your end then I guess I’ll just chalk it up to one of those weird things that sometimes happens.

#12

That is possible. The solution for that is rather simple, with Unity closed, delete the Library folder. Unity will regenerate it when you re-launch.

There isn’t. Upload the video to YouTube and provide a link to it here.

#13

Looks like it had something to do with the Library folder.

I followed your directions and deleted the folder and then re-opened the project so Unity would rebuild it. Voila, no more error.

Are there any guidelines as to when to try deleting the Library folder to see if that does the trick or is it just something you have to try when/if nothing else seems to be going on?

Thanks for the help.

#14

Think of the Library folder as a cache containing everything in the game (whether it’s in a scene or not) all put together in a handy format for Unity to load as quickly and easily as possible. Unfortunately, if something goes wrong in the Library, Unity doesn’t really KNOW something went wrong in the Library. Deleting the Library folder simply forces Unity to rebuild all of those cached assets.

As a rule of thumb, when you get something that is simply unexplainable (that’s not a code issue), deleting the Library folder is a good step to take.

#15

Great, thanks for the info and help. I really appreciate it.

#16
#17

Privacy & Terms