Giter VIP home page Giter VIP logo

stikkyheader's Introduction

StikkyHeader

This is a very simple library for Android that allows you to stick an header to a ListView and easily apply animation to it

Usage

To use the StikkyHeader library, you just need 3 lines:

  StikkyHeaderBuilder.stickTo(mListView)
    .setHeader(R.id.header, containerLayout)
    .minHeightHeader(250)
    .build();

that's all, folks!

Header Animator

Using the StikkyHeader you can create easly some nice animations extending the HeaderStikkyAnimator and using the utility AnimatorBuilder. The animations available are Translation, Scale and Fade and can be combined to build an animation during the translation of the StikkyHeader.

Example:

public class IconAnimator extends HeaderStikkyAnimator {

    @Override
    public AnimatorBuilder getAnimatorBuilder() {

        View viewToAnimate = getHeader().findViewById(R.id.icon);
        Point point = new Point(50,100) // translate to the point with coordinate (50,100);
        float scaleX = 0.5f //scale to the 50%
        float scaleY = 0.5f //scale to the 50%
        float fade = 0.2f // 20% fade

        AnimatorBuilder animatorBuilder = AnimatorBuilder.create()
            .applyScale(viewToAnimate, scaleX, scaleY)
            .applyTranslation(viewToAnimate, point)
            .applyFade(viewToAnimate, fade);

        return animatorBuilder;
    }
}

and then set the animator to the StikkyHeader:

  StikkyHeaderBuilder.stickTo(mListView)
    .setHeader(R.id.header, containerLayout)
    .minHeightHeader(250)
    .animator(new IconAnimator())
    .build();

ViewGroups supported

The StikkyHeader supports:

  • ListView
  • RecyclerView
  • ScrollView

How to integrate

Grab via Gradle:

repositories {
  maven { url "https://oss.sonatype.org/content/repositories/snapshots/" }
}
dependencies {
  compile 'com.github.carlonzo.stikkyheader:core:0.0.3-SNAPSHOT'
}

or via Maven:

<dependency>
  <groupId>com.github.carlonzo.stikkyheader</groupId>
  <artifactId>core</artifactId>
  <version>0.0.3-SNAPSHOT</version>
</dependency>

Video

Example 1 Example 2

Demo

here the [link][1] to the emulator to try few examples. [1]: https://appetize.io/embed/urptay0fdprc9dp3xzk6e41g70?screenOnly=false&scale=75

stikkyheader's People

Contributors

carlonzo avatar ghlin-daniel avatar rongi avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

stikkyheader's Issues

problems after switching to another activity

Hi, I'm using your library in this way:
-a main activity with viewpager;
-each fragment contains an header and a recyclerview, animated through your library;

It works perfectly unless I go from a fragment to another activity, when I go back all the scroll is messed up, the header is gone somewhere and there's a lot of "empty" space.

I can provide more details or code if you need, but basically I only do:

    StikkyHeaderBuilder.stickTo(mRecyclerView)
            .setHeader(R.id.header, (ViewGroup) getView())
            .animator(new ParallaxStikkyAnimator())
            .build();

and the animator is:

private class ParallaxStikkyAnimator extends HeaderStikkyAnimator {
    @Override
    public AnimatorBuilder getAnimatorBuilder() {
        View mHeader_image = getHeader().findViewById(R.id.header_image);
        return AnimatorBuilder.create().applyVerticalParallax(mHeader_image);
    }
}

Is there some specific command to "restore" the recyclerview to a "good" status?

bug when add fragment to backstack

i have fragment it has a header and recyclerview if i did scroll down and clicked on item the application change the fragment but when click back and return to first fragment it shows the header full size but the recyclerview scrolled to the last position before change the fragment. and when i scroll it weird behaviors happened

How to use allowTouchBehindHeader?

Hi I am using this library for one of my use.

I tried to modify your parallax sample code. I dont want the parallax effect on the image so i put that into back. I am able to achivie what i want in UI perspective. Thanks for that. But I want to add few buttons on the header and which should be clickable. Could you please let me know how to achieve this?

Following is the xml.

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/layout_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent">


    <RelativeLayout
        android:id="@+id/bg"
        android:layout_width="match_parent"
        android:layout_height="@dimen/max_height_header">

        <ImageView
            android:id="@+id/header_image"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="fitXY"
            android:src="@drawable/image1" />



        <Button
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:text="test"
            android:id="@+id/button"
            android:background="#ffffff" />

    </RelativeLayout>


        <RelativeLayout
            android:id="@+id/header"
            android:clickable="true"

            android:layout_width="match_parent"
            android:layout_height="@dimen/max_height_header">



            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="220dp"
                android:id="@+id/textview"
                android:text="Hello World!"
                android:textColor="@android:color/white"
                android:textSize="30sp" />

        </RelativeLayout>




    <ListView
        android:id="@+id/listview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />



</FrameLayout>

Below is the code in java file.

 StikkyHeaderBuilder.stickTo(mListView)
                .setHeader(R.id.header, (ViewGroup) getView())
                .minHeightHeaderDim(R.dimen.max_height_header)
                .allowTouchBehindHeader(true)

                //.animator(new ParallaxStikkyAnimator())
                .build();

        button.setOnTouchListener(this);

 @Override
    public void onClick(View v) {
        if (v.getId() == R.id.button)
            Log.e("" , "Button clicked");
    }

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        Log.e("" , "view touched");
        return false;
    }

Allow shadow on header, enhancement

Hi Carlonzo!
I would to see something like the new app from Google, the Google IO 2015. The header has a fixed size, but the cool thing is the shadow appearing below the header with the scroll translation, like a fade. Take a look after, because I can't give an elevation to header :( If there is an tip, tell me!

