{"id":26758564,"url":"https://github.com/wdevore/color_slider_control","last_synced_at":"2025-03-28T16:29:32.478Z","repository":{"id":18945656,"uuid":"22165609","full_name":"wdevore/color_slider_control","owner":"wdevore","description":"A custom build Dart color selector widget","archived":false,"fork":false,"pushed_at":"2014-07-30T02:54:41.000Z","size":212,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2023-08-06T17:10:34.389Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Dart","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/wdevore.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":"2014-07-23T17:46:04.000Z","updated_at":"2017-05-14T16:43:04.000Z","dependencies_parsed_at":"2022-09-17T01:23:54.659Z","dependency_job_id":null,"html_url":"https://github.com/wdevore/color_slider_control","commit_stats":null,"previous_names":[],"tags_count":0,"template":null,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wdevore%2Fcolor_slider_control","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wdevore%2Fcolor_slider_control/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wdevore%2Fcolor_slider_control/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wdevore%2Fcolor_slider_control/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/wdevore","download_url":"https://codeload.github.com/wdevore/color_slider_control/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246062254,"owners_count":20717587,"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":[],"created_at":"2025-03-28T16:29:31.628Z","updated_at":"2025-03-28T16:29:32.394Z","avatar_url":"https://github.com/wdevore.png","language":"Dart","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Dart Color Slider Selector\r\n\r\nThis control creates a simple color selector where the RGB values can be selected by sliding markers. It is designed purely in CSS/SVG/Dart; there is no Canvas rendering occurring.\r\n\r\n![Color Selector](https://raw.githubusercontent.com/wdevore/gradient_colorstops_control/master/gradient_selector.png)\r\n\r\n##pubspec\r\nStart by adding a dependency for the Color Selector [library](https://github.com/wdevore/color_slider_control) in pubspec.yaml\r\n```yaml\r\n    dependencies:\r\n      color_slider_control:\r\n        git: git://github.com/wdevore/color_slider_control.git\r\n```\r\nImport the library into your project\r\n\r\n```dart\r\n    import 'package:color_slider_control/color_slider_control.dart';\r\n```\r\n\r\nCreate the color selector by instantiating the `ColorSliderWidget` object, then add it to a container element and finally call the `bind` on the color selector.\r\n```dart\r\n    void main() {\r\n      ColorSliderWidget colorWidget = new ColorSliderWidget();\r\n      _targetContainerElement = querySelector(\"#color_pickerId\");\r\n\r\n      _targetContainerElement.nodes.add(colorWidget.container);\r\n      colorWidget.bind();\r\n    }\r\n```\r\n\r\nThe selector defaults to a light teal color.\r\n\r\n##Design\r\nThe active `marker` is highlighted as darkgreen. Unselected `marker`s are blurred, grayscaled and translucent. The end `marker`s are highlighted in darkred and not movable.\r\n\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwdevore%2Fcolor_slider_control","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwdevore%2Fcolor_slider_control","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwdevore%2Fcolor_slider_control/lists"}