Android Question Best way to "mix" views and lines/circles, etc.

[KMatle]

In some apps you see lines which "connect" e.g. labels, in a chat app there's a small triangle/pointer which is hooked to the bubble with the text. Others use other geometric forms so there's a mix of views and e.g. lines or so.

What is the best way to achieve such UIs?

 

[klaus]

If you speak only of Labels, meaning only display text without editing, I would do everything with graphics.
DrawLine, DrawText, DrawPath, DrawCircle etc.

 

[LucaMs]

in a chat app there's a small triangle/pointer which is hooked to the bubble with the text.

Do you mean something similar to flow charts designers?

 

[KMatle]

Here some examples. Of course I could get some bitmaps for the bubbles and place a label inside it or I can draw everything but I'm interested in the best practice.

I would do everything with graphics.
DrawLine, DrawText, DrawPath, DrawCircle etc.

As you see it's a mix (at least I assume that or it's really just a bitmap with a label in it) between grafics and (maybe) labels or just graphics. Take a look at the bubble. I've marked that "arrow" (don't know the word for it). A label with round coners is easy, but how is this done? A label for the text and some drawing arround it to create the bubble?

But how do we do it when it comes to views which need to be dragged for example? Or do you just draw/refresh everything then? Are the arrows just drawn and everything is refreshed when something changes?

Example:

 

[klaus]

It may depend on what kind of 'views' or diagrams you want to create.
The first example could be made with Ninepatch background.
I would make the Events Timeline with graphics.
The Flowchart would be a project on its own, with classes for different objects with connection points, connection lines etc. similar to a drawing program, but still with graphics.
But, that's just my opinion.

 

[MarkusR]

i think each element in flowchart is a object(class/customcontrol) within a rectangle area and it paint itself if needed. like a usercontrol in vb6.
each need a position,size,typ,sort order
a state visible,enabled,focus,selected
& ability to move & text change via input
if you think about painting only i would put all (objects) into a list so
you can use for each to draw all into a panel or testing click inside.

i made an example of drawing a speak bubble into a panel.