Skip to content

furkankaplan/fk-blur-view-android

Repository files navigation

FKBlurView

If you are familiar with iOS app development, you have used UIVisualEffectView at least one time. iOS SDK has this view for years but unfortunately Android SDK doesn't provide a native solution. This library provides you FKBlurView which is alternative of UIVisualEffectView in iOS. You can use it in everywhere as a background of a dialog view or part of a profile page etc.

How to install?

You can add the library to your project using jitpack.io.

Add the code below to your project's gradle file.

   allprojects {
        repositories {
            jcenter()
            maven { url "https://jitpack.io" }
        }
   }

Add the code below to your app's gradle file.

   dependencies {
        implementation 'com.github.furkankaplan:fk-blur-view-android:1.0.1'
   }

Partial View Usage Screenshot

Popup Window Background Usage Screenshot

How to use?

In this example, you can blur banner_image_view with the FKBlurView.

activity_main.xml

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    
     <ImageView
        android:id="@+id/banner_image_view"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:scaleType="center"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:src="@drawable/profile_picture"/>

    <com.github.furkankaplan.fkblurview.FKBlurView
        android:id="@+id/fkBlurView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="@id/banner_image_view"
        app:layout_constraintStart_toStartOf="@id/banner_image_view"
        app:layout_constraintEnd_toEndOf="@id/banner_image_view"
        app:layout_constraintBottom_toBottomOf="@id/banner_image_view"/>
        
</androidx.constraintlayout.widget.ConstraintLayout>

MainActivity.java

 FKBlurView blurView = findViewById(R.id.fkBlurView);
 // Blur level starts from 1. It's minimum level.
 // Default blurLevel 50 if you don't pass any value. or use blurView.getBlur(this, blurView, 20);
 blurView.getBlur(this, blurView);

Or you can make blur the background of custom Popup Window layout. It's so simple like previous example.

MainActivity.java

LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);

View v = inflater.inflate(R.layout.popup, (ViewGroup) findViewById(R.id.root_fk_blur_view));

FKBlurView popupBlurView = v.findViewById(R.id.root_fk_blur_view);
popupBlurView.setBlurBackground(MainActivity.this, popupBlurView);

final PopupWindow errorPopup = new PopupWindow(v,
        getWindowManager().getDefaultDisplay().getWidth(),
        getWindowManager().getDefaultDisplay().getHeight(), true);

errorPopup.showAtLocation(v, Gravity.CENTER, 0, 0);

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<com.github.furkankaplan.fkblurview.FKBlurView android:id="@+id/root_fk_blur_view"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:text="Here\nyour popup window"
        android:textAlignment="center"
        android:textStyle="bold|italic"
        android:textColor="@android:color/white"
        android:textSize="20dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:gravity="center_horizontal" />
</com.github.furkankaplan.fkblurview.FKBlurView>

You can check it out all previews in example folder.

Author

Furkan Kaplan https://github.com/furkankaplan
Twitter : @furkaplan
LinkedIn : @furkankaplan07
Email : furkankaplan@outlook.com

About

This library provides you FKBlurView which is an alternative of UIVisualEffectView in iOS.

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages