Wish [B4X][XUI]B4XCanvas.DrawPath behave differently in B4A and B4J

[klaus]

Hi Erel.

B4XCanvas.DrawPath behave differently in B4A and B4J with Filled = False.
I haven't tested it ib B4i.

In B4A the Stroke is drawn on the path.

In B4J the Stroke is drawn insides the path.

Wish: same behaviour in all three products.

An image developped with B4J.

Looks quite different in B4A, with the same code!

Very annoying.

The code for the rounded rectangle example (cvsAct is a B4XCanvas):

Private pthTest As B4XPath
Private rctTest As B4XRect
rctTest.Initialize(10dip, 450dip, 310dip, 500dip)
pthTest.InitializeRoundedRect(rctTest, 20dip)
cvsAct.Initialize(MainForm.RootPane)
cvsAct.DrawPath(pthTest, xui.Color_Blue, False, 9dip)
cvsAct.DrawPath(pthTest, xui.Color_Red, False, 2dip)

 

[Erel]

B4XCanvas.DrawPath behave differently in B4A and B4J with Filled = False.
I haven't tested it ib B4i.

This is a known technical limitation: https://www.b4x.com/android/help/xui.html#b4xcanvas_drawpath

A possible solution is to use BitmapCreator instead of Canvas.
It will look exactly the same on the three platforms:

Class code to create a progress bar with gradient fill:

Sub Class_Globals
   Private xui As XUI
   Private mImageView As B4XView
   Private InteriorBrush As BCBrush
   Private bc As BitmapCreator
   Private CornerRadius As Int = 19
   Private TransparentBrush As BCBrush
   Private BorderBrush As BCBrush
End Sub

Public Sub Initialize (ImageView1 As B4XView)
   bc.Initialize(ImageView1.Width / xui.Scale, ImageView1.Height / xui.Scale)
   bc.FillGradient(Array As Int(0xFF98FF74, 0xFF2FB800), bc.TargetRect, "LEFT_RIGHT")
   Dim g As BitmapCreator
   g.Initialize(bc.mWidth, bc.mHeight)
   g.DrawRectRounded2(g.TargetRect, bc.CreateBrushFromBitmapCreator(bc), True, 0, CornerRadius)
   InteriorBrush = g.CreateBrushFromBitmapCreator(g)
   mImageView = ImageView1
   TransparentBrush = g.CreateBrushFromColor(xui.Color_Transparent)
   BorderBrush = g.CreateBrushFromColor(0xFF036A00)
End Sub

Public Sub Draw (Progress As Int)
   bc.DrawRect2(bc.TargetRect, TransparentBrush, True, 0)
   Dim r As B4XRect
   r.Initialize(0, 0, bc.mWidth * Progress / 100, bc.mHeight)
   bc.DrawRect2(r, InteriorBrush, True, 0)
   bc.DrawRectRounded2(bc.TargetRect,BorderBrush , False, 5, CornerRadius)
   bc.SetBitmapToImageView(bc.Bitmap, mImageView)
End Sub

Note that you might see a small issue with the bottom border where it is one pixel thinner than it should be. This is fixed in BitmapCreator v4.70 that will be released later today.