{"id":18270222,"url":"https://github.com/victorBaro/VBFJellyView","last_synced_at":"2025-04-04T23:31:49.575Z","repository":{"id":18301681,"uuid":"21477680","full_name":"victorBaro/VBFJellyView","owner":"victorBaro","description":"VBFJellyView is a custom view made out using UIKit Dynamics and with a very funny effect when adding behaviours to it.","archived":false,"fork":false,"pushed_at":"2021-08-02T19:26:39.000Z","size":29,"stargazers_count":649,"open_issues_count":0,"forks_count":41,"subscribers_count":20,"default_branch":"master","last_synced_at":"2024-11-05T11:52:33.433Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Objective-C","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/victorBaro.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}},"created_at":"2014-07-03T21:35:36.000Z","updated_at":"2024-05-04T02:59:19.000Z","dependencies_parsed_at":"2022-08-25T11:30:15.377Z","dependency_job_id":null,"html_url":"https://github.com/victorBaro/VBFJellyView","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/victorBaro%2FVBFJellyView","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/victorBaro%2FVBFJellyView/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/victorBaro%2FVBFJellyView/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/victorBaro%2FVBFJellyView/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/victorBaro","download_url":"https://codeload.github.com/victorBaro/VBFJellyView/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247266476,"owners_count":20910831,"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":"2024-11-05T11:38:25.363Z","updated_at":"2025-04-04T23:31:49.175Z","avatar_url":"https://github.com/victorBaro.png","language":"Objective-C","funding_links":[],"categories":["etc"],"sub_categories":[],"readme":"VBFJellyView\n============\n\nVBFJellyView is a custom view made out using UIKit Dynamics and with a very funny effect when adding behaviours to it.\n\n![vbfjellyview](https://user-images.githubusercontent.com/994334/127913073-ee4fd49d-aa9c-446c-a2e3-aee2f38210d0.gif)\n\n\n\n## Introduction\nThis view was inspired by Skype app for iOS. \nApart from that, I have to thank @arekholko for [this post](http://holko.pl/2014/06/26/recreating-skypes-action-sheet-animation/). I took from there the trick of using CADisplayLink for changing the path of the CAShapeLayer used in this example.\n\nFind in the following video some examples of stuff you can achieve with this view.\n\n[![Example Video](http://img.youtube.com/vi/rzcevF0xyM4/0.jpg)](http://youtu.be/rzcevF0xyM4)\n\n\t\n## How to use it\nDownload the project. You will find the main view called **VBFJellyView**.  This class has 2 designated initializers:\n\n\t\t//DESIGNATED INITALIZER FOR DEFAULT VALUES\n\t- (id)initWithFrame:(CGRect)frame\n\t      jellyViewSize:(CGSize)viewSize\n\t          fillColor:(UIColor *)jellyViewColor;\n\n\t//DESIGNATED INITALIZER SETTING YOUR OWN VALUES\n\t- (id) initWithFrame:(CGRect)frame\n  \t     jellyViewSize:(CGSize)viewSize\n     \t      fillColor:(UIColor *)jellyViewColor\n     \t     elasticity:(CGFloat)elasticity\n     \t        density:(CGFloat)density\n     \t        damping:(CGFloat)damping\n     \t      frequency:(CGFloat)frequency;\n\nUse the first one for **default values**. \nYou won’t see anything on the screen until you call:\n\t- (void) show;\nBy calling that method, the CAShapeLayer used for showing the JellyView will be added as a sublayer.\nI have used this approach to make it easier when you subclass it (like you will see in the AlertView example).\n\nBy default, VBFJellyView class **does not have any behaviour attached to it**.\n\n**Important**\nBefore knowing how you should interact with it, you should know that VBFJellyView it’s made from 9 subviews, connected to the one next to each other using UIAttachmentBehaviour. \nThat means, you should add behaviours to this 9 subviews (by accessing jellyView.subviews array). The views are positioned like the figure below illustrates:\n\n![Subview Layout](http://blog.victorbaro.com/wp-content/uploads/2014/07/VBFJellyView-subviews-snaps.png)\n\n\nThere are 2 ways of interacting with it:\n\n1. Use its public property *mainAnimator* to add behaviours (examples 1 and 4). \n2. Subclass it to create your own custom stuff (examples 2 and 3)\n\nI extremely recommend you to visit my blog, [victorbaro.com](http://victorbaro.com/) to understand a bit better how VBFJellyView is made. \n\n\n## The project\nInside the project you will find 5 Viewcontrollers:\n\n1. VBFJellyView with UIPanGestureRecognizer.\n2. JellyButton: a pushBehaviour is applied to the control points (midpoints) when the button is tapped\n3. JellyAlert: using VBFJellyView as AlertView. UIGravityBehaviour and UICollisionBehaviour are used in this example\n4. VBFJellyView with gravity + panGesture + collision\n5. VBFJellyView showing how its made\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FvictorBaro%2FVBFJellyView","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FvictorBaro%2FVBFJellyView","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FvictorBaro%2FVBFJellyView/lists"}