Open Peterragheb opened 5 years ago
I am using the blurview inside a framelayout and a progressbar on top of it.
For some reason the green button behind the blurview is showing like that and there is a white distorted rectangle forming around the progress bar
The radius I'm using is 20 (and the problem isn't affected by changing the radius.
Post your layout and what you're passing as a root view to the BlurView
<layout 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">
<data>
<variable
name="viewmodel"
type="com.Views.Login.LoginViewModel" />
</data>
<FrameLayout
android:id="@+id/fl_rootContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true"
android:fitsSystemWindows="true"
android:layoutDirection="rtl">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="0.07"
android:scaleType="centerCrop"
android:src="@drawable/pattern_5" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scaleType="center"
android:src="@drawable/logo_on_white_3" />
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.25" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/sign_in_handler_activity_phone_image_view_margin_end"
android:layout_marginEnd="@dimen/sign_in_handler_activity_mobile_text_field_edit_text_margin_start"
android:orientation="horizontal">
<ImageView
android:id="@+id/iv_phone"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_gravity="center"
android:scaleType="center"
android:src="@drawable/phone" />
<com.Utilities.Validation.ValidationEditText
android:id="@+id/et_phoneNumber"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/sign_in_handler_activity_mobile_text_field_edit_text_margin_end"
android:fontFamily="@font/font_cairo_regular"
android:gravity="start|center_vertical"
android:hint="@string/sign_in_handler_activity_mobile_text_field_edit_text_hint"
android:imeOptions="actionNext"
android:inputType="phone"
android:maxLines="1"
android:textAlignment="viewStart"
android:textColor="@color/sign_in_handler_activity_mobile_text_field_edit_text_text_color"
android:textColorHint="@color/default_hint"
android:textSize="@dimen/sign_in_handler_activity_mobile_text_field_edit_text_text_size" />
</LinearLayout>
<TextView
android:id="@+id/tv_phoneNumberError"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="66dp"
android:layout_marginEnd="@dimen/sign_in_handler_activity_mobile_text_field_edit_text_margin_start"
android:text="@{viewmodel.errorPhoneNumber}"
android:textColor="#ff0000" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/sign_in_handler_activity_phone_image_view_margin_end"
android:layout_marginTop="10dp"
android:layout_marginEnd="@dimen/sign_in_handler_activity_mobile_text_field_edit_text_margin_start"
android:orientation="horizontal">
<ImageView
android:id="@+id/iv_password"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_gravity="center"
android:scaleType="center"
android:src="@drawable/lock" />
<com.Validation.ValidationEditText
android:id="@+id/et_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/sign_in_handler_activity_mobile_text_field_edit_text_margin_end"
android:fontFamily="@font/font_cairo_regular"
android:gravity="start|center_vertical"
android:hint="@string/sign_in_handler_activity_password_text_field_edit_text_hint"
android:imeOptions="actionDone"
android:inputType="textPassword"
android:maxLines="1"
android:textAlignment="viewStart"
android:textColor="@color/sign_in_handler_activity_password_text_field_edit_text_text_color"
android:textColorHint="@color/default_hint"
android:textSize="@dimen/sign_in_handler_activity_password_text_field_edit_text_text_size" />
</LinearLayout>
<TextView
android:id="@+id/tv_passwordError"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="66dp"
android:layout_marginEnd="@dimen/sign_in_handler_activity_mobile_text_field_edit_text_margin_start"
android:text="@{viewmodel.errorPassword}"
android:textColor="#ff0000" />
<Button
android:id="@+id/btn_login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginStart="40dp"
android:layout_marginTop="26dp"
android:layout_marginEnd="40dp"
android:background="@drawable/sign_in_handler_activity_sign_in_button_button_ripple"
android:fontFamily="@font/font_cairo_bold"
android:gravity="center"
android:text="@string/sign_in_handler_activity_sign_in_button_button_text"
android:textColor="@color/sign_in_handler_activity_sign_in_button_button_text_color"
android:textSize="@dimen/sign_in_handler_activity_sign_in_button_button_text_size" />
<LinearLayout
android:id="@+id/ll_forgotPassword"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="26dp"
android:background="?attr/selectableItemBackground"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="@font/font_cairo_bold"
android:gravity="center"
android:text="@string/sign_in_handler_activity_forgot_password_button_button_text"
android:textColor="@color/sign_in_handler_activity_forgot_password_button_button_text_color"
android:textSize="@dimen/sign_in_handler_activity_forgot_password_button_button_text_size" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@color/colorAccent" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<Button
android:id="@+id/btn_signUp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginStart="40dp"
android:layout_marginEnd="40dp"
android:layout_marginBottom="@dimen/sign_in_handler_activity_new_account_button_button_margin_bottom"
android:background="@drawable/sign_in_handler_activity_new_account_button_button_ripple"
android:fontFamily="@font/font_cairo_bold"
android:gravity="center"
android:text="@string/sign_in_handler_activity_new_account_button_button_text"
android:textColor="@color/sign_in_handler_activity_new_account_button_button_text_color"
android:textSize="@dimen/sign_in_handler_activity_new_account_button_button_text_size" />
</LinearLayout>
<View
android:id="@+id/v_blurBackground"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#CCffffff"
android:visibility="invisible" />
<include
android:id="@+id/layout_progress" layout="@layout/layout_progress_bar"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
</layout>
layout_progress_bar.xml
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android">
<data/>
<FrameLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<eightbitlab.com.blurview.BlurView
android:id="@+id/bv_blur"
android:clickable="false"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:id="@+id/ll_progressBar"
android:visibility="gone"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
<ProgressBar
android:id="@+id/pb_loading"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:visibility="invisible"
android:background="@null"/>
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1.25"/>
</LinearLayout>
</FrameLayout>
</layout>
View decorView = activity.getWindow().getDecorView();
ViewGroup rootView = (ViewGroup) viewGroup;
Drawable windowBackground = decorView.getBackground();
bvBlur.setupWith(rootView)
.setFrameClearDrawable(windowBackground)
.setBlurAlgorithm(new RenderScriptBlur(activity))
.setBlurRadius(radius)
.setHasFixedTransformationMatrix(false);
bvBlur.setClickable(true);
bvBlur.setVisibility(View.VISIBLE);
I am passing fl_rootContainer as the viewgroup (root view)
Can you post the screenshot with BlurView disabled? And another with blur radius = 1
Here are the screenshots you asked for and sorry for the late reply.
Can you please also show me the sign_in_handler_activity_new_account_button_button_ripple
?
<ripple
xmlns:android="http://schemas.android.com/apk/res/android"
android:color="@color/click_overlay">
<item
android:id="@android:id/mask"
android:drawable="@drawable/sign_in_handler_activity_new_account_button_button_background"/>
<item android:drawable="@drawable/sign_in_handler_activity_new_account_button_button_background"/>
</ripple>
sign_in_handler_activity_new_account_button_button_background.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke
android:color="@color/sign_in_handler_activity_new_account_button_button_border_color"
android:width="@dimen/sign_in_handler_activity_new_account_button_button_border_size"/>
<corners android:radius="@dimen/sign_in_handler_activity_new_account_button_button_radius"/>
</shape>
sign_in_handler_activity_new_account_button_button_background.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke
android:color="@color/sign_in_handler_activity_new_account_button_button_border_color"
android:width="@dimen/sign_in_handler_activity_new_account_button_button_border_size"/>
<corners android:radius="@dimen/sign_in_handler_activity_new_account_button_button_radius"/>
</shape>
I also apply animation to the button onclick
public static void startAnimationOne(View view) {
Keyframe kf1 = Keyframe.ofFloat(0.0f, 0.3f);
Keyframe kf2 = Keyframe.ofFloat(0.2f, 1.1f);
Keyframe kf3 = Keyframe.ofFloat(0.4f, 0.9f);
Keyframe kf4 = Keyframe.ofFloat(0.6f, 1.03f);
Keyframe kf5 = Keyframe.ofFloat(0.8f, 0.97f);
Keyframe kf6 = Keyframe.ofFloat(1.0f, 1f);
PropertyValuesHolder pvh1 = PropertyValuesHolder.ofKeyframe(View.SCALE_X, kf1, kf2, kf3, kf4, kf5, kf6);
PropertyValuesHolder pvh2 = PropertyValuesHolder.ofKeyframe(View.SCALE_Y, kf1, kf2, kf3, kf4, kf5, kf6);
Animator animator1 = ObjectAnimator.ofPropertyValuesHolder(view, pvh1, pvh2);
animator1.setDuration(1000);
animator1.setInterpolator(PathInterpolatorCompat.create(0.22f, 0.61f, 0.36f, 1f));
Keyframe kf7 = Keyframe.ofFloat(0.0f, 0f);
Keyframe kf8 = Keyframe.ofFloat(0.6f, 1f);
Keyframe kf9 = Keyframe.ofFloat(1.0f, 1f);
PropertyValuesHolder pvh3 = PropertyValuesHolder.ofKeyframe(View.ALPHA, kf7, kf8, kf9);
Animator animator2 = ObjectAnimator.ofPropertyValuesHolder(view, pvh3);
animator2.setDuration(1000);
animator2.setInterpolator(PathInterpolatorCompat.create(0.22f, 0.61f, 0.36f, 1f));
AnimatorSet set1 = new AnimatorSet();
set1.playTogether(animator1, animator2);
set1.setTarget(view);
AnimatorSet set2 = new AnimatorSet();
set2.playTogether(set1);
set2.start();
}
My apologies, I meant sign_in_handler_activity_sign_in_button_button_ripple
.
Basically the drawable of that green button. The reason I'm asking is because I believe it has a drawable that is not rendering properly in a software (non-hardware accelerated) mode, which the BlurView uses.
So I'd like to see how exactly it looks like and potentially suggest a fix
sign_in_handler_activity_sign_in_button_button_ripple.xml
<ripple
xmlns:android="http://schemas.android.com/apk/res/android"
android:color="@color/click_overlay">
<item
android:id="@android:id/mask"
android:drawable="@drawable/sign_in_handler_activity_sign_in_button_button_background"/>
<item android:drawable="@drawable/sign_in_handler_activity_sign_in_button_button_background"/>
</ripple>
sign_in_handler_activity_sign_in_button_button_background.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="@dimen/sign_in_handler_activity_sign_in_button_button_radius"/>
<solid android:color="@color/sign_in_handler_activity_sign_in_button_button_background_color"/>
</shape>
Does it happen only with this animation on button click?
Yes. But it also creates a square white box around the progress bar if it kept spinning for a long time like 10 seconds. Also if I use it as a fragment background and add views on top of it it makes shadows around these views.
Is it still happening if you remove .setFrameClearDrawable(windowBackground)
?
Yes it is.
well?...this is my issues to...when i called blurview in listener...then My blur layout gets bigger than real size
When the bottom layer is moving(such as RecyclerView scrolling,ViewPager animating),the weird square occur.
RealtimeBlurView perform the same issue as yours
Folks, to start debugging things like that, I would need an example project. I can't help just by looking at a screenshot. Most likely though those views don't render themselves properly in software mode, so it's probably not fixable with the current API