Android Question Canvas draw position, how to align?

Sub7 · Sep 20, 2014

Hello, i'm looking for some tutorial or advice on how work with views added from code, most times i use the designer and designer script to build the layout so i never had big problems.
Now that i need to use a canvas i'm having some good troubles to align and set the position of the drawed text correctly.
For example i added an imagview using the designer and then set his position and properties with designer script.
Later using the below code i want draw some text over imageview1 in a exact position which will be the same in all screeens.

Which is the best pratice to achieve this? im getting really lost with X and Y.

The imageview is a template file of a business card, the user can input some text and save the output.

B4X:

Dim cnv1
cnv1.initialize(imageView1)
cnv1.DrawTextRotated("Text 1",250,270, Typeface.MONOSPACE,12,Colors.White,"RIGHT",4)
cnv1.DrawTextRotated("Text 2",???,???, Typeface.MONOSPACE,12,Colors.White,"RIGHT",4)
activity.invalidate

Thank you so much

Chandrashekhar · Sep 20, 2014

Hi , may this code will help.

sorex · Sep 20, 2014

I guess the easiest method is to always draw to the same location but just reposition the imageview that holds the canvas.

Sub7 · Sep 20, 2014

sorex said:
I guess the easiest method is to always draw to the same location but just reposition the imageview that holds the canvas.

Hello i have a buch of views this will screw up everything i guess!

sorex · Sep 20, 2014

well, I don't know what exactly you're trying to do so it's hard to guess

Sub7 · Sep 20, 2014

Sorry,
i have several view in one activity, im trying tro drawText over one of them, i need to find a way so that the text get draw always in the same position on different devices.

klaus · Sep 20, 2014

cnv1.DrawTextRotated("Text 1",250,270, Typeface.
In this line:
First point:
You should use dip values and not absolute pixel values.
Second point:
Are 250,270 screen coordinates or ImageView coordiates ?
If you draw on a view the coordinates are relative to the upper left corner of this view and not to the Activity !

Or post your project as a zip file or at leat a smaller one showing the problem so we could have a look at it.

sorex · Sep 20, 2014

if it is an imageview you can draw on top of it.

if not you can

put an imageview on top of if based on .top & .left from the other view

or

put that view in a panel and put an imageview at the same offset .top=0 .left=0 then it's always at the same spot.

Sub7 · Sep 20, 2014

Sorry for not beeing clear, in attachment an example.
I need that the draw text alway fit inside the imageview in a fixed position and works on different screens, in the example i draw the text over the red panel because i dont know ho to align over on the imageview, or better, by messing with values i can align the text but then on different screen size it get messed up.

ty

sorex · Sep 20, 2014

why don't you use labels instead of drawing text ?

Sub7 · Sep 20, 2014

sorex said:
why don't you use labels instead of drawing text ?

Because i need rotated text :|

sorex · Sep 20, 2014

I see, it's rotated text in post #1 but not in the file.

Sub7 · Sep 20, 2014

sorex said:
I see, it's rotated text in post #1 but not in the file.

Yes pardon me, that was just for example the text rotation of 4 degrees but that's not a problem, if it was straight i'd use labels.

sorex · Sep 20, 2014

B4X:

cnv.Initialize(ImageView1)

is the way to go then you draw inside the picture.

sorex · Sep 20, 2014

if you draw the green lines by code you have more control over it since you can calculate the gaps etc...

Sub7 · Sep 20, 2014

sorex said:
if you draw the green lines by code you have more control over it since you can calculate the gaps etc...

That was just as example, the file loaded inside the imagewview is more complex, is a business card with logos and stuff.
I think the problem is here: "If you draw on a view the coordinates are relative to the upper left corner of this view and not to the Activity !"

So i have tried:

B4X:

cnv1.DrawTextRotated("Test row",10dip,250, Typeface.MONOSPACE,12,Colors.White,"LEFT", 4)

which looks okay in my phone, not okay in other phones.

dunno.

Sub7 · Sep 20, 2014

This almost works

B4X:

cnv1.DrawTextRotated("ROW 1",10%x,ImageView1.Top, Typeface.MONOSPACE,12,Colors.White,"LEFT", 4)
cnv1.DrawTextRotated("ROW 2",10%x,ImageView1.Top + 20dip, Typeface.MONOSPACE,12,Colors.White,"LEFT",4)
cnv1.DrawTextRotated("ROW 3",10%x,ImageView1.Top + 30dip, Typeface.MONOSPACE,12,Colors.White,"LEFT",4)

sorex · Sep 20, 2014

in fact, the code could always be the same even without the use of percentages.

just draw it on the original size and then resize to what it needs to be, I made a sliding puzzle that way and it worked fine on both my phone and tablet with completely different resolutions and aspect ratios.

Sub7 · Sep 20, 2014

Without percentages i get everything screwed up on both devices (phone/tablet), even the last code does not works perfectly, the position on the two devices is similar but different.

sorex · Sep 20, 2014

that's because 10% is not right. you should calculate that value based on the screen size and the original size of your object.

Android Question Canvas draw position, how to align?

Active Member

Member

Expert

Active Member

Expert

Active Member

Expert

Expert

Active Member

Attachments

Expert

Active Member

Expert

Active Member

Expert

Expert

Active Member

Active Member

Expert

Active Member

Expert

Similar Threads

Privacy & Transparency

Privacy & Transparency