Jump to content

[Help] Menu using dxDrawImage


mehmet

Recommended Posts

Hello dudes,

I make a circular menu like in gta 5.  For this I use dxDrawImage,  the menu is divided into 8 pictures.
For effect, I hover to change the picture. 

efed35-20170505160427_1.jpg

But the hover area is big. When an empty place is induced. That changes the picture.
How to fix it? (Sorry for my English)

fix.png

Link to comment
  • Moderators

@mehmet

You can use something like this:

https://wiki.multitheftauto.com/wiki/Math.isPointInPolygon

 

Or calculate the angle + distance from the centre. (this one will give the best result without relying on the browser)

 

Or use the browser + svg.(HTML + SVG knowledge required)

<svg id="Laag_1" data-name="Laag 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500"><defs><style>.cls-1{opacity:0.53;}</style></defs><title>Tekengebied 2</title><path class="cls-1" d="M104.52,305.93a155.81,155.81,0,0,1,.31-114.35L18.44,155.8A249.16,249.16,0,0,0,17.55,342Z"/><path class="cls-1" d="M187.74,392.47a155.86,155.86,0,0,1-80.93-81l-87,36A249.16,249.16,0,0,0,151.57,479.79Z"/><path class="cls-1" d="M107.13,186.05a155.82,155.82,0,0,1,80.92-80.38L152.49,19.82A249.13,249.13,0,0,0,20.77,150.27Z"/><path class="cls-1" d="M158,17.55l35.56,85.84a155.77,155.77,0,0,1,113.78.24l35.51-85.71A249.12,249.12,0,0,0,158,17.55Z"/><path class="cls-1" d="M312.92,105.93a155.78,155.78,0,0,1,80.43,80.36l86-35.64a249.15,249.15,0,0,0-131-130.44Z"/><path class="cls-1" d="M395.65,191.83A155.82,155.82,0,0,1,396,305.68l86.65,35.89a249.08,249.08,0,0,0-.9-185.38Z"/><path class="cls-1" d="M307.69,394.51a155.75,155.75,0,0,1-114.4.25l-36.18,87.32a249.11,249.11,0,0,0,186.7-.37Z"/><path class="cls-1" d="M393.67,311.23a155.82,155.82,0,0,1-80.44,81l36.12,87.18a249.18,249.18,0,0,0,131-132.26Z"/><path d="M28.16,153.33A240.89,240.89,0,0,1,155.55,27.21l-3.06-7.39A249.13,249.13,0,0,0,20.77,150.27Z"/><path d="M158,17.55l3.06,7.39a240.85,240.85,0,0,1,178.72.37l3.07-7.39A249.12,249.12,0,0,0,158,17.55Z"/><path d="M154.63,472.4A240.9,240.9,0,0,1,27.21,344.45l-7.39,3.06A249.16,249.16,0,0,0,151.57,479.79Z"/><path d="M24.94,338.9a240.95,240.95,0,0,1,.89-180l-7.39-3.06A249.16,249.16,0,0,0,17.55,342Z"/><path d="M474.32,159.25a240.93,240.93,0,0,1,.9,179.26l7.39,3.06a249.08,249.08,0,0,0-.9-185.38Z"/><path d="M345.37,27.6A240.87,240.87,0,0,1,472,153.71l7.39-3.06a249.15,249.15,0,0,0-131-130.44Z"/><path d="M340.75,474.32a240.88,240.88,0,0,1-180.57.37l-3.07,7.39a249.11,249.11,0,0,0,186.7-.37Z"/><path d="M473,344.07A240.87,240.87,0,0,1,346.29,472l3.06,7.39a249.18,249.18,0,0,0,131-132.26Z"/></svg>

 

Edited by IIYAMA
Link to comment
13 minutes ago, IIYAMA said:

@mehmet

You can use something like this:

https://wiki.multitheftauto.com/wiki/Math.isPointInPolygon

 

Or calculate the angle + distance from the centre. (this one will give the best result without relying on the browser)

 

Or use the browser + svg.(HTML + SVG knowledge required)


