HateDread
Topic Author
Posts: 74
Joined: 06 Feb 2020, 10:27

Suggestions for click-and-drag?

18 Oct 2023, 15:19

I have some "orders" in a strategy game sense, in this case for object movement, with a UI representation of the start and end nodes of a "maneuver spline". (Pretend "FixThisName" says "Movement Order" or something, and the red circle is a status indicator we can ignore. The two white circles are the start/end nodes representing a potential movement order/maneuver that would diverge the object from the current path "green" to its potential path "red". We want to use the click-and-drag to modify that red spline).

Image

I would like to be able to click and drag the "end" spline node in Noesis and somehow get that back into my game/model. In the model, these orders are projected from world space to UI and those values are pushed into the order view models.

What isn't clear to me, from a design/arch point of view, is how one should go back the other way, as well as the intricacies of capturing the mouse input and using it to drive the click-and-drag. If my cursor is outside of a UI element, it is skipped over by the Noesis layer and the input hits the game/world layer instead.

Do you have any suggestions or advice for converting what is a fairly simple UI element in Noesis driven by a model projecting positions into UI space, into the same but with the ability to click-and-drag on the UI side to feed back in to the model? I figured I'd put an invisible button to capture input on click, and somehow get the mouse/input data but I've got no idea on that. I guess I could, if knowing I'm attempting the click-and-drag movement, get the cursor pos and deproject into the world, then use that to drive the model, which would lead to that change going back into the UI the same way it does now.

Thanks!
 
User avatar
sfernandez
Site Admin
Posts: 3364
Joined: 22 Dec 2011, 19:20

Re: Suggestions for click-and-drag?

19 Oct 2023, 11:49

Hi,

The end node template can have a behavior that listens to mouse down event, capture the mouse and hook to mouse move event to calculate the new node position.
The behavior can expose a command property that you can bind to your viewmodel to update the viewmodel position:
<DataTemplate x:Key="DraggableNodeTemplate">
  <Ellipse Stroke="#80FFFFFF" Fill="Transparent">
    <b:Interaction.Behaviors>
      <local:DragNodeBehavior UpdatePositionCommand="{Binding UpdatePosition}"/>
    </b:Interaction.Behaviors>
  </Ellipse>
</DataTemplate>
Do you think this could work for you?

Who is online

Users browsing this forum: No registered users and 2 guests