Draw text on a loaded image/video (canvas)

ThRuST

Well-Known Member
Licensed User
Longtime User
I am working on a photo cam-app and after the image is saved I want to load the image and draw text on it that will be useful for adding info about the image, like webpage or something and then save it as a new file.

The steps need for this is the following:
1.Load an image
2.Draw text on it
3.Save it

I also wonder if this will be possible to apply on a videofile. This will be useful to many out there,
Thank you /Roger
 
Last edited:

ThRuST

Well-Known Member
Licensed User
Longtime User
Hi everone! I solved it myself and publish the solution here in case someone find it useful.
Create a simple layout with a button and an imageview then try this code.
Make sure that test.jpg is located in the phones root folder.

Greetings to Erel for this awesome software. Thumbs up pal.
Cheers from Roger Lindfors (former Blaster of Wrath Designs back in the oldschool days...)


B4X:
Sub Globals
 
     Dim c As Canvas
     Dim b As Bitmap
     Dim t As String
     Dim i As ImageView
     Dim brect As Rect
     Dim tf As Typeface

   Dim Button1 As Button
   Dim ImageView1 As ImageView
  
End Sub

Sub Activity_Create(FirstTime As Boolean)

   Activity.LoadLayout("form1")
   ImageView1.Width = 100%x
   ImageView1.Height = 40%y

End Sub


Sub Button1_Click
  
   i.Initialize("")
  ImageView1.Bitmap = LoadBitmap(File.DirRootExternal, "test.jpg")
  b.Initialize(File.DirRootExternal, "test.jpg")
  brect.Initialize(0,0,ImageView1.Width, ImageView1.Height)
  
  c.Initialize(ImageView1)
  
  c.DrawColor(Colors.White)
  c.DrawBitmap(b, Null, brect)
  c.DrawText("Hello world", 180,ImageView1.Height-40,tf.CreateNew(Typeface.SERIF, Typeface.STYLE_BOLD), 14, Colors.black, "LEFT")
  c.DrawText("Hello world", 177,ImageView1.Height-43,tf.CreateNew(Typeface.SERIF, Typeface.STYLE_BOLD), 14, Colors.White , "LEFT")
  
  i.Invalidate
  
End Sub
 
Last edited:
Upvote 0

Dman

Active Member
Licensed User
Longtime User
Thank you so much for this. I have been trying to figure out how to center justify my text in some spots on my pdf file that I create and this works perfectly. :)
 
Upvote 0

DonManfred

Expert
Licensed User
Longtime User
I want to add a click event to the text, what to do?
You can not add a clickevent to a text written on a canvas. You can use the images click event
 
Upvote 0

herryj

Member
Licensed User
Longtime User
I replace text to image. Though I have a problem on how can I specify the event to that particular image if the imageview I use is only one?
 
Upvote 0

herryj

Member
Licensed User
Longtime User
What I'm trying to create is, when I click the image particularly the shape, a rotated arrow appear. And when I rotate the arrow. the image will also rotate. How can I implement this? Is there any particular library I would used?

Can you suggest, please.
 
Upvote 0
Top