<svg id="Laag_1" data-name="Laag 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500"><defs><style>.cls-1{opacity:0.53;}</style></defs><title>Tekengebied 2</title><path class="cls-1" d="M104.52,305.93a155.81,155.81,0,0,1,.31-114.35L18.44,155.8A249.16,249.16,0,0,0,17.55,342Z"/><path class="cls-1" d="M187.74,392.47a155.86,155.86,0,0,1-80.93-81l-87,36A249.16,249.16,0,0,0,151.57,479.79Z"/><path class="cls-1" d="M107.13,186.05a155.82,155.82,0,0,1,80.92-80.38L152.49,19.82A249.13,249.13,0,0,0,20.77,150.27Z"/><path class="cls-1" d="M158,17.55l35.56,85.84a155.77,155.77,0,0,1,113.78.24l35.51-85.71A249.12,249.12,0,0,0,158,17.55Z"/><path class="cls-1" d="M312.92,105.93a155.78,155.78,0,0,1,80.43,80.36l86-35.64a249.15,249.15,0,0,0-131-130.44Z"/><path class="cls-1" d="M395.65,191.83A155.82,155.82,0,0,1,396,305.68l86.65,35.89a249.08,249.08,0,0,0-.9-185.38Z"/><path class="cls-1" d="M307.69,394.51a155.75,155.75,0,0,1-114.4.25l-36.18,87.32a249.11,249.11,0,0,0,186.7-.37Z"/><path class="cls-1" d="M393.67,311.23a155.82,155.82,0,0,1-80.44,81l36.12,87.18a249.18,249.18,0,0,0,131-132.26Z"/><path d="M28.16,153.33A240.89,240.89,0,0,1,155.55,27.21l-3.06-7.39A249.13,249.13,0,0,0,20.77,150.27Z"/><path d="M158,17.55l3.06,7.39a240.85,240.85,0,0,1,178.72.37l3.07-7.39A249.12,249.12,0,0,0,158,17.55Z"/><path d="M154.63,472.4A240.9,240.9,0,0,1,27.21,344.45l-7.39,3.06A249.16,249.16,0,0,0,151.57,479.79Z"/><path d="M24.94,338.9a240.95,240.95,0,0,1,.89-180l-7.39-3.06A249.16,249.16,0,0,0,17.55,342Z"/><path d="M474.32,159.25a240.93,240.93,0,0,1,.9,179.26l7.39,3.06a249.08,249.08,0,0,0-.9-185.38Z"/><path d="M345.37,27.6A240.87,240.87,0,0,1,472,153.71l7.39-3.06a249.15,249.15,0,0,0-131-130.44Z"/><path d="M340.75,474.32a240.88,240.88,0,0,1-180.57.37l-3.07,7.39a249.11,249.11,0,0,0,186.7-.37Z"/><path d="M473,344.07A240.87,240.87,0,0,1,346.29,472l3.06,7.39a249.18,249.18,0,0,0,131-132.26Z"/></svg>

 

Is this option not easier?

using pixel = dxGetTexturePixels(image) to get the pixel and then dxGetPixelColor(pixel) to get the pixel color, and check if the color isnt white ( aka nothing on it )

Link to comment
  • Moderators
9 minutes ago, mehmet said:

Is this option not easier?

using pixel = dxGetTexturePixels(image) to get the pixel and then dxGetPixelColor(pixel) to get the pixel color, and check if the color isnt white ( aka nothing on it )

  • It doesn't tell you which field you selected.
  • dxGetTexturePixels is a very slow process.(unless it is only done once at the start)

 

But feel free to try it your way. I am interested in what you discover on the way.

Edited by IIYAMA
  • Like 1
Link to comment
  • Moderators
3 minutes ago, mehmet said:

well, I then tried this option. It seems easier to me

https://wiki.multitheftauto.com/wiki/Math.isPointInPolygon

yea that can work. I recommend to open the design in Photoshop/something-similar and get all the positions from there. (you might need to do a little bit of maths afterwards to adjust it to the (possible) responsive layout in game)

Edited by IIYAMA
Link to comment
  • Moderators
21 hours ago, mehmet said:

are there other ways?

There are already 4 ways to do this, is that not enough?

?

A 5e way. Calculate the distance from the center of the image.

A 6e way. Compromise, use a different design that is easier to calculate the button detection.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...