Two days ago I decided to do something cool! Let’s build up a Docking System for my GUI! A Docking System you say? What do you meeeeeean? Well … imagine I wana design the game interface for the user and wana dock some menu components for the health, skills and the other crap … I don’t wana assign fixed values to the component based on the screen resolution! That would be madness! I wana make a way to make the engine be capable of docking the menus to the edge of the screen, I won’t make it as sophisticated as visual studio one which have some docking area and each area can be docked on different angles, I wana a simple one, a one that I can dock my menus to the edge of the screens on a specific angle.
I told myself: that would be easy! All what I need is an interface that mark the menus as Docking ones and two angles! One angle for the screen and the other for the menu itself! So if I say I wana dock the menu to the top middle and I want the menu to be hanged from its top middle too than both angles would be 90 degree! Unfortunately the equation wasn’t that … smooth … you can watch the video on YouTube for more details
Even though it is weekend I still don’t like how I ended my work without being able to solve the equation for the docking system. There were few variables but a lot of casting and shifting which made it a bit confusing, if my head was clearer … that’s what I thought that’s why I decided instead of feeling sad not finishing it at Thursday I will give it a try on my weekend, unfortunately I don’t what happen but I slept all my Friday out … not all but most, I woke up around 8PM …
Today was a I different story, I enjoyed myself playing few hours than took a nap, woke up and took a good look at the mirror … it is time, it is time to give it another try, so first I decided to solve the first angle problem which point out where the menu should be on the screen, to do that obviously I disabled the values for the menu shift, another thing I done to make the test valid is I wana see the menu so I decreased the amount that I shift the menu on the angle, because if I say I wana put the menu on the top right corner of the screen from the top right corner of the menu it will go outside of the screen, so in the calculation I divided the width & height of the screen by 4 (it was 2 because I needed them as radius for the triangle calculations). Now I can see the menu wherever I dock it! the problem was clearer when I checked each area alone, I needed a third condition to add the screen height when I move the menu to the lower part of the screen (from angle 270 to 315 which mean Area 3) so I was a bit lazy and added that value as a condition
And it worked like magic! I found the x-Axis has same problem so I added a similar code to there but it affect in Area 1.
Now the Screen angle setting is working I need to check the menu angle. The problem wasn’t that obvious it was fluctuating only in one Area for each axis, after few tests and checking the code I noticed a very stupid problem in this part of code … can you tell what is it? You should know if you were following or familiar with Cos in C# or other languages
Gave up? Well … I forgot to convert it into radian <_<;
It took me a lot of looks on screen and on the code, around 40 mins before I could catch it, it was sad but better then leaving it there. After that it was damn hard to find out what values the coordinate shift should it be, if you remember from the drawing I need to shift the angle by 45 and do some area restrictions and stuff, so I was like almost the F-Word attitude so I took a break for few minutes then decided to take the result values output for every 10 degrees and compare them with the correct values
@ 350 : SDX= -440 , SDY = -393
@ 360 : SDX= -440 , SDY = -339
@ 0 : SDX= -440 , SDY = -339
@ 10 : SDX= -440 , SDY = -275
@ 20 : SDX= -440 , SDY = -202
It was like this but for all x10 degrees and the special cases (45, 135, 270, 315) after looking at them I found the areas that screwed up and tried to fix them, it wasn’t a short mircle but it helped a lot to find where the areas are screwed up and which axis is behaving in a stupid way, the interesting part is in this section when I tried to solve the problem I ignored completely the visual results (the game screen) I only dealt with the numbers and after I finished correcting them and run the game and watched the visual results they were correct! When I streamed the mess two days ago I tried only to use the visual results maybe because the viewers would do that too, when I tried to solve it without a stream I was much calmer and thought about me and the problem not what the viewers think.