Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/lopspower/CircularImageView
Create circular ImageView in Android in the simplest way possible
https://github.com/lopspower/CircularImageView
android circularimageview
Last synced: 12 days ago
JSON representation
Create circular ImageView in Android in the simplest way possible
- Host: GitHub
- URL: https://github.com/lopspower/CircularImageView
- Owner: lopspower
- License: apache-2.0
- Created: 2013-07-16T08:32:48.000Z (over 11 years ago)
- Default Branch: master
- Last Pushed: 2022-10-11T08:46:25.000Z (about 2 years ago)
- Last Synced: 2024-10-01T00:58:25.955Z (about 1 month ago)
- Topics: android, circularimageview
- Language: Kotlin
- Homepage:
- Size: 4.89 MB
- Stars: 1,951
- Watchers: 69
- Forks: 412
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
- awesome-kotlin - CircularImageView - Create circular ImageView in Android in the simplest way possible (Libraries)
- awesome-github-android-ui - CircularImageView - 以简单的方法实现环形ImageView (ImageView)
- awesome - CircularImageView - Create circular ImageView in Android in the simplest way possible (android)
- awesome - CircularImageView - Create circular ImageView in Android in the simplest way possible (circularimageview)
README
CircularImageView
=================
[](http://developer.android.com/index.html)
[](https://android-arsenal.com/api?level=14)
[](https://search.maven.org/artifact/com.mikhaellopez/circularimageview)
[](http://twitter.com/lopezmikhael)
This is an Android project allowing to realize a circular ImageView in the simplest way possible.
USAGE
-----
To make a circular ImageView add CircularImageView in your layout XML and add CircularImageView library in your project or you can also grab it via Gradle:
```groovy
implementation 'com.mikhaellopez:circularimageview:4.3.1'
```
XML
-----
```xml
```
You must use the following properties in your XML to change your CircularImageView.
| Properties | Type | Default |
| -------------------------------- | ------------------------------------------------------------ | ---------------- |
| `app:civ_circle_color` | color | WHITE |
| `app:civ_circle_color_start` | color | civ_circle_color |
| `app:civ_circle_color_end` | color | civ_circle_color |
| `app:civ_color_direction` | left_to_right, right_to_left, top_to_bottom or bottom_to_top | left_to_right |
| `app:civ_border` | boolean | true |
| `app:civ_border_width` | dimension | 4dp |
| `app:civ_border_color` | color | WHITE |
| `app:civ_border_color_start` | color | civ_border_color |
| `app:civ_border_color_end` | color | civ_border_color |
| `app:civ_border_color_direction` | left_to_right, right_to_left, top_to_bottom or bottom_to_top | left_to_right |
| `app:civ_shadow` | boolean | false |
| `app:civ_shadow_color` | color | BLACK |
| `app:civ_shadow_radius` | dimension | 8dp |
| `app:civ_shadow_gravity` | center, top, bottom, start or end | bottom |
:information_source: You can also use `android:elevation` instead of `app:civ_shadow` to have default Material Design elevation.
KOTLIN
-----
```kotlin
val circularImageView = findViewById(R.id.circularImageView)
circularImageView.apply {
// Set Color
circleColor = Color.WHITE
// or with gradient
circleColorStart = Color.BLACK
circleColorEnd = Color.RED
circleColorDirection = CircularImageView.GradientDirection.TOP_TO_BOTTOM
// Set Border
borderWidth = 10f
borderColor = Color.BLACK
// or with gradient
borderColorStart = Color.BLACK
borderColorEnd = Color.RED
borderColorDirection = CircularImageView.GradientDirection.TOP_TO_BOTTOM
// Add Shadow with default param
shadowEnable = true
// or with custom param
shadowRadius = 7f
shadowColor = Color.RED
shadowGravity = CircularImageView.ShadowGravity.CENTER
}
```
JAVA
-----
```java
CircularImageView circularImageView = findViewById(R.id.circularImageView);
// Set Color
circularImageView.setCircleColor(Color.WHITE);
// or with gradient
circularImageView.setCircleColorStart(Color.BLACK);
circularImageView.setCircleColorEnd(Color.RED);
circularImageView.setCircleColorDirection(CircularImageView.GradientDirection.TOP_TO_BOTTOM);
// Set Border
circularImageView.setBorderWidth(10f);
circularImageView.setBorderColor(Color.BLACK);
// or with gradient
circularImageView.setBorderColorStart(Color.BLACK);
circularImageView.setBorderColorEnd(Color.RED);
circularImageView.setBorderColorDirection(CircularImageView.GradientDirection.TOP_TO_BOTTOM);
// Add Shadow with default param
circularImageView.setShadowEnable(true);
// or with custom param
circularImageView.setShadowRadius(7f);
circularImageView.setShadowColor(Color.RED);
circularImageView.setShadowGravity(CircularImageView.ShadowGravity.CENTER);
```
LIMITATIONS
-----
- By default the ScaleType is **FIT_CENTER**. You can also used **CENTER_INSIDE** AND **CENTER_CROP**.
- Enabling adjustViewBounds is not supported as this requires an unsupported ScaleType.
SUPPORT ❤️
-----
Find this library useful? Support it by joining [**stargazers**](https://github.com/lopspower/CircularImageView/stargazers) for this repository ⭐️
And [**follow me**](https://github.com/lopspower?tab=followers) for my next creations 👍
LICENCE
-----
CircularImageView by [Lopez Mikhael](http://mikhaellopez.com/) is licensed under a [Apache License 2.0](http://www.apache.org/licenses/LICENSE-2.0).