{"id":13598108,"url":"https://github.com/wajahatkarim3/EasyFlipView","last_synced_at":"2025-04-10T06:31:09.004Z","repository":{"id":15386538,"uuid":"78039985","full_name":"wajahatkarim3/EasyFlipView","owner":"wajahatkarim3","description":"💳 A quick and easy flip view through which you can create views with two sides like credit cards, poker cards etc.","archived":false,"fork":false,"pushed_at":"2024-09-05T12:06:33.000Z","size":15618,"stargazers_count":1384,"open_issues_count":7,"forks_count":193,"subscribers_count":33,"default_branch":"master","last_synced_at":"2025-04-04T13:21:18.730Z","etag":null,"topics":["android","android-library","animation","credit-cards","custom-view","layouts","poker-cards","views","xml"],"latest_commit_sha":null,"homepage":"https://android.jlelse.eu/easyflipviewpager-the-flip-animations-for-your-viewpager-fd66b34f4703","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/wajahatkarim3.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"custom":["https://www.paypal.me/WajahatKarim/5","https://www.paypal.me/WajahatKarim/20","https://www.paypal.me/WajahatKarim/50","https://www.paypal.me/WajahatKarim/100"]}},"created_at":"2017-01-04T18:04:55.000Z","updated_at":"2025-03-23T07:02:56.000Z","dependencies_parsed_at":"2024-11-06T22:36:11.078Z","dependency_job_id":"14e8581d-f8c4-4174-9f89-ce66fc80d7f5","html_url":"https://github.com/wajahatkarim3/EasyFlipView","commit_stats":null,"previous_names":[],"tags_count":10,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wajahatkarim3%2FEasyFlipView","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wajahatkarim3%2FEasyFlipView/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wajahatkarim3%2FEasyFlipView/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wajahatkarim3%2FEasyFlipView/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/wajahatkarim3","download_url":"https://codeload.github.com/wajahatkarim3/EasyFlipView/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248168198,"owners_count":21058784,"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":["android","android-library","animation","credit-cards","custom-view","layouts","poker-cards","views","xml"],"created_at":"2024-08-01T17:00:48.192Z","updated_at":"2025-04-10T06:31:03.986Z","avatar_url":"https://github.com/wajahatkarim3.png","language":"Java","funding_links":["https://www.paypal.me/WajahatKarim/5","https://www.paypal.me/WajahatKarim/20","https://www.paypal.me/WajahatKarim/50","https://www.paypal.me/WajahatKarim/100","https://www.paypal.me/WajahatKarim/10","https://www.paypal.me/WajahatKarim/15","https://www.paypal.me/WajahatKarim/25","https://www.paypal.me/WajahatKarim/2799"],"categories":["Java","页面切换"],"sub_categories":[],"readme":"\u003cdiv align=\"left\"\u003e\u003cp\u003e\u003ca href=\"https://android.jlelse.eu/easyflipviewpager-the-flip-animations-for-your-viewpager-fd66b34f4703\"\u003e\u003cimg alt=\"New in the EasyFlipView\" align=\"center\" src=\"https://img.shields.io/badge/%F0%9F%93%84%20-NEW-red.svg\" /\u003e\u003c/a\u003e\u0026nbsp;\nThe article on how this library was created is now published. You can \u003ca href=\"https://android.jlelse.eu/easyflipviewpager-the-flip-animations-for-your-viewpager-fd66b34f4703\"\u003eread it on this link here. →\u003c/a\u003e.\n\u003c/p\u003e\u003c/div\u003e\n\n\n💳 EasyFlipView\n============\n[![Codacy Badge](https://api.codacy.com/project/badge/Grade/b6f4c512c5cf4705a41a04fe101a6c6e)](https://www.codacy.com/app/wajahatkarim3/EasyFlipView?utm_source=github.com\u0026utm_medium=referral\u0026utm_content=wajahatkarim3/EasyFlipView\u0026utm_campaign=badger)\n[![Build Status](https://travis-ci.org/wajahatkarim3/EasyFlipView.svg?branch=master)](https://travis-ci.org/wajahatkarim3/EasyFlipView) [ ![Download](https://api.bintray.com/packages/wajahatkarim3/EasyFlipView/com.wajahatkarim3.EasyFlipView/images/download.svg) ](https://bintray.com/wajahatkarim3/EasyFlipView/com.wajahatkarim3.EasyFlipView/_latestVersion) [![Android Arsenal](https://img.shields.io/badge/Android%20Arsenal-EasyFlipView-brightgreen.svg?style=flat)](https://android-arsenal.com/details/1/5051) [![API](https://img.shields.io/badge/API-15%2B-blue.svg?style=flat)](https://android-arsenal.com/api?level=15) [![](https://img.shields.io/badge/MaterialUp-EasyFlipView-yellowgreen.png)](https://material.uplabs.com/posts/easyflipview) [![Say Thanks!](https://img.shields.io/badge/Say%20Thanks-!-1EAEDB.svg)](https://saythanks.io/to/wajahatkarim3)\n\n\u003cdiv align=\"center\"\u003e\n  \u003csub\u003eBuilt with ❤︎ by\n  \u003ca href=\"https://twitter.com/WajahatKarim\"\u003eWajahat Karim\u003c/a\u003e and\n  \u003ca href=\"https://github.com/wajahatkarim3/EasyFlipView/graphs/contributors\"\u003e\n    contributors\n  \u003c/a\u003e\n\u003c/div\u003e\n\u003cbr/\u003e\n\nA quick and easy flip view through which you can create views with two sides like credit cards, poker cards etc. \n\n![](https://github.com/wajahatkarim3/EasyFlipView/blob/master/Art/demo.gif)\n\n✔️ Changelog\n=========\nChanges exist in the [releases](https://github.com/wajahatkarim3/EasyFlipView/releases) tab.\n\n💻 Installation\n============\nAdd this in your app's `build.gradle` file:\n```groovy\ndependencies {\n  implementation 'com.wajahatkarim:EasyFlipView:3.0.3'\n}\n```\n\n\u003cimg alt=\"New in the EasyFlipView\" align=\"center\" src=\"https://img.shields.io/badge/%F0%9F%93%84%20-NEW-red.svg\" /\u003e From the version `3.0.0`, this library will only support Android X naming artifacts. If you want to use the `android.support` versions, then use `2.1.2` version.\n\nOr add EasyFlipView as a new dependency inside your pom.xml\n\n```xml\n\u003cdependency\u003e \n  \u003cgroupId\u003ecom.wajahatkarim\u003c/groupId\u003e\n  \u003cartifactId\u003eEasyFlipView\u003c/artifactId\u003e \n  \u003cversion\u003e3.0.3\u003c/version\u003e\n  \u003ctype\u003epom\u003c/type\u003e \n\u003c/dependency\u003e\n```\n❔ Usage\n=====\n\nXML\n---\nEasyFlipView In XML layouts(\"Vertical\")\n```xml\n\u003ccom.wajahatkarim3.easyflipview.EasyFlipView\n\tandroid:layout_width=\"match_parent\"\n\tandroid:layout_height=\"wrap_content\"\n\tapp:flipOnTouch=\"true\"\n\tapp:flipEnabled=\"true\"\n\tapp:flipDuration=\"400\"\n\tapp:flipType=\"vertical\"\n\tapp:flipFrom=\"front\"\n\tapp:autoFlipBack=\"true\"\n\tapp:autoFlipBackTime=\"1000\"\n\t\u003e\n\n\t\u003c!-- Back Layout Goes Here --\u003e\n\t\u003cinclude layout=\"@layout/flash_card_layout_back\"/\u003e\n        \n\t\u003c!-- Front Layout Goes Here --\u003e\n\t\u003cinclude layout=\"@layout/flash_card_layout_front\"/\u003e\n\n\u003c/com.wajahatkarim3.easyflipview.EasyFlipView\u003e\n```\n\nEasyFlipView In XML layouts(\"Horizontal\")\n```xml\n\u003ccom.wajahatkarim3.easyflipview.EasyFlipView\n\tandroid:layout_width=\"match_parent\"\n\tandroid:layout_height=\"wrap_content\"\n\tapp:flipOnTouch=\"true\"\n\tapp:flipEnabled=\"true\"\n\tapp:flipDuration=\"400\"\n\tapp:flipFrom=\"right\"\n\tapp:flipType=\"horizontal\"\n\tapp:autoFlipBack=\"false\"\n\t\u003e\n\n\t\u003c!-- Back Layout Goes Here --\u003e\n\t\u003cinclude layout=\"@layout/flash_card_layout_back\"/\u003e\n\n\t\u003c!-- Front Layout Goes Here --\u003e\n\t\u003cinclude layout=\"@layout/flash_card_layout_front\"/\u003e\n\n\u003c/com.wajahatkarim3.easyflipview.EasyFlipView\u003e\n```\n\n# 🎨 Customizations \u0026 Attributes\nAll customizable attributes for EasyFlipView\n\u003ctable\u003e\n    \u003cth\u003eAttribute Name\u003c/th\u003e\n    \u003cth\u003eDefault Value\u003c/th\u003e\n    \u003cth\u003eDescription\u003c/th\u003e\n    \u003ctr\u003e\n        \u003ctd\u003eapp:flipOnTouch=\"true\"\u003c/td\u003e\n        \u003ctd\u003etrue\u003c/td\u003e\n        \u003ctd\u003eWhether card should be flipped on touch or not.\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003eapp:flipDuration=\"400\"\u003c/td\u003e\n        \u003ctd\u003e400\u003c/td\u003e\n        \u003ctd\u003eThe duration of flip animation in milliseconds.\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003eapp:flipEnabled=\"true\"\u003c/td\u003e\n        \u003ctd\u003etrue\u003c/td\u003e\n        \u003ctd\u003eIf this is set to false, then it won't flip ever in Single View and it has to be always false for RecyclerView\u003c/td\u003e\n    \u003c/tr\u003e\n     \u003ctr\u003e\n            \u003ctd\u003eapp:flipType=\"horizontal\"\u003c/td\u003e\n            \u003ctd\u003evertical\u003c/td\u003e\n            \u003ctd\u003eWhether card should flip in vertical or horizontal\u003c/td\u003e\n        \u003c/tr\u003e\n        \u003ctr\u003e\n                    \u003ctd\u003eapp:flipType=\"horizontal\"\u003c/td\u003e\n                    \u003ctd\u003evertical\u003c/td\u003e\n                    \u003ctd\u003eWhether card should flip in vertical or horizontal\u003c/td\u003e\n                \u003c/tr\u003e\n        \t \u003ctr\u003e\n                    \u003ctd\u003eapp:flipFrom=\"right\"\n        \t\tapp:flipFrom=\"back\"\u003c/td\u003e\n                    \u003ctd\u003eleft\n        \t\tfront\u003c/td\u003e\n                    \u003ctd\u003eWhether card should flip from left to right Or right to left(Horizontal type) or car should flip to front or back(Vertical type)\u003c/td\u003e\n                \u003c/tr\u003e\n     \u003ctr\u003e\n        \u003ctd\u003eapp:autoFlipBack=\"true\"\u003c/td\u003e\n        \u003ctd\u003efalse\u003c/td\u003e\n        \u003ctd\u003eIf this is set to true, then he card will be flipped back to original front side after the time set in \u003ci\u003eautoFlipBackTime\u003c/i\u003e.\u003c/td\u003e\n     \u003c/tr\u003e  \n     \u003ctr\u003e\n             \u003ctd\u003eapp:autoFlipBackTime=\"1000\"\u003c/td\u003e\n             \u003ctd\u003e1000\u003c/td\u003e\n             \u003ctd\u003eThe time in milliseconds (ms), after the card will be flipped back to original front side.\u003c/td\u003e\n          \u003c/tr\u003e \n    \u003c/table\u003e\n\nIn Code (Java)\n----\n```java\n// Flips the view with or without animation\nmYourFlipView.flipTheView();\nmYourFlipView.flipTheView(false);\n\n// Sets and Gets the Flip Animation Duration in milliseconds (Default is 400 ms)\nmYourFlipView.setFlipDuration(1000);\nint dur = mYourFlipView.getFlipDuration();\n\n// Sets and gets the flip enable status (Default is true)\nmYourFlipView.setFlipEnabled(false);\nboolean flipStatus = mYourFlipView.isFlipEnabled();\n\n// Sets and gets the flip on touch status (Default is true)\nmYourFlipView.setFlipOntouch(false);\nboolean flipTouchStatus = mYourFlipView.isFlipOnTouch();\n\n// Get current flip state in enum (FlipState.FRONT_SIDE or FlipState.BACK_SIDE)\nEasyFlipView.FlipState flipSide = mYourFlipView.getCurrentFlipState();\n\n// Get whether front/back side of flip is visible or not.\nboolean frontVal = mYourFlipView.isFrontSide();\nboolean backVal = mYourFlipView.isBackSide();\n\n// Get/Set the FlipType to FlipType.Horizontal\nboolean isHorizontal = mYourFlipView.isHorizontalType();\nmYourFlipView.setToHorizontalType();\n\n// Get/Set the FlipType to FlipType.Vertical\nboolean isVertical = mYourFlipView.isVerticalType();\nmYourFlipView.setToVerticalType();\n\n// Get/Set if the auto flip back is enabled\nboolean isAutoFlipBackEnabled = mYourFlipView.isAutoFlipBack();\nmYourFlipView.setAutoFlipBack(true);\n\n// Get/Set the time in milliseconds (ms) after the view is auto flip back to original front side\nint autoflipBackTimeInMilliseconds = mYourFlipView.getAutoFlipBackTime();\nmYourFlipView.setAutoFlipBackTime(2000);\n\n// Sets the animation direction from left (horizontal) and back (vertical)\neasyFlipView.setFlipTypeFromLeft();\n\n// Sets the animation direction from right (horizontal) and front (vertical)\neasyFlipView.setFlipTypeFromRight();\n\n// Sets the animation direction from front (vertical) and right (horizontal)\neasyFlipView.setFlipTypeFromFront();\n\n// Sets the animation direction from back (vertical) and left (horizontal)\neasyFlipView.setFlipTypeFromBack();\n\n// Returns the flip type from direction. For horizontal, it will be either right or left and for vertical, it will be front or back.\neasyFlipView.getFlipTypeFrom();\n\n```\n\nFlip Animation Listener\n---\n```java\nEasyFlipView easyFlipView = (EasyFlipView) findViewById(R.id.easyFlipView);\neasyFlipView.setOnFlipListener(new EasyFlipView.OnFlipAnimationListener() {\n            @Override\n            public void onViewFlipCompleted(EasyFlipView flipView, EasyFlipView.FlipState newCurrentSide) \n            {\n                \n                // ...\n                // Your code goes here\n                // ...\n                \n            }\n        });\n```\n\n❌ Known Issues\n=============\nThe `EasyFlipView` doesn't flip when used in `RecyclerView`. This is because the `EasyFlipView` uses the `onTouch()` method to intercept the touch events and flip the view accordingly. One easier solution is to disable the `flipOnTouch` attribute in XML by this.\n```xml\napp:flipOnTouch=\"false\"\n```\nNow, your `RecyclerView` will scroll but the `EasyFlipView` will not flip or animate on touch etc. You will have to manually flip the view by calling the method `mYourFlipView.flipTheView()` inside the adapter or `ViewHolder` class of the `RecyclerView`. For example,\n```java\npublic class MyRecyclerViewAdapter extends RecyclerView.Adapter\u003cMyRecyclerViewAdapter.ViewHolder\u003e {\n\n    private List\u003cObject\u003e mData;\n    private LayoutInflater mInflater;\n    private ItemClickListener mClickListener;\n\n    // data is passed into the constructor\n    MyRecyclerViewAdapter(Context context, List\u003cObject\u003e data) {\n        this.mInflater = LayoutInflater.from(context);\n        this.mData = data;\n    }\n\n    // inflates the row layout from xml when needed\n    @Override\n    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {\n        View view = mInflater.inflate(R.layout.recyclerview_row, parent, false);\n        return new ViewHolder(view);\n    }\n\n    // binds the data to the TextView in each row\n    @Override\n    public void onBindViewHolder(ViewHolder holder, int position) {\n        String textData = (String) mData.get(position);\n        holder.myTextView.setText(textData);\n    }\n\n    // total number of rows\n    @Override\n    public int getItemCount() {\n        return mData.size();\n    }\n\n\n    // stores and recycles views as they are scrolled off screen\n    public class ViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {\n        TextView myTextView;\n\tEasyFlipView myEasyFlipView;\n\n        ViewHolder(View itemView) {\n            super(itemView);\n            myTextView = itemView.findViewById(R.id.tvAnimalName);\n\t    myEasyFlipView = itemView.findViewById(R.id.myEasyFlipView);\n            itemView.setOnClickListener(this);\n        }\n\n        @Override\n        public void onClick(View view) {\n\t    myEasyFlipView.flipTheView();\n            if (mClickListener != null) {\n\t    \tmClickListener.onItemClick(view, getAdapterPosition());\n\t    }\n        }\n    }\n\n    // convenience method for getting data at click position\n    String getItem(int id) {\n        return mData.get(id);\n    }\n\n    // allows clicks events to be caught\n    void setClickListener(ItemClickListener itemClickListener) {\n        this.mClickListener = itemClickListener;\n    }\n\n    // parent activity will implement this method to respond to click events\n    public interface ItemClickListener {\n        void onItemClick(View view, int position);\n    }\n}\n```\n___\n\nThe `EasyFlipView` has a strange behaviour when the back and front layouts are a `CardView`. To workaround it, wrap your `CardView` in a `FrameLayout` or other `ViewGroup`.\n\n💰 Donations\n=============\n\nThis project needs you! If you would like to support this project's further development, the creator of this project or the continuous maintenance of this project, feel free to donate. Your donation is highly appreciated (and I love food, coffee and beer). Thank you!\n\n**PayPal**\n\n* **[Donate $5](https://www.paypal.me/WajahatKarim/5)**: Thank's for creating this project, here's a tea (or some juice) for you!\n* **[Donate $10](https://www.paypal.me/WajahatKarim/10)**: Wow, I am stunned. Let me take you to the movies!\n* **[Donate $15](https://www.paypal.me/WajahatKarim/15)**: I really appreciate your work, let's grab some lunch!\n* **[Donate $25](https://www.paypal.me/WajahatKarim/25)**: That's some awesome stuff you did right there, dinner is on me!\n* **[Donate $50](https://www.paypal.me/WajahatKarim/50)**: I really really want to support this project, great job!\n* **[Donate $100](https://www.paypal.me/WajahatKarim/100)**: You are the man! This project saved me hours (if not days) of struggle and hard work, simply awesome!\n* **[Donate $2799](https://www.paypal.me/WajahatKarim/2799)**: Go buddy, buy Macbook Pro for yourself!\n\nOf course, you can also choose what you want to donate, all donations are awesome!\n\n👨 Developed By\n============\n```\nWajahat Karim\n```\n- Website (http://wajahatkarim.com)\n- Twitter (http://twitter.com/wajahatkarim)\n- Medium (http://www.medium.com/@wajahatkarim3)\n- LinkedIn (http://www.linkedin.com/in/wajahatkarim)\n\n💖 Special Thanks\n=========\n- [**iGio90**](https://github.com/iGio90) for adding dynamic views support [Pull Request # 10](https://github.com/wajahatkarim3/EasyFlipView/pull/10)\n- [**Sachin Varma**](https://www.linkedin.com/in/sachin-varma-58b243118/) for adding vertical animations support [Pull Request # 12](https://github.com/wajahatkarim3/EasyFlipView/pull/12)\n- [**Sachin Varma**](https://www.linkedin.com/in/sachin-varma-58b243118/) for adding multi-dimension animations support [Pull Request # 23](https://github.com/wajahatkarim3/EasyFlipView/pull/23)\n- [**Sachin Varma**](https://www.linkedin.com/in/sachin-varma-58b243118/) for adding multi-dimension animations support [Pull Request # 23](https://github.com/wajahatkarim3/EasyFlipView/pull/23)\n- [**Daniel Luque**](https://github.com/DrankoLQ) for updating the `targetSdk` to 28 [Pull Request # 30](https://github.com/wajahatkarim3/EasyFlipView/pull/30)\n- [**Aditya Zope**](https://github.com/adzo261) for adding the feature to flip card only once. [Pull Request # 33](https://github.com/wajahatkarim3/EasyFlipView/pull/33)\n- [**Bruno Correia**](https://github.com/bffcorreia) for removing `\u003capplication\u003e` tag from `AndroidManifest.xml`. [Pull Request # 38](https://github.com/wajahatkarim3/EasyFlipView/pull/38) and fixing the card animation glitch issue [Pull Request # 39](https://github.com/wajahatkarim3/EasyFlipView/pull/39)\n\n\n# 👍 How to Contribute\n1. Fork it\n2. Create your feature branch (git checkout -b my-new-feature)\n3. Commit your changes (git commit -am 'Add some feature')\n4. Push to the branch (git push origin my-new-feature)\n5. Create new Pull Request\n\n# 📃 License\n\n    Copyright 2018 Wajahat Karim\n\n    Licensed under the Apache License, Version 2.0 (the \"License\");\n    you may not use this file except in compliance with the License.\n    You may obtain a copy of the License at\n\n       http://www.apache.org/licenses/LICENSE-2.0\n\n    Unless required by applicable law or agreed to in writing, software\n    distributed under the License is distributed on an \"AS IS\" BASIS,\n    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n    See the License for the specific language governing permissions and\n    limitations under the License.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwajahatkarim3%2FEasyFlipView","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwajahatkarim3%2FEasyFlipView","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwajahatkarim3%2FEasyFlipView/lists"}