ImageView images fit problem

brainfart

Member
Licensed User
Longtime User
Hello group.:sign0085:
I am building an home automation app and one of the features is screen saver / picture frame mode when user is not interacting with the screen for a while.
The idea is that user (me) is going to periodically load images (possibly formatted to specific size/resolution) onto SD or network location.
When no activity is detected, new activity starts and loads a layout that is made out of ImageView only and pictures slowly load and or transition.

Problem is picture fitting.
I have made the activity to be full screen no title 800x480
Image View is also set 800x480.
I formatted some pictures (*.jpg) to be 800x480 as well as 640x480 just to see how they will show up.
I have tried gravity setting to Center, Fill, and Top Left.
All with the same result, meaning that pictures are always "larger than scree" in other words cropped.
They are formatted to be equal or smaller (640x480) but still large portions close to 20% of height and width are chopped.
I would prefer not to have to format the pictures but just have the application / view to fit the larger dimension into the screen so that any picture you throw at it would display in its entirety even if it means black bars on sides or top / bottom.

Is it possible and what am I doing wrong.
Tried it on real device (Galaxy S) and Emulator with same results.

Thank you,

M.
 

derez

Expert
Licensed User
Longtime User
To see your exact problem you need to provide the specific code you use.
Anyway - I would load the picture to a bitmap (initializing the bitmap to the picture file), and then use a canvas which is initialized to the imageview, to draw the bitmap on the imageview.
This way you will be able to control the size, as drawbitmap requires you to define the source and destination rectangles, so check the size of your bitmap, define the source as the bitmap size and the destination to fit as you wish.
If the pictures are very big you can use bitmap.initializesample for a smaller bitmap and then continue as above.
 
Upvote 0

brainfart

Member
Licensed User
Longtime User
Thank you derez.
Still have a problem understanding this.
Why is an image that is formatted to be 800x480 zoomed in about 15-20%
when loaded even in the designer before any code is loaded. Gravity set to fill works and entire image is presented but distorts images that are 640x480.
Again, my phisical device screen is 800x480, image view is 800x480 gravity center (anything other than fill to be exact), application set to full screen, in the designer you can see the ImageView1 outline (red squares) fitting exactly into the screen yet when selecting image (in the designer) ImageView property "image file:" the resulting displayed image extends beyond the screen borders about 15-20%
Obviously some scaling / zooming is going on.
Even pictures that are 640x480 that should fill the height of the screen exactly and have empty space on both sides (800- 640 = 160 pixels) but are not. The top and bottom of such file is also cut off like it is zoomed in.
Any one could try it without any code just the designer.
Seems like a bug but I don't want to offend anyone in case I am just slow.:sign0013:
If I get this to behave normally then I will try to understand and implement your method of rectangles to handle images larger than screen size.

Here is my code but even without code you can observe this behavior in the designer by assigning files directly and looking at the device for result.

Sub Globals
'These global variables will be redeclared each time the activity is created.
'These variables can only be accessed from this module.
Dim ImageView1 As ImageView
Dim i As Int
i = 0
End Sub

Sub Activity_Create(FirstTime As Boolean)
Activity.LoadLayout("SlideShow") 'Load the layout file.
End Sub

Sub Activity_Resume
'ImageView1.Initialize("ImageView1")
ImageView1.Enabled = True
ImageView1.Visible = True
ImageView1.Bitmap =LoadBitmap(File.DirAssets, "10.jpg")
ImageView1.Gravity = Gravity.center
End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub

Sub ImageView1_Click
i = i +1
If i > 4 Then i = 0
Dim p_num As String
p_num = "1" & i & ".jpg"
ImageView1.Bitmap = LoadBitmap(File.DirAssets, p_num)
ImageView1.Gravity = Gravity.CENTER
End Sub
Sub ImageView1_LongClick
Activity.Finish
End Sub
 
Upvote 0

brainfart

Member
Licensed User
Longtime User
Thanks Erel and yes it says 800x480
It says that in multiple places like on the designer under "Device details" and using the Log that you suggested.
Also I observe the same behavior in an emulator (800x480, scale = 1.5 (240dpi))
And also the ImageView that is set to be 800x480 fits exactly into the screen while running a designer.
Make it 790 wide and you can see the border moving in.
What is the scaling do? In the device setup / variant setup.
Does it have any thing to do with it?
That would not make sense dough because the ImageView does look like it fits exactly into the screen as I mentioned above.
I also tried different file format like *.png etc to no avail.

Thanks for being patient with me. I would like to get this solved.
I am puzzled.
:BangHead:
 
Upvote 0

brainfart

Member
Licensed User
Longtime User
Erel,
I did what you suggested and still have the same problem.
About 0.66 of 800x480 image is displayed suggesting to me that it is related to the 1.5 scale that I see in "Device details" in the designer.
I started to experiment to see if I could setup an emulator to identify it self as 800x480 scale 1.0 so while launching it i selected "scale display to real size", adjusted the size to get the desired scale of 1.0 (in this case 10" at 93dpi, see attached dialog capture) and created variant with scale of 1.0.
The emulator density was set to 160.
It worked. 100% of the image is showing.

I can't do the same with real device. It identifies it self as 800x480 scale 1.5 density 240.

As soon as I connect the designer, the ImageView boundary is showing correctly (meaning the red box outline) but the loaded picture behind it is scaled up by 1.5 thus showing about 66% in x and y.

Can someone explain to me how is the scale affect things. I have no control over scale or density reported by physical device.
Looks like the views are properly resizing according to scale but loaded picture is not.
Example: Device (emulator or physical) is 800x480 scale 1.5, Variant is 800x480 scale 1.5, ImageView is set to 800x480 and fills the screen exactly (see the red corner marks)
Then you load a formatted picture (800x480) and only 0.66 of it is showing.
(See screen capture of emulator. Same look as Galaxy S)
Thank you
 
Upvote 0

myriaddev

Active Member
Licensed User
Longtime User
WebView seems to have same behavior

Maybe this will help. I used Msgbox(GetDeviceLayoutValues,"File.GetDeviceLayoutValues")
and got 600 x 1024, Scale = 1.5(240 dpi) for my Galaxy Tab
v2.2.1. Used designer, and made a WebView using full use
of my screen on my Device. I made a web page 600 x 600
with a web designer, and it works on several browsers and also as WebViewActivity.regURL = "file:///" & File.DirDefaultExternal &
"/index.html". Loads and displays ok but see about 66 % and
scrolling allows one to see the rest. I must pinch it to make it fit. I just noticed that B4A's Designer stated that WebView
was 400 wide, NOT 600 wide! I will make a new webpage 400
units wide and report back.
Thanks, Jerry
 
Last edited:
Upvote 0

myriaddev

Active Member
Licensed User
Longtime User
Results

Hi. I made a 400x600 web page and yes it fit using WebView.
I tried DB HTML Viewer on my Android and it fit, but HTML Viewer
on my Android had my page off to the right a little. I did use
two pics (jpg 401 x 159) and (png 400 x 59) in my web page.
So much to learn, but the help is great!

Q. Why 400 useable vs 600 in WebView ?
Help, Jerry

P.S. I hope these ideas were ok to add to this thread ?
 
Upvote 0
Top