BAPulseView

This view and it's layer can create a pop and pulse effect.

MIT License

Stars
22
Committers
1

BAPulseView

Overview

This view and it's layer can create a pop and pulse effect.

Requirements

  • Works on any iOS device

Example

To run the example project, clone the repo, and run pod install from the Example directory first.

Getting Started

Installation

BAPulseView is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod "BAPulseView"

Simple Usage

Basic

To add a BAPulseView to your app, add the line:

BAPulseView *pulseView = [[BAPulseView alloc] initWithFrame:CGRectMake(0, 0, 200, 200)];
[self.view addSubview:view];

I added an NSTimer for demo purposes. The timer sets off the funtion popAndPulse

pulseView.center = self.view.center;
[NSTimer scheduledTimerWithTimeInterval:1.0 
							     target:pulseView
                               selector:@selector(popAndPulse)
                               userInfo:nil
                                repeats:YES];

This creates the following view:

Advanced Usage (Properties)

Listed below are examples of several properties that you can control.

Adjust Corner Radius (Rounded Edges)

If you want to round out the few, after you set the cornerRadius and pulseCorderRadius properties:

pulseView.layer.cornerRadius = 20.0f;
pulseView.pulseCornerRadius = 20.0f;

Adjust Corner Radius (Circle)

giving a corner radius of half the width and height gives you a circle:

pulseView.layer.cornerRadius = pulseView.frame.size.width/2;
pulseView.pulseCornerRadius = pulseView.frame.size.width/2;

Adjust Stroke Color

To change the color of the pulse outline, set the pulseStrokeColor property:

pulseView.pulseStrokeColor = [UIColor redColor].CGColor;

Adjust Line Width

By editing the pulseLineWidth property, you can change the width of the pulse outline:

pulseView.pulseLineWidth = 5.0f;

Adjust Pulse Radius

If you want the pulse to extend farther out, pass a float value to the pulseRadius property:

pulseView.pulseRadius = 400.0f;

Adjust Duration

To increase the time of a pulse, edit the pulseDuration property:

pulseView.pulseDuration = 3.0f;

Advanced Usage (Methods)

Listed below are examples of several method you can use to control the animation.

Pop and Pulse

For the default effect, use the following method (or NSTimer if you want it to repeat):

[pulseView popAndPulse];

//    pulseView.center = self.view.center;
//    [NSTimer scheduledTimerWithTimeInterval:1.0
//                                     target:pulseView
//                                   selector:@selector(popAndPulse)
//                                   userInfo:nil
//                                    repeats:YES];

Just Pop

For just the pop effect, use the following method (or NSTimer if you want it to repeat):

[pulseView pop];

//    pulseView.center = self.view.center;
//    [NSTimer scheduledTimerWithTimeInterval:1.0
//                                     target:pulseView
//                                   selector:@selector(pop)
//                                   userInfo:nil
//                                    repeats:YES];

Just Pulse

For just the pulse effect, use the following method (or NSTimer if you want it to repeat):

[pulseView pulse];

//    pulseView.center = self.view.center;
//    [NSTimer scheduledTimerWithTimeInterval:1.0
//                                     target:pulseView
//                                   selector:@selector(pulse)
//                                   userInfo:nil
//                                    repeats:YES];

Author

Bryan Antigua, [email protected]

License

BAPulseView is available under the MIT license. See the LICENSE file for more info.