Enchancement:

I tried it on 2.3 onward with backward compalible library , nine old andorid and ViewCompact , the RecyelerView Translation is not working

Callbacks

there are no callbacks for the on scroll

Notify when animation completes

Hello,
Thanx for your fabulous library.

I am using it in one of my projects. Is there any way to get notified when header animation get completed.

I mean we pass minimum height to header and scrolling gets stopped on reaching that height so is there any kinda method is there through which we could get that animation completed because I want that.

ScrollListener

after sticking the recyclerview to the StickyHeaderBuilder I don't get any response from the ScrollListener.

Maven central

Hello,

Can you add a Release version in the maven central, please ?
It's a little bit difficult for some project to include your project in snapshot version.

Thanks.
Regards.

RecyclerView Adapter Issue

When we update , add ,delete an item from Adapter , or Attach a new Adapter to RecyclerView when in Sticky mode , lots of White Space appear between sticky header and Recycler View

it is just because of Translation Y

Maven central

Could you please add this to Maven Central?
This would make it easier to include to our projects.

visual bug after items on adapter change

Hi,
I've correctly added the header to a recycler view and everything works fine - also with animation.
But, after I go to another activity, make an action that modifies the number of items on the recycler adapter (add one item at a specific position) and go back, the content is reloaded, showing the new item, but it appears a blank area at top.

Is there something I have to do?
I've tried to scroll to the top (even if it's not what I want), but it's still broken.

onResume I just reload the content, than set the new content on the adapter and call notifyDataSetChanged().

Any help will be appreciated.

Doubling image on header

My header is doubling the size. But one is my image header and other is a blank image. How can I solve that?
screenshot_2015-03-08-18-01-08
screenshot_2015-03-08-18-01-00

code XML:

   <FrameLayout
        android:id="@+id/header"
        android:layout_width="match_parent"
        android:layout_height="180dp"
        >

        <ImageView
            android:id="@+id/header_image"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop"
            android:src="@drawable/alimentacao" />
    </FrameLayout>

code Android:

    StikkyHeaderBuilder.stickTo(list)
                .setHeader(R.id.header, parent)
                .minHeightHeaderRes(R.dimen.min_height_header)
                .animator(new ParallaxStikkyAnimator())
                .build();

Parallax effect

Thank you for your work. It is posible to add parallax efect to library?

dynamic height of header at runtime

Hi, thanks for your library...
I'm having problems when the header (set at .setHeader(R.id.header, containerLayout) height change dynamically at runtime.
For instance, if I place a description label on header view and its height can vary, the .minHeightHeader(100) works ok for the first time when the description label is set to a determinate number of lines, but if this label change its height (selecting another product ....) then the minHeightHeader is lower or higher the the original one depending on if the new description has fewer o more lines than the original one respectively, and as result the sticky header is not showing completely or there is an extra space at top of header respectively.

I've tried to adjust the header (set at .setHeader(R.id.header, containerLayout) height dinamically according to the label height, but without success, the same behaviour.

Is there any way to solve it? Thanks.

Force header height to min

Hi,

My layout is as follow :

LAYOUT
|_ HEADER
|_ PAGER
   |_ MapView
   |_ RecyclerView
|_ Floating action button

When pushing the FAB, I want to animate the header to min height (if necessary) and show the map view. When pushing the FAB again, I would like to show the recycler view again (and leave the header minimized)

Any way to do that?

Fade doesnt work

animateOnScroll (AnimatorBuilder.java)

case FADE:
animatorBundle.mView.setAlpha(boundedRatioTranslationY);

should get the final value from animatorBundle.mValues[0] and calculated the one to apply

Access ItemDecoration

I would like to remove item decoration created by StikkyHeader so I need to access it by reference.

EDIT: I created a pull request for that #54

ContainerLayout in an activity?

I'm trying to implement this in an Activity, but I can't achieve it...

What do I have to put in "containerLayout"?
StikkyHeaderBuilder.stickTo(mListView)
.setHeader(R.id.header, containerLayout)
.minHeightHeader(250)
.build();

Thanks in advance

Gradle error

Does anyone know how to fix the following error:
Error:Module version com.github.carlonzo.stikkyheader:core:0.0.2-SNAPSHOT depends on libraries but is not a library itself

Thanks in advance,
Dorin

Black Space When Flinging on ScrollView

I'm not sure if this is reported or not, but I'm noticing some black space between the bottom of the header and the top of the ScrollView when you fling. The device I'm on is The Note 5 and I'm compiling from Gradle like such compile 'com.github.carlonzo.stikkyheader:core:0.+'

The code I'm seeing this with is the example code for SimpleScrollViewFragment.java and fragment_simplescrollview.xml, unmodified.

Is this a known issue and are there any workarounds? There doesn't seem to be a HeaderStikkyAnimator with this code, so I'm guessing it's in the way we measure the bottom of the header or the top of the ScrollView perhaps?

RecyclerView scrollToPosition makes header go to wrong place

Hi there, congrats for the library, it's really easy to use and works great.
I'm having a small issue: whenever I do a scrollToPosition on my recyclerview the sticky header don't refresh itself. In other words if I'm at the beginning of the recyclerview and execute a scrollToPosition to the last position of the recyclerview the whole header remains in screen, event the part that is not supposed to be sticky. I can attach some images if that is not clear enough. Can someone help me? Thanks in advance.

How to release memory

I ran your example and found that, when I click on tab "Simple stickky header" then I press back to home screen, the memory usage increase (Seen on Android Studio IDE -> Monitor -> Memory Allocated). Then -> click the same tab -> back to home .... memory increase continuously. How to release this memory? Thank you very much!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.