0

I want to create my own control derived from ListBoxItem, in my control there should exist a polygon which will be displayed. The polygon should contain 3 points, so a triangle. This triangle should then be displayed. Since the triangle should exist in ListBoxItem, I have no idea how to display it. And above all, I want several ListBoxItems to be contained in one ListBox, in order to create a 2D field.

How exactly do I make this work, because I'm not that experienced in creating custom controls and would really need your help.

FelixFeuerdorn
  • 25
  • 3
  • 1
    You would not create a derived ListBoxItem, but simply put a Polygon in the ItemTemplate of a ListBox, similar to this: https://stackoverflow.com/a/22325266/1136211. Bind the Points property of the Polygon to a property of the view model item class. You don't need the ItemContainerStyle of that example, but you should use a Canvas as ItemsPanel. – Clemens Apr 11 '23 at 08:30
  • you need to provide some examples on what you already tried and didn't work. – Sigmarod Apr 11 '23 at 08:30
  • @Sigmarod Not necessarily when you do know at all where to start. – Clemens Apr 11 '23 at 08:31
  • @Clemens oh, then it's my bad I thought that this was required. – Sigmarod Apr 11 '23 at 08:49
  • First of all, yes I really didn't know how to even start. Second the suggested example is already a good help, but what if the X and Y coordinates would go over the values range of a data type. At least that's what I would see happening if I were to insert a zoom, for example, and the sizes or positions of the triangles were then changed. I think it's still too early to continue with a zoom directly, but it might become problematic. Or is there a method to zoom without having to adjust the 2D field with position and sizes? – FelixFeuerdorn Apr 11 '23 at 09:01
  • Instead of a Polygon you may have a Path in your ItemTemplate, e.g. as shown [here](https://stackoverflow.com/a/25031206/1136211). You would bind its Data to a Geometry property in your view model item class. The geometry could be scaled and translated by means of its Transform property. – Clemens Apr 11 '23 at 09:39
  • You can handle zoom/pan from the outside, for example by changing the layout or rendering transform properties of one of the containers. You can use the same technique to ensure all your triangles are scaled to values visible on the screen. – JonasH Apr 11 '23 at 09:41
  • Note however that using RenderTransform would visually scale any items, including their potential stroke thickness. Better scale the geometries only. – Clemens Apr 11 '23 at 09:44

1 Answers1

-1

You propably wont need a custom control for custom item templates. Please Check @Clemens answer.#

You would not create a derived ListBoxItem, but simply put a Polygon in the ItemTemplate of a ListBox, similar to this: stackoverflow.com/a/22325266/1136211. Bind the Points property of the Polygon to a property of the view model item class. You don't need the ItemContainerStyle of that example, but you should use a Canvas as ItemsPanel.

If you still want to use a custom control you need to add it to the ItemTemplate mentioned in @Clemens answer: <ItemTemplate><your-custom-control /></ItemTemplate>

If you need more control to the selected item template you may check ItemTemplateSelector (see learn.microsoft.com).

Siround
  • 1
  • 1
  • For the beginning the solution of @Clemens would be enough for me, because I only want to develop my logic internally and display everything only at the edge or primitively. A good user interface I would then probably create rather towards the end of my project, only I wanted to think before how I display that, because I could get problems later if I have not thought through this once before. But your Comment is also helpful I think. Thanks – FelixFeuerdorn Apr 11 '23 at 09:06