Click here to Skip to main content
15,927,127 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I've created a hex map that consists of child elements drawn to a canvas. Each hex map is a location within the game I'm coding. My design philosophy is to instantiate a collection of GameHex class from the game database and use that collection to draw the map at runtime. I have achieved that by creating polygons and adding them to the canvas. So far, so good. However, I want to add extra information to each hex such as hex number and icons for bases. I know I can draw additional elements and add them to the canvas in the correct location and link them in the code but the redraw action for each hex would involve finding each UI element deleting it and redrawing it individually. Is there a better design philosophy that I can adopt to link the UI Elements into a single entity on the canvas that I can then manipulate in code?

What I have tried:

I appreciate that I will need to individually redraw the elements but, for example, should I use a separate canvas instantiated at run time to draw the hex components onto and then add to the main canvas at runtime or will this cause other issues such as detecting which hex has a mouse click action? Any steers would be gratefully appreciated.
Posted
Updated 17-May-21 9:16am

1 solution

Make each hex a user control (UC). You can shadow them with a dictionary as you add them to your games's visual tree (a parent grid for chess / checkers / Go / Doom ... a canvas for ?)

You can add overlays such as shapes, images and text to the UC's that you can toggle on or off at run time; including debug info. And the UC can respond to mouse clicks, etc.

A grid cell can hold multiple UI elements; that's how you put text over shapes; or smaller shapes over larger shapes. You center using the alignment properties, and vary opacity. You can rotate / transform within the UC.

I've created a few thousand UC's at run time and never had any performance issues.

The creating (load dictionary; load visual tree) can be done async as the game / app is loading if need be.
 
Share this answer
 
v2
Comments
Welchbloke 17-May-21 15:32pm    
That's really helpful, thank you. Never used UCs before, time to do some research.
[no name] 18-May-21 15:44pm    
You're welcome!

(and you can put a canvas inside a grid's cell too - for your polygon)

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900