I followed the instructions given in this awesome blog article to blurr an image from within my .NET MAUI app on both iOS and Android:
However, the results differ extremely on both platforms. I like the results on my iPhone, but I am disappointed by the blurred image on my Android.
Looking at the implementation used for both platforms, is there anything, you could suggest to alter the Android code so that it looks more like the image on the iPhone?
| iOS Version | Android Version |
|---|---|
 |  |
This is the content of my MainPage.xaml file:
<Grid> <Image Source="c64.png" Aspect="Center"> <Image.Behaviors> <blur:BlurBehavior Radius="66" /> </Image.Behaviors> </Image> <Grid> <Image VerticalOptions="Start" Margin="0,100,0,0" Source="c64.png" HeightRequest="300" WidthRequest="300"> <Image.Clip> <RoundRectangleGeometry CornerRadius="20" Rect="0,0,300,300" /> </Image.Clip> <Image.Shadow> <Shadow Brush="Black" Offset="0,0" Radius="20" Opacity="0.5" /> </Image.Shadow> </Image> </Grid> </Grid> The relevant code snippet responsible for rendering the blurred image on Android looks like this:
void SetRendererEffect(ImageView imageView, float radius) { if (OperatingSystem.IsAndroidVersionAtLeast(31)) { var renderEffect = radius > 0 ? GetEffect(radius) : null; imageView.SetRenderEffect(renderEffect); } } static RenderEffect? GetEffect(float radius) { return OperatingSystem.IsAndroidVersionAtLeast(31) ? RenderEffect.CreateBlurEffect(radius, radius, Shader.TileMode.Decal!) : null; } The respective code for rendering the blurred image on iOS looks like this:
void SetRendererEffect(UIImageView imageView, float radius) { if (originalImage is null) { return; } var myContext = CIContext.Create(); var inputImage = new CIImage(originalImage); var filter = new CIGaussianBlur { InputImage = inputImage, Radius = radius }; var resultImage = myContext.CreateCGImage(filter.OutputImage!, inputImage.Extent); SetImage(imageView, resultImage); } 
CreateBlurEffectto see if you can get them to more closely match iOS?