Forum General

BoxView blur

Lost_OliveLost_Olive Member ✭✭

Is there a possibility for me to make my BoxView blur the background image of my app?
Thank you!

Like this


  • Lost_OliveLost_Olive Member ✭✭

    I found this: , but I don't know how to implement this.

  • AnubhavRanjanAnubhavRanjan INXamarin Team Xamurai

    @Lost_Olive Hi, How are you doing? Can you help a bit with the Context as to what you are trying to achieve in here?

  • Lost_OliveLost_Olive Member ✭✭

    @AnubhavRanjan, I want a BoxView on top of my background and I want it to blur the image.

  • Lost_OliveLost_Olive Member ✭✭

    @AnubhavRanjan like the blur background function in Adobe XD.

  • AnubhavRanjanAnubhavRanjan INXamarin Team Xamurai

    @Lost_Olive Have you checked this link:

    Generally, you can use this either in XAML:

    <BoxView x:Name="boxView" ios:VisualElement.BlurEffect="ExtraLight" HeightRequest="300" WidthRequest="300" />

    or in Code behind:

    using Xamarin.Forms.PlatformConfiguration;
    using Xamarin.Forms.PlatformConfiguration.iOSSpecific;

    Can you check if it helps?

  • Lost_OliveLost_Olive Member ✭✭

    @AnubhavRanjan Since I just want to blur part of my background, I've decided to just turn the opacity of the BoxView down a little bit.

  • AnubhavRanjanAnubhavRanjan INXamarin Team Xamurai

    @Lost_Olive That's good. I am guessing for your Card type of Layout, it should fit well into it

  • JonasRembrattJonasRembratt SEUniversity ✭✭✭
    edited October 2020

    I'd like to use the blur effect for overlay purposes but I get absolutely no effect whatsoever.

    Did a quick spike, like so:

    <?xml version="1.0" encoding="utf-8" ?>
    <ContentPage xmlns=""
        <Grid BackgroundColor="Beige">
                Text="Welcome to Xamarin.Forms!" 
                HeightRequest="100" WidthRequest="100"

    Trird it on several generations of iOS/devices (simulators) and also on a physical iPhone 11 but it doesn't work. What happens is:
    1. If I give the BoxView a background color; the BoxView gets displayed at the center of screen, obscuring part of the "Welcome to Xamarin.Forms!" label, as expected. There's no blur effect however. I can see a lighter square at the top left corner though .
    2. If BoxView gets no background color I can see that dim square at the top left corner but no other effect

Sign In or Register to comment.