Android Question Question about glassmorphism effect

[ZED_App]

Hello everyone, my question is about glassmorphism effect, how can i do it in b4a, thx

 

[Alexander Stolte]

[B4X] BitmapCreator Effects

BitmapCreatorEffects class includes all kinds of very simple to use image effects. The class is cross platform and compatible with B4J (v6.3+), B4A (v8.3+) and B4i (v5.0+). Example: 'Greyscale an image: Dim GreyImage As B4XBitmap = effects.GreyScale(ExistingBmp) 'Blur an image: Dim BlurImage As...

www.b4x.com

 

[William Lancee]

I am not sure of what you want your final result to look like but I would do it in three steps:
1. create a frosted glass overlay
- start with an image that contains the theme you are interested in: field of flowers for example
- apply the artification process: https://www.b4x.com/android/forum/t...ge-creating-an-impressionistic-effect.143149/
2. monochrome the colors and increase its transparency
3. overlay it on your target image

 

[William Lancee]

Correction: You can't get any blur effect by overlaying an image. The original image has to be transformed.
The blur effect example in https://www.b4x.com/android/forum/threads/b4x-bitmapcreator-effects.93608/ as suggested by @Alexander Stolte
is how you should it. You can play with it to suit your needs.

You can also use the artification of the original image. This process removes all detail from the image.
However, it is too time consuming if you need to do it for a series of images on the fly.

 

[ZED_App]

thanx, i am trying to add a blur effect to a panel, like the this attached file :

 

[William Lancee]

Private Sub B4XPage_Created (Root1 As B4XView)
    Root = Root1

    Dim bmeff As BitmapCreatorEffects
    bmeff.Initialize
    
    Dim cv,smallCv As B4XCanvas            'You can also use an ImageView or B4XImageView
    Dim cvrect, smallCvRect As B4XRect

    cv.Initialize(Root)
    cvrect.Initialize(0, 0, Root.Width, Root.Height)
    Dim im As B4XBitmap = xui.LoadBitmapResize(File.DirAssets, "picasso.jpg", cvrect.Width, cvrect.Height, True)
    cv.DrawBitmap(im, cvrect)

    Dim w As Int = 300
    Dim h As Int = 200
    Dim forepanel As B4XView = xui.CreatePanel("")
    forepanel.SetColorAndBorder(xui.color_rgb(220, 220, 255), 2, xui.Color_Black, 5)
    Root.AddView(forepanel, Root.width / 2 - w / 2, Root.Height /2 - h / 2, w, h)
    smallCv.Initialize(forepanel)
    smallCvRect.Initialize(2, 2, forepanel.Width - 2, forepanel.Height - 2)
    
    For i = 0 To 30
        Dim x As Int = 100 + i * 5
        forepanel.SetLayoutAnimated(0, x, x, forepanel.width, forepanel.height)
        Dim sectionPart As B4XBitmap = im.Crop(forepanel.Left, forepanel.Top, forepanel.Width, forepanel.Height)
        Dim blurSection As B4XBitmap = bmeff.Blur(sectionPart)
        smallCv.DrawBitmap(blurSection, smallCvRect)
        Sleep(300)
    Next
End Sub