Android Question ImageView with bitmap & background color?

[Computersmith64]

Based on testing I've done, I think I already know the answer to this - but just in case I've missed something...

I have an image with a transparent background that I want to put in an ImageView & then be able to set different background colors of the view. If I was doing it in Java, apparently the XML for the view would look like this:

<ImageView
layout_width="match_parent"
layout_height="match_parent"
src="@drawable/myImage"
background="@Color/myBgColor"/>

I can't seem to find a way to do this in B4A. I've tried loading the bitmap to ImageView.Bitmap & then setting the ImageView.Background with a ColorDrawable (also tried the other way around), setting a background image with ImageView.SetBackGroundImage, etc... but I can't get the ImageView to show both the image & the background color at the same time - I always end up with one or the other.

Any ideas?

- Colin.

 

[eurojam]

just put a panel with color behind the imageview, see attached testproject

 

[Computersmith64]

just put a panel with color behind the imageview

Thanks @eurojam - I did think of that too, but I was hoping that there was a solution that doesn't involve adding more views (I actually have multiple images that I want to do this with).

- Colin.

 

[eurojam]

let's see, may be the experts will have more ideas...

 

[Cableguy]

The simplest way of achieving that (I don't think that imageview has a background color property) is to use a panel INSTEAD of an image view. That way you can set the panel's background color and then set it's background image. The background color will show through the transparent portions of the image.

 

[Computersmith64]

The simplest way of achieving that (I don't think that imageview has a background color property) is to use a panel INSTEAD of an image view. That way you can set the panel's background color and then set it's background image. The background color will show through the transparent portions of the image.

Yeah - I guess I'll have to stop being lazy & change out the ImageViews for Panels. I was trying to avoid it because it's an old app & has a lot of code around those ImageViews. Hopefully it'll be reasonably straightforward.

The annoying thing is that in Android Studio I can set the ImageView.src property to the image & then the ImageView.background property to a color & it works perfectly - but the B4A ImageView doesn't seem to have an equivalent to the src property (or if it does, it's implemented differently).

- Colin.

 

[Cableguy]

In the code, you "only" need to change the view type definition, thus keeping the naming, and add the necessary properties. This way your code will automatically highlight the "mistypes" and will be easier to correct and alter.

 

[JordiCP]

I've tested it for curiosity. With B4A's Imageview it works strange

The attached project works with ImageViews but need to use JavaObject to achieve the desired result (click on the ImageView)

 

[klaus]

To do what you want you, have two possibilities with B4A standard functions without JordiCps' solution:
As already suggested, a Panel as the background and the ImageView on top.
Or use a canvas like in the routne below:

Private Sub ChangeColor(v As View, Color As Int, Filename As String)
    Private cvs As Canvas
    Private rct As Rect
  
    rct.Initialize(0, 0, v.Width, v.Height)
    cvs.Initialize(v)
  
    cvs.DrawColor(Color)
    cvs.DrawBitmap(LoadBitmap(File.DirAssets, Filename), Null, rct)
    v.Invalidate
End Sub

This works with any view.
I assume that all the image files are in the DirAssets folder.

The solution suggested by Cableguy doesn't work. When you set the set the background image the background color is lost and th etransparent parts of the bitmap show the color of the underlying views.

Attached a small test program.

PS. Didn't think of JordiCps' solution, it came just before I posted mine.
I would prefer his solution, eventhough you need the JavaObject library.

 

[Computersmith64]

Thanks to all of you who made suggestions. In the end I went with a modified version of what @klaus suggested - because I remembered that I need rounded corners (due to the bitmap having rounded corners). Here's what I ended up with:

Private Sub setDieValue(v As View, Color As Int, bmp As Bitmap)
    Private cvs As Canvas
    Private rct As Rect
    Private cd As ColorDrawable

    rct.Initialize(0, 0, v.Width, v.Height)
    cvs.Initialize(v)
    cd.Initialize(Color, 5dip)
    cvs.DrawDrawable(cd, rct)
    cvs.DrawBitmap(bmp, Null, rct)

    v.Invalidate
End Sub

Works perfectly!

- Colin.

 

[Informatix]

You can look also at BetterImageView.