{"id":21130310,"url":"https://github.com/prolificinteractive/ParallaxPager","last_synced_at":"2025-07-09T01:33:07.868Z","repository":{"id":16332579,"uuid":"19082214","full_name":"prolificinteractive/ParallaxPager","owner":"prolificinteractive","description":"Add some depth to your Android scrolling.","archived":false,"fork":false,"pushed_at":"2019-11-27T14:06:41.000Z","size":2728,"stargazers_count":777,"open_issues_count":4,"forks_count":132,"subscribers_count":74,"default_branch":"master","last_synced_at":"2024-11-19T18:01:17.181Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/prolificinteractive.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-04-23T19:10:55.000Z","updated_at":"2024-09-04T09:57:29.000Z","dependencies_parsed_at":"2022-07-29T02:09:21.690Z","dependency_job_id":null,"html_url":"https://github.com/prolificinteractive/ParallaxPager","commit_stats":null,"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prolificinteractive%2FParallaxPager","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prolificinteractive%2FParallaxPager/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prolificinteractive%2FParallaxPager/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prolificinteractive%2FParallaxPager/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/prolificinteractive","download_url":"https://codeload.github.com/prolificinteractive/ParallaxPager/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225476370,"owners_count":17480215,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-20T05:32:35.804Z","updated_at":"2024-11-20T05:32:43.510Z","avatar_url":"https://github.com/prolificinteractive.png","language":"Java","readme":"\u003cimg src=\"/bg_parallax_pager.png\"/\u003e\n\n# Parallax Pager\n[![Android Arsenal](https://img.shields.io/badge/Android%20Arsenal-ParallaxPager-blue.svg?style=true)](https://android-arsenal.com/details/1/537) \n[![](https://jitpack.io/v/prolificinteractive/ParallaxPager.svg)](https://jitpack.io/#prolificinteractive/ParallaxPager)\n\n\nAdd some depth to your Android scrolling using the parallax effect!\n\n## Installation\n\nStep 1. Add the JitPack repository to your build file\n\n```groovy\nallprojects {\n  repositories {\n    ...\n    maven { url 'https://jitpack.io' }\n  }\n}\n```\n\nStep 2. Add the dependency\n\n```groovy\ndependencies {\n  implementation 'com.github.prolificinteractive:parallaxpager:${parallaxpagerVersion}'\n}\n```\n\n## Usage\n\n\nThere are 4 important steps:\n\n1. Use a `ParallaxContainer` in layout XML\n\n2. Create a layout XML file for each page\n\n3. Wrap the Activity Context\n\n4. Add the attachment code to `onCreate` of your Activity or `onCreateView` of your Fragment\n\n\n## 1. Use a `ParallaxContainer` in layout XML\n\nUse the class `com.prolificinteractive.parallaxpager.ParallaxContainer` in your layout XML, sizing it however you like.\n\nEx:\n\n```xml\n\u003ccom.prolificinteractive.parallaxpager.ParallaxContainer\n      android:id=\"@+id/parallax_container_1\"\n      android:layout_width=\"match_parent\"\n      android:layout_height=\"match_parent\"/\u003e\n```\n\n\n## 2. Create a layout XML file for each page\n\nEach page must have its own layout XML file. Use whichever Layouts or Views you like, as usual.\n\nEnsure this line is added to the Root Element:\n\n\u003exmlns:app=\"http://schemas.android.com/apk/res-auto\"\n\nAssign any combination of the following attributes (all floats):\n\n* `x_in`: as the View **enters** the screen, it will translate in the horizontal direction along with user swiping, at a rate multiplied by this value. Default is `0`.\n\n* `x_out`: as the View **leaves** the screen, it will translate in the horizontal direction along with user swiping, at a rate multiplied by this value. Default is `0`.\n\n* `y_in`: as the View **enters** the screen, it will translate **downward** as the user swipes right to left, at a rate multiplied by this value. Default is `0`.\n\n* `y_out`: as the View **leaves** the screen, it will translate **upward** as the user swipes right to left, at a rate multiplied by this value. Default is `0`.\n\n* `a_in`: as the View **enters** the screen, it will **fade in** as the user swipes right to left, at a rate multiplied by this value. Default is `0`.\n\n* `a_out`: as the View **leaves** the screen, it will **fade out** as the user swipes right to left, at a rate multiplied by this value. Default is `0`.\n\nEx:\n\n```xml\n\u003c?xml version=\"1.0\" encoding=\"utf-8\"?\u003e\n\u003cLinearLayout xmlns:android=\"http://schemas.android.com/apk/res/android\"\n    xmlns:app=\"http://schemas.android.com/apk/res-auto\"\n    android:layout_width=\"match_parent\"\n    android:layout_height=\"match_parent\"\n    android:orientation=\"vertical\"\u003e\n\n  \u003cTextView\n      android:layout_width=\"wrap_content\"\n      android:layout_height=\"wrap_content\"\n      app:x_in=\"@dimen/parallax_speed_medium\"\n      app:x_out=\"@dimen/parallax_speed_fast\"\n      app:y_in=\"@dimen/parallax_speed_medium_rev\"\n      app:y_out=\"@dimen/parallax_speed_fast\"\n      app:a_in=\"@dimen/parallax_speed_very_fast\"\n      app:a_out=\"@dimen/parallax_speed_very_fast\"\n      android:text=\"@string/text_1\"\n      /\u003e\n\n  \u003cTextView\n      android:layout_width=\"wrap_content\"\n      android:layout_height=\"wrap_content\"\n      app:x_in=\"@dimen/parallax_speed_medium_rev\"\n      app:x_out=\"@dimen/parallax_speed_fast\"\n      app:y_in=\"@dimen/parallax_speed_medium\"\n      app:y_out=\"@dimen/parallax_speed_fast_rev\"\n      app:a_in=\"@dimen/parallax_speed_very_fast\"\n      app:a_out=\"@dimen/parallax_speed_very_fast\"\n      android:text=\"@string/text_2\"\n      /\u003e\n\u003c/LinearLayout\u003e\n```\n\nKeep in mind that negative values mean a change in direction for translation effects, and have no effect for alpha. For translation effects, values between `0` and `1` will result in a high level of funkiness.\n\n\n## 3. Wrap the Activity Context\nWrap the activity context using `com.prolificinteractive.parallaxpager.ParallaxContextWrapper` in your activity.\n\nEx:\n\n```java\n  @Override\n  protected void attachBaseContext(Context newBase) {\n    super.attachBaseContext(new ParallaxContextWrapper(newBase));\n  }\n```\n\n**Note**: If you are using this in conjunction with another library that wraps Context, it doesn't appear to like chaining them together.\nInstead, we've added the ability to hook into the View creation process to use with other libraries.\nThe sample project shows how to hook into Calligraphy.\n\nEx:\n\n```java\n  @Override\n  protected void attachBaseContext(Context newBase) {\n    super.attachBaseContext(\n        new ParallaxContextWrapper(newBase, new OnViewCreatedListener() {\n          @Override public View onViewCreated(View view, Context context, AttributeSet attrs) {\n            //Setup view as needed\n            return view; //Return the view passed in\n          }\n        })\n    );\n  }\n```\n\n\n## 4. Add the attachment code to `onCreate` of your Activity or `onCreateView` of your Fragment\n\nImportant steps in `onCreate` of an Activity (or `onCreateView` of a Fragment):\n\n* Find the parallax container by ID\n\n* Specify whether the pager should loop (`true` means it *will* loop)\n\n* Submit a **Layout Inflater** and list the layouts for each page (in order). Currently there must be at least 2 in this list (repeats allowed).\n\nEx:\n\n```java\n// find the parallax container\nParallaxContainer parallaxContainer = (ParallaxContainer) findViewById(R.id.parallax_container);\n\n// specify whether pager will loop\nparallaxContainer.setLooping(true);\n\n// wrap the inflater and inflate children with custom attributes\nparallaxContainer.setupChildren(getLayoutInflater(),\n    R.layout.parallax_view_1,\n    R.layout.parallax_view_2,\n    R.layout.parallax_view_3,\n    R.layout.parallax_view_4);\n```\n\nExtras\n======\n\n## Extra 1. Setting a `ViewPager.OnPageChangeListener`\n\nYou can set a `ViewPager.OnPageChangeListener` after the attachment code in step 4.\n\n```java\n// optionally set a ViewPager.OnPageChangeListener\nparallaxContainer.setOnPageChangeListener(this);\n```\n\n## Extra 2. `ViewPager` access\n\nYou have access to the `ViewPager` by calling:\n\n```java\nparallaxContainer.getViewPager();\n```\n\nThis is exposed for use with existing code which requires a `ViewPager` instance. Please make sure that if you call methods like `setAdapter` or `setOnPageChangeListener` on the instance returned, that you do so with forethought and good reason.\n\n## Extra 3. Overriding parallax visibility\n\nParallax views will be `VISIBLE` when onscreen, and `GONE` when offscreen. If you need to override this behavior, set this attribute on your View in XML:\n\n```xml\napp:override_visibility=\"true\"\n```\n\n\n## Contributing\n\nTo report a bug or enhancement request, feel free to file an issue under the respective heading. If you wish to contribute to the project, fork this repo and submit a pull request. \n\n\nCode contributions should follow the standards specified in the [Prolific Android Code Style](https://github.com/prolificinteractive/android-code-styles).\n\n\n## License\n\n![prolific](https://s3.amazonaws.com/prolificsitestaging/logos/Prolific_Logo_Full_Color.png)\n\nCopyright (c) 2018 Prolific Interactive\n\nParallax Pager is maintained and sponsored by Prolific Interactive. It may be redistributed under the terms specified in the [LICENSE] file.\n\n[LICENSE]: ./LICENSE\n","funding_links":[],"categories":["Libs"],"sub_categories":["\u003cA NAME=\"Widget\"\u003e\u003c/A\u003eWidget"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprolificinteractive%2FParallaxPager","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fprolificinteractive%2FParallaxPager","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprolificinteractive%2FParallaxPager/lists"}