Android Question Drawing shape, image and text and save as image

aeric

Expert
Licensed User
Longtime User
I can print text and image with my Bluetooth/USB thermal receipt printer using ESC/POS commands but now I try to print the content rotated 90°.

I think the printer does not support printing as landscape.

What I can think of is to convert all the printing content into an image and print it as image.

Now, I need some examples how to generate the image with shapes like rectangular box, lines, image and text (maybe different size and styles). Then I need to rotate the image and return as bytes to print out.
 

Sagenut

Expert
Licensed User
Longtime User
I can print text and image with my Bluetooth/USB thermal receipt printer using ESC/POS commands but now I try to print the content rotated 90°.

I think the printer does not support printing as landscape.

What I can think of is to convert all the printing content into an image and print it as image.

Now, I need some examples how to generate the image with shapes like rectangular box, lines, image and text (maybe different size and styles). Then I need to rotate the image and return as bytes to print out.
What about creating all what you need inside a transparent panel and then rotating the panel?
It should rotate all the content.
 
Upvote 0

ilan

Expert
Licensed User
Longtime User
Example:

B4X:
Sub Process_Globals
    Private fx As JFX
    Private MainForm As Form
    Private xui As XUI
    Private Button1 As B4XView
    Private Pane1 As B4XView
    Private cnv As B4XCanvas
    Private vpW, vpH As Float
End Sub

Sub AppStart (Form1 As Form, Args() As String)
    MainForm = Form1
    MainForm.RootPane.LoadLayout("Layout1")
    MainForm.Show
    vpW = Pane1.Width
    vpH = Pane1.Height
    cnv.Initialize(Pane1)
    createDrawing
End Sub

Private Sub createDrawing
    cnv.ClearRect(cnv.TargetRect)
    cnv.DrawText("Simple Text",Rnd(vpW*0.1,vpW*0.9),vpH*0.1,xui.CreateDefaultBoldFont(16),xui.Color_Red,"CENTER")
    cnv.DrawTextRotated("This is a rotated Text",Rnd(vpW*0.1,vpW*0.9),vpH*0.2,xui.CreateDefaultFont(18),xui.Color_Green,"CENTER",Rnd(0,359))
    cnv.DrawRect(getRect(vpW*0.4,vpH*0.3,vpW*0.2,vpH*0.2),xui.Color_Blue,True,0)
    cnv.DrawCircle(Rnd(vpW*0.1,vpW*0.9),vpH*0.6,Rnd(20,40),xui.Color_ARGB(Rnd(150,255),Rnd(0,255),Rnd(0,255),Rnd(0,255)),True,1)
    Dim p As B4XPath
    p.Initialize(vpW*0.3,vpH*0.7)
    p.LineTo(vpW*0.6,vpH*0.85)
    p.LineTo(vpW*0.45,vpH*0.9)
    p.LineTo(vpW*0.25,vpH*0.8)
    p.LineTo(vpW*0.3,vpH*0.7)
    cnv.DrawPathRotated(p,xui.Color_Yellow,True,2,Rnd(0,359),vpW/2,vpH*0.8)
    cnv.Invalidate
End Sub

Private Sub getRect(x As Float, y As Float, w As Float, h As Float) As B4XRect
    Dim r As B4XRect
    r.Initialize(x,y,x+w,y+h)
    Return r
End Sub

Sub Button1_Click
    Dim bmp As B4XBitmap = cnv.CreateBitmap.Rotate(0) 'added possibility to rotate the bitmap (you can choose between 0/90/180/270
    Dim out As OutputStream
    out = File.OpenOutput(File.DirApp, "Test.png", False)
    bmp.WriteToStream(out, 100, "PNG")
    out.Close
    xui.MsgboxAsync("File saved successfully!","It Worked")
End Sub

Private Sub Button2_Click
    createDrawing
End Sub

project is included!
 

Attachments

  • cnv.zip
    2.6 KB · Views: 133
Upvote 0

Sagenut

Expert
Licensed User
Longtime User
What about creating all what you need inside a transparent panel and then rotating the panel?
It should rotate all the content.
Or you could leave the panel untouched and just rotate it's snapshot
B4X:
ImageView1.SetBitmap(Panel1.Snapshot.Rotate(90))
 
Upvote 0
Top