Expand Recyclerview item with animation when scrolling up

Question

How I can design and develop view which is posted in above video? This is basically the item expansion of recyclerview with animation. I have tried with onItemtouchlistener of recyclerview and also with some custom view with animation, but didn't get the accurate result.

Finally i came accross addonscrolllistener, this give me results but not accurate.

 mRecyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
        @Override
        public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
            if(newState == RecyclerView.FOCUS_UP) {
                System.out.println("hello, ia m going up");
            }
        }

        @Override
        public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
            super.onScrolled(recyclerView, dx, dy);
            if (dy > 0){
                TextView tv = (TextView)recyclerView.findViewById(R.id.title);
                //tv.setVisibility(View.VISIBLE);
                if (tv.getVisibility()==View.VISIBLE){
                     System.out.println("yes");
                }else {
                    slideToTop(tv);
                }
            }
        }
    });

 private void slideToTop(View view){
    TranslateAnimation animate = new TranslateAnimation(0,0,0,-view.getHeight());
    animate.setDuration(1000);
    animate.setFillAfter(false);
    view.startAnimation(animate);
    view.setVisibility(View.VISIBLE);
}

I understand it is frustrating when a client dumps work on you at the last moment, but nevertheless readers will not hurry based on requests for urgency. All questions have equal importance here. If you are really stuck, it is worth keeping the contact details of other Android developers, or perhaps using a paid service like AirPair, and paying for urgent assistance. — halfer, Sep 01 '15 at 11:21
Do readers need to watch your video to understand the question? If so, please also describe what it is about - questions should be self-contained here. — halfer, Sep 01 '15 at 11:22

Graeme · Answer 1 · 2015-09-01T10:01:41.143

I think your question is too broad - however, here is some psuedocode:

onScrolled() {
    View child = getSecondVisibleChild();
    int distanceFromTop = child.getTop();
    int distanceAtWhichExpandingShouldOccur = 100;
    if(distanceFromTop < distanceAtWhichExpandingShouldOccur ) {
         child.setHeight(child.getOriginalHeight() + (distanceFromTop - distanceAtWhichExpandingShouldOccur))
    }
}

So you'll notice, the second visible child is the one who's height changes. It changed when it's less than distanceAtWhichExpandingShouldOccur from the top of the window. Its height changes to ensure its bottom remains stationary - therefore its height is increasing at the same pace its top is moving.

Once it's no longer the second visible child (aka, its top is 0), it should be scrolled off as normal and the next child should have its height changed when its top is less than distanceAtWhichExpandingShouldOccur.

score 0 · Answer 2 · answered Sep 01 '15 at 12:04

0

This library can be a study case for you: https://github.com/florent37/MaterialLeanBack

answered Sep 01 '15 at 12:04

Pedro Paulo Amorim

1,838
2
27
50

Expand Recyclerview item with animation when scrolling up

2 Answers2