{"id":33169548,"url":"https://github.com/trueicecold/phaser-scrollable","last_synced_at":"2025-11-20T19:00:57.935Z","repository":{"id":138083533,"uuid":"79566080","full_name":"trueicecold/phaser-scrollable","owner":"trueicecold","description":"A phaser component to implement a scrollable group.","archived":false,"fork":false,"pushed_at":"2018-01-14T09:57:23.000Z","size":2142,"stargazers_count":45,"open_issues_count":8,"forks_count":12,"subscribers_count":6,"default_branch":"master","last_synced_at":"2024-05-17T12:32:58.451Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","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/trueicecold.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}},"created_at":"2017-01-20T14:32:32.000Z","updated_at":"2022-09-18T03:18:34.000Z","dependencies_parsed_at":"2024-01-12T00:25:46.689Z","dependency_job_id":"ac713a07-b059-4aa7-8570-c5c6945c44d7","html_url":"https://github.com/trueicecold/phaser-scrollable","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/trueicecold/phaser-scrollable","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/trueicecold%2Fphaser-scrollable","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/trueicecold%2Fphaser-scrollable/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/trueicecold%2Fphaser-scrollable/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/trueicecold%2Fphaser-scrollable/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/trueicecold","download_url":"https://codeload.github.com/trueicecold/phaser-scrollable/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/trueicecold%2Fphaser-scrollable/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":285494607,"owners_count":27181443,"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","status":"online","status_checked_at":"2025-11-20T02:00:05.334Z","response_time":54,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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-11-16T01:00:33.530Z","updated_at":"2025-11-20T19:00:57.927Z","avatar_url":"https://github.com/trueicecold.png","language":"JavaScript","funding_links":[],"categories":["Uncategorized"],"sub_categories":["Uncategorized"],"readme":"# Phaser scrollable component\n\nThis component can simulate vertical and horizontal scrolling to a Phaser.Group.\n\n\u003e This component is directly derived from [jdnichollsc](https://github.com/jdnichollsc)'s amazing work on his plugin, [Kinetic Scrolling Plugin](https://github.com/jdnichollsc/Phaser-Kinetic-Scrolling-Plugin). I converted it to use groups instead of moving the camera, added support for multiple scrollers, and some bug fixes.\n\n\n### Download the Component\n\nInstall using [npm](https://www.npmjs.com/):\n\n```bash\nnpm install https://github.com/trueicecold/phaser-scrollable --save\n```\n\n### Using the Component\n\n```javascript\n\tthis.scroller = game.add.existing(new ScrollableArea(x, y, w, h, params));\n    var textStyle = {font:\"30px Arial\", fill:\"#ffff00\"};\n\tfor (var i=0;i\u003c10;i++) {\n\t\tfor (var j=0;j\u003c80;j++) {\n\t\t\tvar text = game.make.text(i*330, j*30, \"Yes, everything scrolls\", textStyle);\n\t\t\tscroller.addChild(text);\n\t\t}\n\t}\n\tscroller.start();\n```\n\n* x - the x position of the scrollable container\n* y - the y position of the scrollable container\n* w - the width of the scrollable container. If the width of the children inside is larger than this, a horizontal scrolling will be possible.\n* h - the height of the scrollable container. If the height of the children inside is larger than this, a vertical scrolling will be possible.\n* params - configurable parameters for the component:\n\t* horizontalScroll - allow horizontal scroll. Default is true.\n\t* verticalScroll - allow vertical scroll. Default is true.\n\t* horizontalWheel - allow horizontal wheel support. Default is true. Should not be enabled along with verticalWheel.\n\t* verticalWheel - allow vertical wheel support. Default is false. Should not be enabled along with horizontalWheel.\n\t* kineticMovement - use kinetic scrolling. Default is true. Use false to switch to static scrolling (scrolling stops as you leave the touch).\n\t* timeConstantScroll - The rate of deceleration for the scrolling. Default is 325ms.\n\t* deltaWheel - Delta increment of the mouse wheel.\n\n### Change the component parameters at runtime\n\n```javascript\n\tscroller.configure(params);\n```\n\n### Methods\n* start - start the scroller behavior.\n* stop - stops the scroller behavior. this does not reset the content position.\n* setPosition - object (x,y) - repositions the scroller.\n* scrollTo - object (x,y,time,easing,allowScrollStopOnTouch) - scrolls the scroller to the position given.\n\t* time - defaults to 1000\n\t* easing - defaults to Phaser.Easing.Quadratic.Out\n\t* allowScrollStopOnTouch - choose whether to allow the user to cancel the scrolling animation when clicking on the scroller. Defaults to false, useful to cutscenes.\n\n### Demo\n\n[https://cdn.rawgit.com/trueicecold/phaser-scrollable/e2bfe0cd/scrollable-kinetic.html](https://cdn.rawgit.com/trueicecold/phaser-scrollable/e2bfe0cd/scrollable-kinetic.html)\n\nMade with \u003c3 for \u003cimg src=\"https://phaser.io/images/logo/logo-download.png\" width=\"80\" height=\"80\"/\u003e","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftrueicecold%2Fphaser-scrollable","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftrueicecold%2Fphaser-scrollable","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftrueicecold%2Fphaser-scrollable/lists"}