Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Low performance and UI lag when animating layer #7

Closed
Morteza-Rastgoo opened this issue Oct 13, 2015 · 7 comments
Closed

Low performance and UI lag when animating layer #7

Morteza-Rastgoo opened this issue Oct 13, 2015 · 7 comments

Comments

@Morteza-Rastgoo
Copy link

This is my code that has no lag with frame layout and i animate the inner views very well:

<FrameLayout
        android:id="@+id/maskFrameLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <com.q42.android.scrollingimageview.ScrollingImageView
            android:layout_width="match_parent"
            android:layout_height="250dp"
            android:layout_gravity="bottom"
            scrolling_image_view:speed="0.25dp"
            scrolling_image_view:src="@drawable/world_map" />

        <FrameLayout
            android:id="@+id/frame"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:animateLayoutChanges="true">
        </FrameLayout>
    </FrameLayout>

But when i change it to maskable frame layout it gives whole UI a huge lag in animations:

<com.christophesmet.android.views.maskableframelayout.MaskableFrameLayout
        android:id="@+id/maskFrameLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:mask="@drawable/contact_default_thumb"
        app:porterduffxfermode="SRC_IN">

        <com.q42.android.scrollingimageview.ScrollingImageView
            android:layout_width="match_parent"
            android:layout_height="250dp"
            android:layout_gravity="bottom"
            scrolling_image_view:speed="0.25dp"
            scrolling_image_view:src="@drawable/world_map" />

        <FrameLayout
            android:id="@+id/frame"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:animateLayoutChanges="true">
        </FrameLayout>
    </com.christophesmet.android.views.maskableframelayout.MaskableFrameLayout>

What is wrong that makes this lag appear in the UI?

@christophesmet
Copy link
Owner

Probably because the view is being invalidated every time.
You can profile the code and see if there is a possiblity to cache the bitmap.
Is there a sample I can run ?
I don't think automatically caching and breaking the invalidate function would be a good idea.
I suggest you look at bitmap shaders.
Does this answer your question ?

@Morteza-Rastgoo
Copy link
Author

This is a library that you can try here https://github.com/Q42/AndroidScrollingImageView

 <com.q42.android.scrollingimageview.ScrollingImageView
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:layout_gravity="bottom"
        scrolling_image_view:speed="0.25dp"
        scrolling_image_view:src="@drawable/world_map" />

and put it in your MaskableFrameLayout.

@christophesmet
Copy link
Owner

Well, thats normal. The view is invalidated each time, causing it to mask every time.
Every time it scrolls it invalidates, the mask is being applied.
So this will be very slow.
Either decrease the amount of invalidates or use bitmap shaders.

@Morteza-Rastgoo
Copy link
Author

I also use other views like Frame layout inside MaskableFrameLayout and i animate the views inside frame layout and animations are slow there too. The reason that i use this great library is that it makes it available to mask any view!
is there a workaround that it perform better in animations?
I am not familiar with shaders, how can i use an implementation?

@christophesmet
Copy link
Owner

Your animation will invalidate each time, causing a masking operation to be executed every time.
Optimize your animation or profile your code.

@Morteza-Rastgoo
Copy link
Author

I appreciate, If you can help me. I have two different views with different animations inside two maskable layout. In first one, i need to simulate a world map sphere movement in a loop so i used this lib(https://github.com/Q42/AndroidScrollingImageView):

 <com.q42.android.scrollingimageview.ScrollingImageView
    android:layout_width="match_parent"
    android:layout_height="250dp"
    android:layout_gravity="bottom"
    scrolling_image_view:speed="0.25dp"
    scrolling_image_view:src="@drawable/world_map" />

in second one i just have move and scale animations but i use this (https://github.com/daimajia/AndroidViewAnimations) library for implemented animations

  private void animateLines() {
    new Handler().postDelayed(() -> hideLineViews(false), 20);
    YoYo.with(Techniques.SlideInRight)
            .duration(lineAnimationDuration)
            .interpolate(new LinearInterpolator())
            .playOn(lines[1]);
    YoYo.with(Techniques.SlideInUp)
            .duration(lineAnimationDuration)
            .interpolate(new LinearInterpolator())
            .playOn(lines[0]);
}

private void animateExtensions() {
    new Handler().postDelayed(() -> hideExtensionViews(false), 40);
    for (View v : extensions) {
        YoYo.with(Techniques.ZoomIn)
                .duration(lineAnimationDuration)
                .interpolate(new LinearInterpolator())
                .playOn(v);
    }
}

What is your suggestion?

@christophesmet
Copy link
Owner

Use bitmap shaders.
You are masking the view each time is animates.
That is really cpu intensive.
Maybe try using the hardware layer, but I doubt that will work.
I recommend looking into bitmap shaders.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants