--- title: 'Streamlining Android Development 4: HELU Parallax View' url: 'https://helu.cz/blog/streamlining-android-helu-parallax-view' markdown: 'https://helu.cz/blog/streamlining-android-helu-parallax-view.md' date: '2019-01-22' description: 'This week is all about HELUParallaxView. Every once in a while you may receive designs containing parallax images. Implementing the animation yourself can be a tricky task. Don’t worry. HELU Parallax View will get the whole job done for you. Whether you are looking' taxonomy: category: - blog tag: - How-To - Android archives_month: - jan_2019 archives_year: - '2019' --- # Streamlining Android Development 4: HELU Parallax View Whether you are looking to build a simple [video player](https://helu.cz/blog/streamlining-android-helu-videoview), a [bottom button sheet](https://helu.cz/blog/streamlining-android-helu-bottom-button-sheet) or a [collapsing tab bar](https://helu.cz/blog/streamlining-android-helu-collapsing-tab-bar), my Android utilities library is your one-stop shop. I created the HELU repository in an effort to make the Android development process smoother. This week is all about **HELUParallaxView**. Every once in a while you may receive designs containing parallax images. Implementing the animation yourself can be a tricky task. Don’t worry. HELU Parallax View will get the whole job done for you. It is built at the top of ImageView and can be used anywhere. It doesn’t matter if you put it inside ScrollView, RecyclerView or any layout. All computations are made by the absolute position of HELU Parallax View on the screen. Let’s try it yourself. Start by adding the library to you gradle file: ``` implementation "cz.helu.android:heluparallaxview:2.0.0" ``` Now you are ready to use HELU Parallax View. Let’s assume, for example, that you already have a layout, including ScrollView with a vertical LinearLayout in it. All you need to do is simply add HeluParallaxView into it: ``` ``` If you duplicate this view a few times, the result should look like this: ![](https://helu.cz/user/pages/02.blog/streamlining-android-helu-parallax-view/heluparallax1.gif#center) Let’s explore the library a little bit and take a deeper look what we can do with it. There are a few attributes we can set to HELU Parallax View. The most important attribute for us would probably be the `scale` one. This will determine how much “parallax” will be applied to the image. A lower value means that the image won’t “scroll” so much. A larger value, by contrast, will increase the scrolling behavior. The minimum is 1, which means there will be no parallax at all. Here is an example of `app:scale="2"`: ![](https://helu.cz/user/pages/02.blog/streamlining-android-helu-parallax-view/heluparallax2.gif#center) Another useful attribute is `app:reverse`. This will change the direction in which the parallax is applied. You can change the direction for X, Y or both axis. Here is an example of `app:reverse="reverseBoth"`: ![](https://helu.cz/user/pages/02.blog/streamlining-android-helu-parallax-view/heluparallax3.gif#center) You might have a layout that is scrollable both vertically and horizontally at the same time. In that case, you’ll want to check out app:blockParallaxX and app:blockParallaxY. It will let you block parallax in a selected direction. The last attribute you can set is Interpolation, which is set to linear by default. This can be a little bit funny thing to try. Here’s an example: app:interpolation="bounce": ![](https://helu.cz/user/pages/02.blog/streamlining-android-helu-parallax-view/heluparallax4.gif#center) Pretty funny, huh? You can also set all those attributes programmatically. Have a question or suggestion? Feel free to contact me. You can see all methods and examples [here](https://github.com/Tuxilero/HELU-Utils). [ Previous Post](https://helu.cz/blog/streamlining-android-helu-collapsing-tab-bar) [Next Post ](https://helu.cz/blog/splitting-android-resources-like-a-pro) --- #### Popular Tags [How-To](https://helu.cz/blog/tag:How-To) [DIY](https://helu.cz/blog/tag:DIY) [Android](https://helu.cz/blog/tag:Android) [Boosted](https://helu.cz/blog/tag:Boosted) [Scooter](https://helu.cz/blog/tag:Scooter) [Battery](https://helu.cz/blog/tag:Battery) [Repair](https://helu.cz/blog/tag:Repair) [Linux](https://helu.cz/blog/tag:Linux) [Laser](https://helu.cz/blog/tag:Laser) [Engraving](https://helu.cz/blog/tag:Engraving) [Painting](https://helu.cz/blog/tag:Painting) [Art](https://helu.cz/blog/tag:Art) [GRUB](https://helu.cz/blog/tag:GRUB) [Bluetooth](https://helu.cz/blog/tag:Bluetooth) [Windows 10](https://helu.cz/blog/tag:Windows%2010) [Fix](https://helu.cz/blog/tag:Fix) #### Related Posts - 100 [Streamlining Android Development 3: HELU Collapsing Tab Bar](https://helu.cz/blog/streamlining-android-helu-collapsing-tab-bar "Streamlining Android Development 3: HELU Collapsing Tab Bar") - 75 [Streamlining Android Development 5: Splitting Android resources like a pro!](https://helu.cz/blog/splitting-android-resources-like-a-pro "Streamlining Android Development 5: Splitting Android resources like a pro!") - 75 [Streamlining Android Development 2: HELU Bottom Button Sheet](https://helu.cz/blog/streamlining-android-helu-bottom-button-sheet "Streamlining Android Development 2: HELU Bottom Button Sheet") - 75 [Streamlining Android Development 1: HELU VideoView](https://helu.cz/blog/streamlining-android-helu-videoview "Streamlining Android Development 1: HELU VideoView") - 50 [Boosted Rev: Battery Cells Replace - Part 4](https://helu.cz/blog/boosted-rev-battery-cells-replace-part-4 "Boosted Rev: Battery Cells Replace - Part 4") #### Archives - [ 4 July 2022 ](https://helu.cz/blog/archives_month:jul_2022) - [ 1 April 2021 ](https://helu.cz/blog/archives_month:apr_2021) - [ 1 November 2020 ](https://helu.cz/blog/archives_month:nov_2020) - [ 1 July 2020 ](https://helu.cz/blog/archives_month:jul_2020) - [ 1 September 2019 ](https://helu.cz/blog/archives_month:sep_2019) - [ 4 January 2019 ](https://helu.cz/blog/archives_month:jan_2019) - [ 1 February 2014 ](https://helu.cz/blog/archives_month:feb_2014) --- ## Navigation - Parent: [Blog](https://helu.cz/blog.md) - Previous: [Streamlining Android Development 5: Splitting Android resources like a pro!](https://helu.cz/blog/splitting-android-resources-like-a-pro.md) - Next: [Streamlining Android Development 3: HELU Collapsing Tab Bar](https://helu.cz/blog/streamlining-android-helu-collapsing-tab-bar.md)