Hello! How to create programmaticaly such graph an...

# compose

[PHondogo]

Hello! How to create programmaticaly such graph and handle tap/drag events on it's vertexes? (Count of vertexes and their titles is planned to pass as argument to composable function).

[dewildte]

I wish I knew!
I am trying to build a custom Layout that does this kinda thing too.

[czuckie]

I think you could do it with Modifier.draggable ?

[czuckie]

I can think of an awful way I could get it to work at least 😂

[PHondogo]

On what element should I use Modifier.draggable then? Firstly i want to find out how to render them, then how to receive events for each vertex separately and after that only handle events.

[czuckie]

my approach would be to create a Box that was the size of the bounds of the graph (e.g. Box(modifier = Modifier.size(200.dp, 200.dp) {}

Then inside that, I'd have each of my vertex (which might even just be a Text with a background.)

I'd set a Modifier.offset on each vertex and also a Modifier.onGlobalLayout... thing, I forget the exact name, but from that, I'll be able to get the position of each node in the box and I'll be able to add a Modifier.drawWithContent {} to the Box which would draw the lines and then the Text composables.

By adding Modifier.draggable to each node (potentially twice for each orientation), I'd update the offsets as a result of the dragging.

[czuckie]

An alternative approach which may be easier after typing that out, would be to 'simply' draw everything yourself and manage touch events from the container instead to figure out if you're hitting a vertex or not.

The only benefit from the former approach is that you could use whatever composable you wanted for the vertices, and you'd get some semblance of accessibility

[Michael Paus]

I guess I have implemented something similar here. I use a graphical model (implemented via the JTS library) which I then use for the creation of the canvas rendering as well as for the evaluation of mouse/touch events.

[PHondogo]

Exactly what i need! Can you share that peace of code that render and evaluate events?

[Michael Paus]

No, that’s buried in a whole mapping framework which I currently cannot share. But if you have a specific question I might be able to help.

[Michael Paus]

The key is to have a geometric model on which you can perform operations like intersection testing and such things. I have chosen JTS because it is very popular in the GIS world. https://github.com/locationtech/jts

[PHondogo]

Thanks, Michael! I'll try with it.

[Michael Paus]

This is however based on Java (I use it on desktop as well as on Android) but it is not cross-platform. There is however a C++ clone too which could be used via cinterop. https://www.osgeo.org/projects/geos/