{"id":13428352,"url":"https://github.com/robertlevonyan/material-chip-view","last_synced_at":"2025-05-16T01:04:55.024Z","repository":{"id":37394897,"uuid":"83577166","full_name":"robertlevonyan/material-chip-view","owner":"robertlevonyan","description":"Material Chip view. Can be used as tags for categories, contacts or creating text clouds","archived":false,"fork":false,"pushed_at":"2025-05-08T04:33:10.000Z","size":1279,"stargazers_count":1350,"open_issues_count":1,"forks_count":151,"subscribers_count":24,"default_branch":"master","last_synced_at":"2025-05-08T05:27:27.599Z","etag":null,"topics":["android","android-development","android-library","api","chip","gradle","material-chip","material-design","material-ui","tag","tags","text","view"],"latest_commit_sha":null,"homepage":"","language":"Kotlin","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/robertlevonyan.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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,"zenodo":null}},"created_at":"2017-03-01T16:38:22.000Z","updated_at":"2025-05-08T04:33:13.000Z","dependencies_parsed_at":"2022-07-15T21:17:11.773Z","dependency_job_id":"e65fc3ca-d310-4153-895c-5f30aebfe16f","html_url":"https://github.com/robertlevonyan/material-chip-view","commit_stats":null,"previous_names":["robertlevonyan/materialchipview"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/robertlevonyan%2Fmaterial-chip-view","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/robertlevonyan%2Fmaterial-chip-view/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/robertlevonyan%2Fmaterial-chip-view/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/robertlevonyan%2Fmaterial-chip-view/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/robertlevonyan","download_url":"https://codeload.github.com/robertlevonyan/material-chip-view/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254448579,"owners_count":22072764,"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-development","android-library","api","chip","gradle","material-chip","material-design","material-ui","tag","tags","text","view"],"created_at":"2024-07-31T01:00:53.746Z","updated_at":"2025-05-16T01:04:54.976Z","avatar_url":"https://github.com/robertlevonyan.png","language":"Kotlin","readme":"# Material Chip View\n\n|Material Chip view. Can be used as tags for categories, contacts or creating text clouds. This library can be an alternative for Material Chip from Jetpack library.|\u003cimg src=\"https://github.com/robertlevonyan/materialChipView/blob/master/images/chip.png\"  width=\"500\" /\u003e|\n|----------------------------------------------------------------------------------------------|-----------|\n\n| Android Arsenal             | [![Android Arsenal](https://img.shields.io/badge/Android%20Arsenal-Material%20Chip%20View-yellow.svg?style=flat-square)](https://android-arsenal.com/details/1/5396) [![API](https://img.shields.io/badge/API-16%2B-yellow.svg?style=flat-square)](https://android-arsenal.com/api?level=16) |\n|-----------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| MaterialChipVersion         | [![Maven Central](https://maven-badges.herokuapp.com/maven-central/com.robertlevonyan.view/MaterialChipView/badge.svg)](https://maven-badges.herokuapp.com/maven-central/com.robertlevonyan.view/MaterialChipView)                                                                           |\n| ComposeChipVersion          | [![Maven Central](https://maven-badges.herokuapp.com/maven-central/com.robertlevonyan.compose/materialchip/badge.svg)](https://maven-badges.herokuapp.com/maven-central/com.robertlevonyan.compose/materialchip)                                                                             |\n| Material3ComposeChipVersion | [![Maven Central](https://maven-badges.herokuapp.com/maven-central/com.robertlevonyan.compose/material3chip/badge.svg)](https://maven-badges.herokuapp.com/maven-central/com.robertlevonyan.compose/material3chip)                                                                           |\n\n## Setup\n\nAdd following line of code to your project level gradle file\n\n```kotlin\n  repositories {\n    mavenCentral()\n  }\n```\n\nAdd following line of code to your module(app) level gradle file\n\n#### Groovy:\n\n```groovy\n    implementation 'com.robertlevonyan.view:MaterialChipView:\u003cMaterialChipVersion\u003e'\n```\n\n#### Kotlin:\n\n```kotlin\n    implementation(\"com.robertlevonyan.view:MaterialChipView:$MaterialChipVersion\")\n```\n\n#### Maven:\n\n```xml\n  \u003cdependency\u003e\n    \u003cgroupId\u003ecom.robertlevonyan.view\u003c/groupId\u003e\n    \u003cartifactId\u003eMaterialChipView\u003c/artifactId\u003e\n    \u003cversion\u003eMaterialChipVersion\u003c/version\u003e\n    \u003ctype\u003epom\u003c/type\u003e\n  \u003c/dependency\u003e\n```\n\n### For Jetpack Compose version\n\n```kotlin\n    implementation(\"com.robertlevonyan.compose:materialchip:$ComposeChipVersion\")\n```\nor if you want to yse Material3 version\n```kotlin\n    implementation(\"com.robertlevonyan.compose:material3chip:$Material3ComposeChipVersion\")\n```\n\n## Usage\n\n```xml\n  \u003ccom.robertlevonyan.views.chip.Chip\n    android:id=\"@+id/chip\"\n    android:layout_width=\"wrap_content\"\n    android:layout_height=\"wrap_content\"\n    android:text=\"@string/customTitle\" /\u003e\n```\n![alt text](https://github.com/robertlevonyan/materialChipView/blob/master/images/chip.jpg)\n\n### Cutomizing Chip\n\n```xml\n    app:mcv_closable=\"true\"\n```\n![alt text](https://github.com/robertlevonyan/materialChipView/blob/master/images/chip_closable.jpg)\n\n```xml\n    app:mcv_selectable=\"true\"\n```\n|![alt text](https://github.com/robertlevonyan/materialChipView/blob/master/images/chip_selectable_0.jpg)|![alt text](https://github.com/robertlevonyan/materialChipView/blob/master/images/chip_selectable_1.jpg)|\n|----------------------------------------------------------------------------------------------|-----------|\n\n```xml\n    app:mcv_chipIcon=\"@drawable/customIcon\"\n```\n![alt text](https://github.com/robertlevonyan/materialChipView/blob/master/images/chip_icon.jpg)\n\n```xml\n    app:mcv_backgroundColor=\"@color/customChipBackgroundColor\"\n    app:mcv_closeColor=\"@color/customCloseIconColor\"\n    app:mcv_selectedBackgroundColor=\"@color/customSelectedChipColor\"\n    app:mcv_textColor=\"@color/customTitleColor\"\n```\n\n|![alt text](https://github.com/robertlevonyan/materialChipView/blob/master/images/chip_cloud_0.jpg)|![alt text](https://github.com/robertlevonyan/materialChipView/blob/master/images/chip_cloud_1.jpg)|\n|----------------------------------------------------------------------------------------------|-----------|\n\n### Attributes\n\n|Custom Atributes                 |Description                                 |\n|---------------------------------|--------------------------------------------|\n|`app:mcv_textColor`              |Custom color for text label                 |\n|`app:mcv_backgroundColor`        |Custom background color                     |\n|`app:mcv_selectedBackgroundColor`|Custom background color when selected       |\n|`app:mcv_chipIcon`               |Icon resource for Chip                      |\n|`app:mcv_closable`               |Chip with close button                      |\n|`app:mcv_closeColor`             |Custom color for close button               |\n|`app:mcv_selectable`             |Chip with selection button                  |\n|`app:mcv_selectedTextColor`      |Custom color for label when selected        |\n|`app:mcv_cornerRadius`           |Change the corner radius of your Chip       |\n|`app:mcv_strokeSize`             |Add stroke to your Chip                     |\n|`app:mcv_strokeColor`            |Choose a custom stroke color for your Chip  |\n|`app:mcv_selectedStrokeSize`     |Stroke size when selected                   |\n|`app:mcv_selectedStrokeColor`    |Custom stroke color when selected  \t\t   |\n|`app:mcv_iconText`               |Instead of an image create icon from String |\n|`app:mcv_iconTextColor`          |Select a color for your String icon         |\n|`app:mcv_iconTextBackgroundColor`|Select a background color for String icon   |\n\n### Setting Listeners\n\n```kotlin\n    val chip = findViewById(R.id.chip);\n```\nChip click listener\n```kotlin\n    chip.setOnClickListener { view -\u003e\n         //Your action here...\n    }\n```\n\nOn Close button click listener\n```kotlin\n    chip.setOnCloseClickListener { view -\u003e\n         //Your action here...\n    }\n\n```\n\nOn Icon click listener\n```kotlin\n    chip.setOnIconClickListener { view -\u003e\n         //Your action here...\n    }\n\n```\n\nOn Select button click listener\n```kotlin\n    chip.setOnSelectClickListener { view: View, selected: Boolean -\u003e\n         //Your action here...\n    }\n```\n### Customizing Chip from code\n\n```kotlin\n        chip.text = \"My awesome Chip\" // Set Chip label\n        chip.chipTextColor = chipTextColor // Set Chip label color\n        chip.chipBackgroundColor = chipBackgroundColor //Set custom background color\n        chip.chipSelectedBackgroundColor = chipSelectedBackgroundColor //Set custom background color when selected\n        chip.chipIcon = myIconDrawable //Set Icon Drawable for Chip\n        chip.chipIconBitmap = myIconBitmap //Set Icon Bitmap for Chip\n        chip.closable = true //Set Chip has close button\n        chip.chipCloseColor = chipCloseColor //Set custom color for close button\n        chip.chipSelectedCloseColor = chipSelectedCloseColor //Set custom color for close button on selected state\n        chip.selectable = false //Set Chip has selection button\n        chip.chipSelected = true // Set Chip selected\n        chip.chipSelectedTextColor = chipSelectedTextColor //Set custom color for label when selected\n        chip.cornerRadius = 5 // Set corner radius of your Chip\n        chip.strokeSize = 2 // Set width of stroke\n        chip.strokeColor = strokeColor // Set stroke color for your Chip\n        chip.selectedStrokeSize = 2 // Set width of stroke when selected\n        chip.selectedStrokeColor = selectedStrokeColor // Set stroke color for your Chip when selected\n        chip.setIconText(text, iconTextColor, iconTextBackgroundColor); // Set Chip icon text, text color and background color (in case of Kotlin iconTextColor and iconTextBackgroundColor have default value of 0)\n        chip.chipHorizontalPadding = 10 // Set horizontal padding for chip\n```\n\n### For Jetpack Compose version\n\n```kotlin\nsetContent {\n  Box(modifier = Modifier.fillMaxWidth()) {\n    MaterialChip(\n      text = \"Some Text\",\n      chipIcon = ChipIconRes(icon = R.drawable.android), // ChipIconBitmap or ChipIconDrawable\n      interaction = ChipInteraction.Closable, // Selectable, SelectableWithoutIcon or None\n      strokeSize = 1.dp,\n      selectedStrokeSize = 2.dp,\n      strokeColor = Color.Red,\n      selectedStrokeColor = Color.Blue,\n      onSelectClick = { selected -\u003e\n        // your code here\n      },\n      onIconClick = {\n        // your code here\n      },\n      onChipClick = {\n        // your code here\n      },\n      onCloseClick = {\n        // your code here\n      }\n    )\n  }\n}\n```\n\nAlso there is a `MaterialChipGroup` available for Jetpack Compose version\n```kotlin\nsetContent {\n  Box(modifier = Modifier.fillMaxWidth()) {\n    MaterialChipGroup(\n      items = listOf(\"Chip1\", \"Chip2\", \"Chip3\"),\n      createTitle = { it }, //returns a String for the title\n      initialSelectedElementIndex = 1, // default value is -1 (means nothing is selected)\n      onItemSelected = { position, element -\u003e\n        // do something\n      },\n      // the rest is for Chip appearance\n      interaction = ChipInteraction.Selectable,\n      strokeSize = 1.dp,\n      selectedStrokeSize = 2.dp,\n      strokeColor = Color.Red,\n      selectedStrokeColor = Color.Blue,\n      backgroundColor = Color.Red,\n      selectedBackgroundColor = Color.Blue,\n    )\n  }\n}\n```\n\n## Versions\n\n### 1.0.0 (Material3)\n\nJetpack compose version with Material 3 styling\n\n### 3.0.0\n\nJetpack Compose support added\nChip Group added for JetpackCompose\n\n#### 2.2.1 - 2.2.7\n\nUpdate to Java 11\nSDK 31 ready\nMinor updates\n\n### 2.2.0\n\nMigration to mavenCentral\n\n#### 2.1.1 - 2.1.7\n\nMinor changes, some missing parts pushed\n\n#### 2.1.0\n\nNew update, now it is possible to make chip selectable without selection icon\n\n#### 2.0.1 - 2.0.7\n\nMinor changes, some missing parts pushed\n\n### 2.0.0\n\nNew version of the library. Fully rewritten with Kotlin and AndroidX ready 🤩 \n\n#### 1.2.1, 1.2.2\n\nGeneral bug fixed\n\n#### 1.1.3\n\nSelection option added\n\n#### 1.1.2\n\nIcon text issue fixed\n\n#### 1.1.1\n\nUpdated version of Material Chip View:\n    - the attribute names are changed to escape conflicts with other libs\n    - added new features like customizable corner radius and stroke\n    - recreation issue fixed for post Lollipop versions\n\n#### 1.0.1\n\nRecreation issues are fixed\n\n### 1.0.0\n\nFirst version of library\n\n## Contact\n\n- **Email**: me@robertlevonyan.com\n- **Website**: https://robertlevonyan.com/\n- **Medium**: https://medium.com/@RobertLevonyan\n- **Twitter**: https://twitter.com/@RobertLevonyan\n- **Facebook**: https://facebook.com/robert.levonyan\n- **Google Play**: https://play.google.com/store/apps/dev?id=5477562049350283357\n\n\u003ca href=\"https://www.buymeacoffee.com/robertlevonyan\"\u003e\n  \u003cimg src=\"https://github.com/robertlevonyan/material-chip-view/blob/master/images/coffee.jpeg\"  width=\"300\" /\u003e\n\u003c/a\u003e\n\n## Licence\n\n```\n    Material Chip View©\n    Copyright 2022 Robert Levonyan\n    Url: https://github.com/robertlevonyan/materialChipView\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```\n","funding_links":["https://www.buymeacoffee.com/robertlevonyan"],"categories":["Libraries"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frobertlevonyan%2Fmaterial-chip-view","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frobertlevonyan%2Fmaterial-chip-view","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frobertlevonyan%2Fmaterial-chip-view/lists"}