{"id":13700374,"url":"https://github.com/vitorhugods/AvatarView","last_synced_at":"2025-05-04T18:35:08.256Z","repository":{"id":37601774,"uuid":"149751854","full_name":"vitorhugods/AvatarView","owner":"vitorhugods","description":"A circular Image View with a lot of perks. Including progress animation and highlight state with borders and gradient color.","archived":false,"fork":false,"pushed_at":"2022-09-22T12:23:18.000Z","size":5026,"stargazers_count":552,"open_issues_count":2,"forks_count":41,"subscribers_count":7,"default_branch":"main","last_synced_at":"2025-04-26T07:52:44.667Z","etag":null,"topics":["android","android-library","android-ui","hacktoberfest","imageview","kotlin-android","kotlin-library","progress-animation","progress-bar","progress-circle","widget"],"latest_commit_sha":null,"homepage":"","language":"Kotlin","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/vitorhugods.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-09-21T11:03:12.000Z","updated_at":"2025-03-11T07:58:53.000Z","dependencies_parsed_at":"2023-01-17T16:47:17.864Z","dependency_job_id":null,"html_url":"https://github.com/vitorhugods/AvatarView","commit_stats":null,"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitorhugods%2FAvatarView","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitorhugods%2FAvatarView/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitorhugods%2FAvatarView/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vitorhugods%2FAvatarView/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vitorhugods","download_url":"https://codeload.github.com/vitorhugods/AvatarView/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252383198,"owners_count":21739288,"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","android-ui","hacktoberfest","imageview","kotlin-android","kotlin-library","progress-animation","progress-bar","progress-circle","widget"],"created_at":"2024-08-02T20:00:54.958Z","updated_at":"2025-05-04T18:35:03.236Z","avatar_url":"https://github.com/vitorhugods.png","language":"Kotlin","funding_links":[],"categories":["Kotlin"],"sub_categories":[],"readme":"# AvatarView\nA circular Image View with a lot of perks. Including progress animation and highlight state with borders and gradient color.\n\n[![Gradle](https://img.shields.io/badge/MavenCentral-1.2.0-brightgreen.svg)](https://github.com/vitorhugods/AvatarView/releases)\n[![Codacy Badge](https://api.codacy.com/project/badge/Grade/e4847d7f36754c1a8efb1aff838fdb91)](https://app.codacy.com/app/vitorhugods/AvatarView?utm_source=github.com\u0026utm_medium=referral\u0026utm_content=vitorhugods/AvatarView\u0026utm_campaign=Badge_Grade_Dashboard)\n![Kotlin](https://img.shields.io/badge/minSdkVersion-14-brightgreen.svg)\n![Kotlin](https://img.shields.io/badge/Kotlin-100%25-orange.svg)\n[![GitHub license](https://img.shields.io/badge/license-Apache%20License%202.0-blue.svg?style=flat)](http://www.apache.org/licenses/LICENSE-2.0)\n[![Say Thanks!](https://img.shields.io/badge/Say%20Thanks-!-1EAEDB.svg)](https://saythanks.io/to/vitorschwaab@outlook.com)\n\n\u003cdiv align=\"center\"\u003e\n  \u003csub\u003eBuilt with ❤︎ by Vitor Hugo Schwaab and\n  \u003ca href=\"https://github.com/vitorhugods/AvatarView/graphs/contributors\"\u003e\n    contributors\n  \u003c/a\u003e\n\u003c/div\u003e\n\u003cbr/\u003e\n\n### Samples\n|   |   |\n|:-:|:-:|\n| \u003cimg  src=\"/pics/ex1.png\" alt=\"Example 1\" width=\"300\" style=\"max-width:100%;\"\u003e | \u003cimg  src=\"/pics/ex2.png\" alt=\"Example 1\" width=\"300\" style=\"max-width:100%;\"\u003e |\n| \u003cimg src=\"/pics/sample1.gif\" alt=\"Example 1\" width=\"300\" style=\"max-width:100%;\"\u003e | \u003cimg src=\"/pics/sample2.gif\" alt=\"Example 1\" width=\"300\" style=\"max-width:100%;\"\u003e  |\n\n\nSupports initials if no image is provided:\n\n\u003cimg  src=\"/pics/initials.png\" alt=\"Initials\" width=\"200\" style=\"max-width:100%;\"\u003e\n\nThanks to [@anoop44](https://github.com/anoop44)\n\nSupports a badge, for \"online/offline\" status or other use cases:\n\n\u003cimg  src=\"/pics/badge.png\" alt=\"Badge\" width=\"200\" style=\"max-width:100%;\"\u003e\n\nThanks to [@p1yu5h](https://github.com/p1yu5h)\n\n## Demo\n[Watch the video](https://vimeo.com/291110435) or clone the repo and build the demo app\n\n## Gradle setup\n\nMake sure you have the MavenCentral in your list of repositories.\n\n* Kotlin DSL `build.gradle.kts`\n```kotlin\ndependencies {\n    implementation(\"xyz.schwaab:avvylib:1.2.0\")\n}\n```\n* Or, Groovy `build.gradle`\n```gradle\ndependencies {\n    implementation \"xyz.schwaab:avvylib:1.2.0\"\n}\n```\n\n## Usage\n\nJust add this to your XML:\n```xml\n    \u003cxyz.schwaab.avvylib.AvatarView\n        android:layout_width=\"128dp\"\n        android:layout_height=\"128dp\"\n        app:avvy_border_color=\"@color/grey400\"\n        app:avvy_border_highlight_color=\"#ff5900\"\n        app:avvy_border_highlight_color_end=\"#bf15bc\"\n        app:avvy_border_thickness=\"2dp\"\n        app:avvy_border_thickness_highlight=\"3dp\"\n        app:avvy_distance_to_border=\"5dp\"\n        app:avvy_highlighted=\"true\"\n        app:avvy_loading_arches=\"5\"\n        app:avvy_loading_arches_degree_area=\"90\"/\u003e\n```\n\nAdd the name initials as fallback:\n```xml\n        app:avvy_text=\"Avatar View\"                 //will show up as AV\n        app:avvy_text_size=\"42sp\"\n        app:avvy_text_color=\"#ccc\"\n```\n\nAdd the badge if you want:\n```xml\n        app:avvy_show_badge=\"true\"                  //Default = false\n        app:avvy_badge_radius=\"18dp\"\n        app:avvy_badge_stroke_width=\"2dp\"\n        app:avvy_badge_stroke_color=\"@color/white\"\n        app:avvy_badge_position=\"BOTTOM_RIGHT\"      //Default value\n```\n\nYou can personalize it in Kotlin:\n```kotlin\n        avatarView.apply {\n            isAnimating = false\n            borderThickness = 18\n            highlightBorderColor = Color.GREEN\n            highlightBorderColorEnd = Color.CYAN\n            numberOfArches = 0\n            totalArchesDegreeArea = 80\n            text = \"Avatar View\"\n            showBadge = true\n            badgePosition = BadgePosition.TOP_LEFT\n        }\n```\n\nOr, in Java:\n```java\n        avatarView.setAnimating(false);\n        avatarView.setBorderThickness(18);\n        avatarView.setHighlightBorderColor(Color.GREEN);\n        avatarView.setHighlightBorderColorEnd(Color.CYAN);\n        avatarView.setNumberOfArches(0);\n        avatarView.setTotalArchesDegreeArea(80);\n```\n\n### Custom Animations\n\n\u003cimg src=\"/pics/custom_animations.gif\" alt=\"Example 1\" width=\"300\" style=\"max-width:100%;\"\u003e\n\nCreate an AvatarViewAnimationOrchestrator, passing at least one AvatarViewAnimator.\n\nThe `setupAnimators` are the first running, and they run in reverse when animation is stopping. They should not repead infinitely, so the `progressAnimators` can start.\nThe `progressAnimators` can run indefinitely.\n\nYou don't need to use both setup and progress, just one is enough. But, by having the setup having a finite duration, and reversible, it allows for a smoother animation stop.\n\nExample:\n```kotlin\n\n    val archesExpansion = object: AvatarViewAnimator{\n        override val baseAnimator = ValueAnimator.ofFloat(0f, 1f).apply {\n            duration = 500L\n            interpolator = DecelerateInterpolator()\n        }\n    \n        override fun onValueUpdate(animatorInterface: AvatarView.AnimatorInterface) {\n            val animatedValue = baseAnimator.animatedValue as Float\n            animatorInterface.updateAnimationState { currentState -\u003e\n                currentState.copy(archesExpansionProgress = animatedValue)\n            }\n        }\n    }\n    val bouncingRotation = object : AvatarViewAnimator {\n        override val baseAnimator = ValueAnimator.ofFloat(0f, 1f).apply {\n            repeatCount = ValueAnimator.INFINITE\n            duration = 3000L\n            interpolator = BounceInterpolator()\n        }\n    \n        override fun onValueUpdate(animatorInterface: AvatarView.AnimatorInterface) {\n            val animatedValue = baseAnimator.animatedValue as Float\n            animatorInterface.updateAnimationState { currentState -\u003e\n                currentState.copy(rotationProgress = animatedValue)\n            }\n        }\n    }\n\n    avatarView.animationOrchestrator = AvatarViewAnimationOrchestrator(archesExpansion, bouncingRotation) \n```\n\nCheck the sample app for the full source code.\n\n\n### Special Thanks\nThe roundness of the drawables based on [Henning Dodenhof's Circle ImageView](https://github.com/hdodenhof/CircleImageView)\n\n Libraries used in the demo app: \n - [QuadFlask Color Picker](https://github.com/QuadFlask/colorpicker) \n - [Bubbleseekbar](https://github.com/woxingxiao/BubbleSeekBar)\n \n \n\nLicense\n-------\n\n    Copyright 2020 Vitor Hugo D. Schwaab\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%2Fvitorhugods%2FAvatarView","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvitorhugods%2FAvatarView","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvitorhugods%2FAvatarView/lists"}