{"id":13428274,"url":"https://github.com/Ramotion/fluid-slider-android","last_synced_at":"2025-03-16T01:32:20.233Z","repository":{"id":45469182,"uuid":"110672825","full_name":"Ramotion/fluid-slider-android","owner":"Ramotion","description":":octocat:💧 A slider widget with a popup bubble displaying the precise value selected. Android library made by @Ramotion","archived":false,"fork":false,"pushed_at":"2020-07-09T21:18:15.000Z","size":7495,"stargazers_count":1423,"open_issues_count":5,"forks_count":148,"subscribers_count":38,"default_branch":"master","last_synced_at":"2024-10-12T23:14:54.107Z","etag":null,"topics":["android","kotlin","library"],"latest_commit_sha":null,"homepage":"https://www.ramotion.com/agency/app-development/","language":"Kotlin","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Ramotion.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-11-14T09:59:52.000Z","updated_at":"2024-09-26T16:23:58.000Z","dependencies_parsed_at":"2022-07-15T01:46:51.974Z","dependency_job_id":null,"html_url":"https://github.com/Ramotion/fluid-slider-android","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ramotion%2Ffluid-slider-android","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ramotion%2Ffluid-slider-android/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ramotion%2Ffluid-slider-android/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ramotion%2Ffluid-slider-android/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Ramotion","download_url":"https://codeload.github.com/Ramotion/fluid-slider-android/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":221631902,"owners_count":16855020,"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","kotlin","library"],"created_at":"2024-07-31T01:00:50.988Z","updated_at":"2024-10-27T05:30:53.991Z","avatar_url":"https://github.com/Ramotion.png","language":"Kotlin","funding_links":["https://paypal.me/Ramotion"],"categories":["Libraries","Library","开源库","Kotlin"],"sub_categories":["UI"],"readme":"\u003ca href=\"https://www.ramotion.com/agency/app-development/?utm_source=gthb\u0026utm_medium=repo\u0026utm_campaign=fluid-slider-android\"\u003e\u003cimg src=\"https://github.com/Ramotion/folding-cell/blob/master/header.png\"\u003e\u003c/a\u003e\n\n\u003ca href=\"https://github.com/Ramotion/fluid-slider-android\"\u003e\n\u003cimg align=\"left\" src=\"https://github.com/Ramotion/fluid-slider-android/blob/master/Fluid_slider.gif\" width=\"480\" height=\"360\" /\u003e\u003c/a\u003e\n\n\u003cp\u003e\u003ch1 align=\"left\"\u003eFLUID SLIDER [KOTLIN]\u003c/h1\u003e\u003c/p\u003e\n\n\u003ch4\u003eA slider widget with a popup bubble displaying the precise value selected\u003c/h4\u003e\n\n\n___\n\n\n\u003cp\u003e\u003ch6\u003eWe specialize in the designing and coding of custom UI for Mobile Apps and Websites.\u003c/h6\u003e\n\u003ca href=\"https://www.ramotion.com/agency/app-development/?utm_source=gthb\u0026utm_medium=repo\u0026utm_campaign=fluid-slider-android\"\u003e\n\u003cimg src=\"https://github.com/ramotion/gliding-collection/raw/master/contact_our_team@2x.png\" width=\"187\" height=\"34\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\u003cp\u003e\u003ch6\u003eStay tuned for the latest updates:\u003c/h6\u003e\n\u003ca href=\"https://goo.gl/rPFpid\" \u003e\n\u003cimg src=\"https://i.imgur.com/ziSqeSo.png/\" width=\"156\" height=\"28\"\u003e\u003c/a\u003e\u003c/p\u003e\n\nInspired by [Virgil Pana](https://dribbble.com/virgilpana) [shot](https://dribbble.com/shots/3868232-Fluid-Slider)\n\n\u003c/br\u003e\n\n[![Twitter](https://img.shields.io/badge/Twitter-@Ramotion-blue.svg?style=flat)](http://twitter.com/Ramotion)\n[![Codacy Badge](https://api.codacy.com/project/badge/Grade/92bd2e49f7e543cd8748c670b9e52ca7)](https://www.codacy.com/app/dvg4000/fluid-slider-android?utm_source=github.com\u0026amp;utm_medium=referral\u0026amp;utm_content=Ramotion/fluid-slider-android\u0026amp;utm_campaign=Badge_Grade)\n[![Donate](https://img.shields.io/badge/Donate-PayPal-blue.svg)](https://paypal.me/Ramotion)\n\n## Requirements\n\n- Android 4.1 Jelly Bean (API lvl 16) or greater\n- Your favorite IDE\n\n## Installation\n​\nJust download the package from [here](http://central.maven.org/maven2/com/ramotion/fluidslider/fluid-slider/0.3.1/fluid-slider-0.3.1.aar) and add it to your project classpath, or just use the maven repo:\n\nGradle:\n```groovy\nimplementation 'com.ramotion.fluidslider:fluid-slider:0.3.1'\n```\nSBT:\n```scala\nlibraryDependencies += \"com.ramotion.fluidslider\" % \"fluid-slider\" % \"0.3.1\"\n```\nMaven:\n```xml\n\u003cdependency\u003e\n  \u003cgroupId\u003ecom.ramotion.fluidslider\u003c/groupId\u003e\n  \u003cartifactId\u003efluid-slider\u003c/artifactId\u003e\n  \u003cversion\u003e0.3.1\u003c/version\u003e\n  \u003ctype\u003eaar\u003c/type\u003e\n\u003c/dependency\u003e\n```\n\n## Basic usage\n\nPlace the `FluidSlider` in your layout.\n\nTo track the current position of the slider, set the `positionListener`, as shown below:\n```\nval slider = findViewById\u003cFluidSlider\u003e(R.id.fluidSlider)\nslider.positionListener = { p -\u003e Log.d(\"MainActivity\", \"current position is: $p\" )}\n```\n\nYou can also track the beginning and completion of the movement of the slider, using the following properties:\n`beginTrackingListener` and` endTrackingListener`. Example below:\n```\nslider.beginTrackingListener = { /* action on slider touched */ }\nslider.endTrackingListener = { /* action on slider released */ }\n```\n\nHere is simple example, how to change `FluidSlider` range.\n```kotlin\n// Kotlin\nval max = 45\nval min = 10\nval total = max - min\n\nval slider = findViewById\u003cFluidSlider\u003e(R.id.fluidSlider)\nslider.positionListener = { pos -\u003e slider.bubbleText = \"${min + (total  * pos).toInt()}\" }\nslider.position = 0.3f\nslider.startText =\"$min\"\nslider.endText = \"$max\"\n\n// Java\nfinal FluidSlider slider = findViewById(R.id.fluidSlider);\nslider.setBeginTrackingListener(new Function0\u003cUnit\u003e() {\n    @Override\n    public Unit invoke() {\n        Log.d(\"D\", \"setBeginTrackingListener\");\n        return Unit.INSTANCE;\n    }\n});\n\nslider.setEndTrackingListener(new Function0\u003cUnit\u003e() {\n    @Override\n    public Unit invoke() {\n        Log.d(\"D\", \"setEndTrackingListener\");\n        return Unit.INSTANCE;\n    }\n});\n\n// Or Java 8 lambda\nslider.setPositionListener(pos -\u003e {\n    final String value = String.valueOf( (int)((1 - pos) * 100) );\n    slider.setBubbleText(value);\n    return Unit.INSTANCE;\n});\n```\n\nHere are the attributes you can specify through XML or related setters:\n* `bar_color` - Color of slider.\n* `bubble_color` - Color of circle \"bubble\" inside bar.\n* `bar_text_color` - Color of `start` and `end` texts of slider.\n* `bubble_text_color` - Color of text inside \"bubble\".\n* `start_text` - Start (left) text of slider.\n* `end_text` - End (right) text of slider.\n* `text_size` - Text size.\n* `duration` - Duration of \"bubble\" rise in milliseconds.\n* `initial_position` - Initial positon of \"bubble\" in range form `0.0` to `1.0`.\n* `size` - Height of slider. Can be `small` (40dp) and `normal` (56dp).\n\n\nThis library is a part of a \u003ca href=\"https://github.com/Ramotion/android-ui-animation-components-and-libraries\"\u003e\u003cb\u003eselection of our best UI open-source projects.\u003c/b\u003e\u003c/a\u003e\n\n## Third Party Bindings\n ### React Native\nYou may now use this library with [React Native](https://github.com/facebook/react-native) via the module [here](https://github.com/prscX/react-native-fluidic-slider)\n\n## 🗂 Check this library on other language:\n\u003ca href=\"https://github.com/Ramotion/fluid-slider\"\u003e\n\u003cimg src=\"https://github.com/ramotion/navigation-stack/raw/master/Swift@2x.png\" width=\"178\" height=\"81\"\u003e\u003c/a\u003e\n\n\n## 📄 License\n\nFluid Slider Android is released under the MIT license.\nSee [LICENSE](./LICENSE) for details.\n\nThis library is a part of a \u003ca href=\"https://github.com/Ramotion/android-ui-animation-components-and-libraries\"\u003e\u003cb\u003eselection of our best UI open-source projects\u003c/b\u003e\u003c/a\u003e\n\nIf you use the open-source library in your project, please make sure to credit and backlink to www.ramotion.com\n\n## 📱 Get the Showroom App for Android to give it a try\nTry this UI component and more like this in our Android app. Contact us if interested.\n\n\u003ca href=\"https://play.google.com/store/apps/details?id=com.ramotion.showroom\" \u003e\n\u003cimg src=\"https://raw.githubusercontent.com/Ramotion/react-native-circle-menu/master/google_play@2x.png\" width=\"104\" height=\"34\"\u003e\u003c/a\u003e\n\n\u003ca href=\"https://www.ramotion.com/agency/app-development/?utm_source=gthb\u0026utm_medium=repo\u0026utm_campaign=fluid-slider-android\"\u003e\n\u003cimg src=\"https://github.com/ramotion/gliding-collection/raw/master/contact_our_team@2x.png\" width=\"187\" height=\"34\"\u003e\u003c/a\u003e\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FRamotion%2Ffluid-slider-android","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FRamotion%2Ffluid-slider-android","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FRamotion%2Ffluid-slider-android/lists"}