B4J Question Fit image center imageview

[Douglas Farias]

hi all, how can i fit a image at center of my image view on b4j?
i dont find
dim lala as rect <<

how to convert this code
ImageView Bitmap centered

to b4j to fit the image at center? i need make a crop center at the image

i m loading a image from my pc, the path and file name as in a list, this os working fine, but if the image its horizontal this is very strange

Sub listaimagens_SelectedIndexChanged(Index As Int)
    Log(Index)
    Log(listaimagens.Items.Get(Index))
    Log(File.GetFileParent(listaimagens.Items.Get(Index)))
    Log(File.GetName(listaimagens.Items.Get(Index)))
    imgimagens.PreserveRatio = True
    imgimagens.SetImage(fx.LoadImageSample(File.GetFileParent(listaimagens.Items.Get(Index)), File.GetName(listaimagens.Items.Get(Index)),imgimagens.Width, imgimagens.Height))
End Sub

 

[stevel05]

The code you have linked to Draws on a canvas, you should be able to do the same in B4j using Canvas.DrawImage2

 

[Douglas Farias]

but how to use
Dim rectDest AsRect ?

 

[stevel05]

This might help : www.b4x.com/android/forum/threads/how-to-translate-dim-rectgrid-as-rect-to-b4j.43453/#content

 

[Douglas Farias]

thx @stevel05
i make this

Sub FitCenterBitmap(Imv As ImageView, Dir As String, FileName As String)
    Private bmp As Image = fx.LoadImage(Dir, FileName)
    Private cvs As Canvas
    cvs.Initialize(Imv)
    Dim rectDest As rect
    Dim delta As Int
    If bmp.Width / bmp.Height > Imv.Width / Imv.Height Then
        delta = (Imv.Height - bmp.Height / bmp.Width * Imv.Width) / 2
        rectDest.Initialize
        rectDest.left = 0
        rectDest.top = delta
        rectDest.right = Imv.Width
        rectDest.bottom = Imv.Height - delta
    Else
        delta = (Imv.Width - bmp.Width / bmp.Height * Imv.Height) / 2       
        rectDest.Initialize
        rectDest.left = delta
        rectDest.top = 0
        rectDest.right = Imv.Width - delta
        rectDest.bottom = Imv.Height
       
    End If
    'cvs.DrawImage( )
    cvs.DrawBitmap(bmp, Null, rectDest )
    Imv.Invalidate
End Sub

but i dont understand the
cvs.DrawBitmap(bmp, Null, rectDest )
how to translate this? on the b4j is cvs.DrawImage, and need x, y i dont understand this values

 

[stevel05]

Using DrawImage2 with B4j requires discreet values for the source image and target location instead of a rectangle.

The source values will be from your loaded image (bmp) So : 0,0,bmp.width,bmp.height .

The Destination values are where in the canvas you want to draw it instead of using a rectangle as a target.

    Dim bmp As Image = fx.LoadImage(File.DirAssets,"icon.png")
    Dim Left As Int = (canvas1.Width - bmp.Width) / 2
    Dim Top As Int = (canvas1.Height - bmp.Height) / 2
    canvas1.DrawImage2(bmp,0,0,bmp.Width,bmp.Height,Left,Top,bmp.Width,bmp.Height)

Will draw the icon.png at it's original size in the center of the canvas.

 

[Douglas Farias]

but how to load the image from canvas at the imageview?
i have try this

    Private canvas1 As Canvas
    canvas1.Initialize("canvas")
    Dim bmp As Image = fx.LoadImage(File.GetFileParent(listaimagens.Items.Get(Index)) ,File.GetName(listaimagens.Items.Get(Index)) )
    Dim Left As Int = (canvas1.Width - bmp.Width) / 2
    Dim Top As Int = (canvas1.Height - bmp.Height) / 2
    canvas1.DrawImage2(bmp,0,0,bmp.Width,bmp.Height,Left,Top,bmp.Width,bmp.Height)
    imgimagens.SetImage(canvas1.Snapshot)

but dont work, any error..

in my case, i need to crop center the image on the imageview
i have try
imgimagens.SetImage(canvas1.Snapshot)
canvas1.Snapshot ' as image

 

[stevel05]

The easiest way to do that would be to set the canvas to the size of the target image view, then draw the image on the canvas at the size you want, then just copy the canvas as you already have done:

Dim bmp As Image = fx.LoadImage(File.DirAssets,"icon.png")
    Dim TargetWidth As Int = bmp.Width * 1.5
    Dim TargetHeight As Int = bmp.Height * 1.5
   
    Dim Left As Int = (canvas1.Width - TargetWidth) / 2
    Dim Top As Int = (canvas1.Height - TargetHeight) / 2
    canvas1.DrawImage2(bmp,0,0,bmp.Width,bmp.Height,Left,Top,TargetWidth,TargetHeight)
    imageview1.SetImage(canvas1.Snapshot)

 

[Douglas Farias]

its very strange, the code looks correct but dont show any image on the imageview
and dont show any log error

 

[stevel05]

If you don't want to draw the whole of the source image, you can change the source locations:

    Dim TargetWidth As Int = bmp.Width * 1.5
    Dim TargetHeight As Int = bmp.Height * 1.5
   
    Dim Left As Int = (canvas1.Width - TargetWidth) / 2
    Dim Top As Int = (canvas1.Height - TargetHeight) / 2
    'Reduce the source dimension by 10 all round to get the center of the original image
    canvas1.DrawImage2(bmp,10,10,bmp.Width - 20,bmp.Height - 20,Left,Top,TargetWidth,TargetHeight)
    imageview1.SetImage(canvas1.Snapshot)

 

[Douglas Farias]

i think the canvas1.Snapshot is not working

 

[stevel05]

Try this one

 

[Douglas Farias]

thx man, now this works fine, last question
how to give - zoom? this example give so much zoom at big images, i need to show the complete image at canvas.

look at image 1, is your example result,
look at image 2 is what i need, but dont know explain in english *-*
3 = original file

 

[stevel05]

OK, you want to keep the aspect ratio and draw the new image with the height of the target image view. You'll need to draw a background on the canvas before drawing the image:

Try this: (and file attached)

    Dim bmp As Image = fx.LoadImage(File.DirAssets,"3.jpg")
   
    Dim Ratio As Float = imageview1.Height / bmp.Height
    Dim TargetHeight As Int = imageview1.Height
    Dim TargetWidth As Int = bmp.Width * Ratio
   
    'Draw a background onto the canvas before drawing the image
   
    Dim Left As Int = (canvas1.Width - TargetWidth) / 2
    Dim Top As Int = (canvas1.Height - TargetHeight) / 2
    canvas1.DrawImage2(bmp,0,0,bmp.Width,bmp.Height,Left,Top,TargetWidth,TargetHeight)
    imageview1.SetImage(canvas1.Snapshot)

 

[Douglas Farias]

thank you man, you can post this code on code snippets xD, here works perfect now thx again