{"id":13789481,"url":"https://github.com/skydoves/Orchestra","last_synced_at":"2025-05-12T06:31:36.370Z","repository":{"id":38097712,"uuid":"301044962","full_name":"skydoves/Orchestra","owner":"skydoves","description":"🎺 A collection of Jetpack Compose libraries, which allows you to build tooltips, spinners, and color pickers.","archived":false,"fork":false,"pushed_at":"2023-01-02T14:00:00.000Z","size":357,"stargazers_count":466,"open_issues_count":3,"forks_count":20,"subscribers_count":6,"default_branch":"main","last_synced_at":"2025-04-05T03:09:44.740Z","etag":null,"topics":["android","balloon","colorpicker","compose","jetpack-compose","kotlin","skydoves","spinner"],"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/skydoves.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":".github/CODEOWNERS","security":null,"support":null},"funding":{"github":"skydoves"}},"created_at":"2020-10-04T05:15:14.000Z","updated_at":"2025-01-22T05:28:34.000Z","dependencies_parsed_at":"2023-02-01T03:00:55.383Z","dependency_job_id":null,"html_url":"https://github.com/skydoves/Orchestra","commit_stats":null,"previous_names":[],"tags_count":16,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/skydoves%2FOrchestra","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/skydoves%2FOrchestra/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/skydoves%2FOrchestra/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/skydoves%2FOrchestra/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/skydoves","download_url":"https://codeload.github.com/skydoves/Orchestra/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253687544,"owners_count":21947694,"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","balloon","colorpicker","compose","jetpack-compose","kotlin","skydoves","spinner"],"created_at":"2024-08-03T22:00:24.431Z","updated_at":"2025-05-12T06:31:35.961Z","avatar_url":"https://github.com/skydoves.png","language":"Kotlin","readme":"\n\u003ch1 align=\"center\"\u003eOrchestra\u003c/h1\u003e\u003c/br\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://opensource.org/licenses/Apache-2.0\"\u003e\u003cimg alt=\"License\" src=\"https://img.shields.io/badge/License-Apache%202.0-blue.svg\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://android-arsenal.com/api?level=21\"\u003e\u003cimg alt=\"API\" src=\"https://img.shields.io/badge/API-21%2B-brightgreen.svg?style=flat\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/skydoves/Orchestra/actions/workflows/android.yml\"\u003e\u003cimg alt=\"Build Status\" src=\"https://github.com/skydoves/Orchestra/actions/workflows/android.yml/badge.svg\"/\u003e\u003c/a\u003e \n  \u003ca href=\"https://github.com/skydoves\"\u003e\u003cimg alt=\"Profile\" src=\"https://skydoves.github.io/badges/skydoves.svg\"/\u003e\u003c/a\u003e \n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n🎺 A collection of Jetpack Compose libraries, which are compatible with custom views for Android.\n\u003c/p\u003e\n\u003cp align=\"center\"\u003e\n\u003cimg src=\"https://user-images.githubusercontent.com/24237865/61194943-f9d70380-a6ff-11e9-807f-ba1ca8126f8a.gif\" width=\"32%\"/\u003e\n\u003cimg src=\"https://user-images.githubusercontent.com/24237865/95007367-d58b7d80-0649-11eb-857b-9e0187be70d1.gif\" width=\"30.4%\"/\u003e\n\u003cimg src=\"https://user-images.githubusercontent.com/24237865/71962685-534a6600-323d-11ea-9e1e-df1f68cb2181.gif\" width=\"32%\"/\u003e\n\u003c/p\u003e\n\n## Balloon\n**Orchestra Balloon** was deprecated. Now Balloon supports Jetpack Compose, so please check out [Balloon in Jetpack Compose](https://github.com/skydoves/balloon#balloon-in-jetpack-compose-1).\n\n## ColorPicker\n**Orchestra ColorPicker** allows you to build color picker for getting colors from any images by tapping on the desired color for Jetpack Compose. This is a Jetpack Compose compatible package of [ColorPickerView](https://github.com/skydoves/colorpickerview).\n\n### Download\n\n[![Maven Central](https://img.shields.io/maven-central/v/com.github.skydoves/orchestra-colorpicker.svg?label=Maven%20Central)](https://search.maven.org/search?q=g:%22com.github.skydoves%22%20AND%20a:%22orchestra-colorpicker%22)\u003cbr\u003e\nAdd the dependency below to your **module**'s `build.gradle` file:\n```gradle\ndependencies {\n    implementation \"com.github.skydoves:orchestra-colorpicker:$version\"\n}\n```\n\n\u003cimg src=\"https://user-images.githubusercontent.com/24237865/95007577-416ee580-064c-11eb-92b7-ad30c5b36da0.gif\" align=\"right\" width=\"32%\"/\u003e\n\n### Usage\n`ColorPicker` composable implements a color picker with `AlphaSlideBar` and `BrightnessSlideBar`. We can create an alpha sidebar and brightness sidebar for changing saturation and lightness by tapping on the desired color. They should be used in `children` inner composable in `ColorPicker`, and they receive a `colorPickerView` as a parameter.\n\n```kotlin\nval (selectedColor, setSelectedColor) \n      = remember { mutableStateOf(ColorEnvelope(0)) }\nColorPicker(\n    modifier = Modifier.fillMaxWidth().height(400.dp),\n    onColorListener = { envelope, _ -\u003e\n      setSelectedColor(envelope)\n    },\n    initialColor = purple500,\n    children = { colorPickerView -\u003e\n      Column(modifier = Modifier.padding(top = 32.dp)) {\n        Box(modifier = Modifier.padding(vertical = 6.dp)) {\n          AlphaSlideBar(\n            modifier = Modifier.fillMaxWidth().height(30.dp)\n              .clip(RoundedCornerShape(4.dp)),\n            colorPickerView = colorPickerView\n          )\n        }\n        Box(modifier = Modifier.padding(vertical = 6.dp)) {\n          BrightnessSlideBar(\n            modifier = Modifier.fillMaxWidth().height(30.dp)\n              .clip(RoundedCornerShape(4.dp)),\n            colorPickerView = colorPickerView\n          )\n        }\n      }\n    }\n  )\n```\n\n### AlphaTileBox\nIn a normal View, it can not represent ARGB colors accurately. Because a color will be mixed with the parent's background-color. For resolving it we can use `AlphaTileBox` composable. `AlphaTileBox` composable reflects ARGB colors.\n```kotlin\nAlphaTileBox(\n  modifier = modifier.constrainAs(square) {\n    bottom.linkTo(parent.bottom)\n    centerHorizontallyTo(parent)\n  }.size(64.dp).clip(RoundedCornerShape(4.dp))\n) {\n  it.setBackgroundColor(selectedColor.color)\n}\n```\n\n## Spinner\n**Orchestra Spinner** allows you to build a lightweight dropdown popup spinner, fully customizable with an arrow and animations for Jetpack Compose. This is a Jetpack Compose compatible package of [PowerSpinner](https://github.com/skydoves/powerspinner).\n\n### Download\n\n[![Maven Central](https://img.shields.io/maven-central/v/com.github.skydoves/orchestra-spinner.svg?label=Maven%20Central)](https://search.maven.org/search?q=g:%22com.github.skydoves%22%20AND%20a:%22orchestra-spinner%22)\u003cbr\u003e\nAdd the dependency below to your **module**'s `build.gradle` file:\n```gradle\ndependencies {\n    implementation \"com.github.skydoves:orchestra-spinner:$version\"\n}\n```\n\n\u003cimg src=\"https://user-images.githubusercontent.com/24237865/95007578-42a01280-064c-11eb-9081-e5567274c9ba.gif\" align=\"right\" width=\"32%\"/\u003e\n\n### Usage\n`Spinner` composable implements a lightweight dropdown popup spinner. Here is an example for creating a spinner using a string array resource. We should use the String generic type for creating a spinner when we us a string array resource.\n\n```kotlin\n val (selectedItem, setSelectedItem) \n      = remember { mutableStateOf(\"Choose a question\") }\n Spinner\u003cString\u003e(\n      text = selectedItem0,\n      modifier = Modifier.fillMaxWidth().padding(16.dp)\n        .background(blue200)\n        .align(Alignment.CenterHorizontally),\n       itemListRes = R.array.list_spinner,\n      style = MaterialTheme.typography.body2,\n      properties = SpinnerProperties(\n        color = Color.White,\n        textAlign = TextAlign.Center,\n        showDivider = true,\n        dividerColor = white87,\n        overflow = TextOverflow.Ellipsis,\n        maxLines = 1,\n        spinnerPadding = 16.dp,\n        spinnerBackgroundColor = MaterialTheme.colors.onBackground,\n      ),\n      onSpinnerItemSelected = { index, item -\u003e\n        setSelectedItem(item)\n      }\n    )\n```\nHere is an another example using a List for creating a spinner. In this case, we don't need to decide a generic type of Spinner.\n\n```kotlin\n val coffeeList = remember { listOf(\"Americano\", \"Cold Brew\", \"Espresso\", \"Latte\") }\n val (selectedItem1, setSelectedItem1) = remember { mutableStateOf(\"Choose your coffee\") }\n Spinner(\n      text = selectedItem1,\n      modifier = Modifier.fillMaxWidth().padding(16.dp)\n        .background(amber700)\n        .align(Alignment.CenterHorizontally),\n      itemList = coffeeList,\n      style = MaterialTheme.typography.body2,\n      properties = SpinnerProperties(\n        color = Color.White,\n        textAlign = TextAlign.Center,\n        dividerColor = white87,\n        overflow = TextOverflow.Ellipsis,\n        maxLines = 1,\n        spinnerPadding = 16.dp,\n        spinnerBackgroundColor = MaterialTheme.colors.onBackground,\n      ),\n      onSpinnerItemSelected = { index, item -\u003e\n        setSelectedItem1(item)\n      }\n    )\n```\n\n## Find this repository useful? :heart:\nSupport it by joining __[stargazers](https://github.com/skydoves/Orchestra/stargazers)__ for this repository. :star: \u003cbr\u003e\nAnd __[follow](https://github.com/skydoves)__ me for my next creations! 🤩\n\n# License\n```xml\nDesigned and developed by 2020 skydoves (Jaewoong Eum)\n\nLicensed under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n   http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.\n```\n","funding_links":["https://github.com/sponsors/skydoves"],"categories":["Index"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fskydoves%2FOrchestra","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fskydoves%2FOrchestra","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fskydoves%2FOrchestra/lists"}