Skip to content

Bordered image view for iOS, with customizable border (color and gradient)

License

Notifications You must be signed in to change notification settings

opfo/AGMedallionView

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

36 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

AGMedallionView

cbpowell/AGMedallionView is a bordered image view (that is also a subclass of UIControl) for iOS, with a customizable border and shadow. The border can be a solid color OR a gradient (defined by a CGGradient), and the shadow color, offset, and blur can be specified. The view will be resized to fit any shadow blur and offset setting.

This version is forked from AGMedallionView, which was created as a picture view control just like the one that Apple is using at the login screen in Mac OS X Lion.

Screenshot

Installation

Copy over the files from the Classes folder to your project folder.

Usage

Wherever you want to use AGMedallionView, import the appropriate header file and initialize as follows:

#import "AGMedallionView.h"

Basic

AGMedallionView *medallionView = [[AGMedallionView alloc] init];
medallionView.image = [UIImage imageNamed:@"sample"];
[self.view addSubview:medallionView];
[medallionView release];

To use a rounded rect medallion, initialize as follows:

AGMedallionView *medallionView = [[AGMedallionView alloc] init];
medallionView.style = AGMedallionStyleSquare;
medallionView.cornerRadius = 20.0f;
medallionView.image = [UIImage imageNamed:@"sample"];
[self.view addSubview:medallionView];
[medallionView release];

You can also specify a gradient for the medallion border by specifying a CGGradientRef as shown:

CGFloat colors[8] = {0.925, 0.953, 0.992, 1.000, 0.451, 0.482, 0.522, 1.000};
CGFloat colorStops[2] = {1.f, 0.f};
CGColorSpaceRef rgbColorSpace = CGColorSpaceCreateDeviceRGB();
CGGradientRef newGradient = CGGradientCreateWithColorComponents(rgbColorSpace, colors, colorStops, 2);
medallionView.borderGradient = newGradient;

The shadow color, blur, and offset can be manipulated as follows if the defaults aren't to your liking:

medallionView.shadowColor = [UIColor grayColor];
medallionView.shadowBlur = 3.0f;
medallionView.shadowOffset = CGSizeMake(2.0, 2.0);

The shadow is drawn both inside the border ontop of the image, and outside the border above anything below AGMedallionView. If you don't want the shadow drawn outside the border, set medallionView.clipShadow = YES. The default for clipShadow is NO.

If clipShadow is set to NO, AGMedallionView will resize automatically in order to contain the shadow completely. NOTE: this will result in the contained image being smaller, relative to the frame you specify for the view. The image/border will also no longer be in the absolute center of the frame.

Todo

  • Depending on the background color and the image, sometimes the background can bleed through.

Contact

Charles Powell

Artur Grigor (original creator of AGMedallionView)

Let me (us) know if you're using or enjoying this code!

About

Bordered image view for iOS, with customizable border (color and gradient)

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • Objective-C 97.7%
  • Ruby 2.3%