How to draw a "risen" rectangle?

#1

Hi,

Does anyone know how to draw a “risen” rectangle with DC class, which looks like an “unpushed” button?

#2

I assume you want some 3D look.

From looking closely, you should get the idea: https://github.com/wxGlade/wxGlade/blob/55b0d9072135b8ea6edabd2f05c9f137a01bc37e/icons/button.png
The lighting is from top left. Therefore the top and left walls are drawn as lighter borders and the bottom and right walls are drawn as darker borders.
With a DC you would draw four trapezoids instead of the single pixel borders.

1 Like
#3

Hi,

Thanks. So, I have to draw 4 trapezoids for the edges and 1 rectangle in the middle? Is there a function to draw a trapezoid?

Thanks.
Best Regards

#4

DrawPolygon should do the job. Probably it looks best if you draw filled polygons with black or dark grey lines.

1 Like
#5

Hi Dietmar,

I couldn’t understand the button in that link you provided. Exactly how many trapezoids are used while drawing that button? I counted 6 trapezoids, but I couldn’t be sure.

#6

To visualize either:

  • draw two nested rectangles and connect the four pairs of corners
  • draw a rectangle and four trapezoids around it
1 Like
#7

The classical unpushed button in high resolution looks somewhat like this:
grafik

On the desktops the lighter and darker borders were only drawn two pixel wide.
For the pushed version, swap the lighter and the darker shades.

Nowadays most toolkits use flat buttons.

Not sure, whether you could license and include buttons like these: Neumorphic Interface Gui Design Elemente Stock Vektor Art und mehr Bilder von Bedienungsknopf - Bedienungsknopf, Dreidimensional, Graphische Benutzeroberfläche - iStock
They are sold as EPS, but you probably could only use them in wx by painting rendered bitmaps.

1 Like