Skip to content

Custom UIView subclass with a pixellated animation inspired by Facebook's Slingshot app.

License

Notifications You must be signed in to change notification settings

yingogobot/CRPixellatedView

 
 

Repository files navigation

CRPixellatedView

Custom UIView subclass with a pixellated animation inspired by Facebook's Slingshot app.

Platform Version CI License

Installation

There are two options:

CocoaPods

  • Add the dependency to your Podfile:
platform :ios
pod 'CRPixellatedView'
...
  • Run pod install to install the dependencies.

Source files

  • Just clone this repository or download it in zip-file.
  • Then you will find source files under CRPixellatedView directory.
  • Copy them to your project.

Usage

To use CRPixellatedView, create a CRPixellatedView, configure and animate!

An example of making a CRPixellatedView:

CRPixellatedView *pixellatedView = [[CRPixellatedView alloc] initWithFrame:CGRectMake(0, 0, 320, 320)];
pixellatedView.image = [UIImage imageNamed:@"Image"];
[self.view addSubview:pixellatedView]; // Add to your view
[pixellatedView animate];

You can configure this settings, customizable example:

CRPixellatedView *pixellatedView = [[CRPixellatedView alloc] initWithFrame:CGRectMake(0, 0, 320, 320)];
pixellatedView.image = [UIImage imageNamed:@"Image"];
pixellatedView.pixelScale = 20.0f;
pixellatedView.animationDuration = 0.8f;
[self.view addSubview:pixellatedView]; // Add to your view
[pixellatedView animateWithCompletion:^(BOOL finished) {
	NSLog(@"completed");
}];

Also, you can customize the animation effect using the reverse property:

CRPixellatedView *pixellatedView = [[CRPixellatedView alloc] initWithFrame:CGRectMake(0, 0, 320, 320)];
pixellatedView.image = [UIImage imageNamed:@"Image"];
pixellatedView.pixelScale = 20.0f;
pixellatedView.animationDuration = 0.8f;
pixellatedView.reverse = YES; // Reverse effect
[self.view addSubview:pixellatedView]; // Add to your view
[pixellatedView animateWithCompletion:^(BOOL finished) {
	NSLog(@"completed");
}];

Examples

pixellatedView.reverse = YES; // Reverse effect

CRPixellatedView-demo1

CRPixellatedView-demo2

pixellatedView.reverse = NO; // (default)
pixellatedView.pixelScale = 30.0f;

CRPixellatedView-demo3 Demo

See CRPixelledViewDemo Xcode project.

Requirements

  • iOS 6.0 or higher for Objective-C.

Bugs

  • Working well just with square images :(

Contributing

Anyone who would like to contribute to the project is more than welcome.

  • Fork this repo
  • Make your changes
  • Submit a pull request

License

CRPixellatedView is released under the MIT license. See LICENSE.

Contact

Christian Roman

http://chroman.me

chroman16@gmail.com

@chroman

About

Custom UIView subclass with a pixellated animation inspired by Facebook's Slingshot app.

Resources

License

Stars

Watchers

Forks

Packages

No packages published