Skip to content

Commit d8afff6

Browse files
bachonkbachonk
committed
Merge pull request #8 from bachonk/feature/optional_circular_clipping
Feature/optional circular clipping (Resolves #7)
2 parents 4b0f902 + e1a8448 commit d8afff6

6 files changed

Lines changed: 56 additions & 24 deletions

File tree

‎UIImageViewLettersSample/UIImageViewLettersSample.xcodeproj/project.xcworkspace/xcuserdata/tombachant.xcuserdatad/UserInterfaceState.xcuserstate‎

-34 Bytes
Binary file not shown.

‎UIImageViewLettersSample/UIImageViewLettersSample/Base.lproj/Main.storyboard‎

Lines changed: 20 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
2-
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="6245" systemVersion="14A389" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" initialViewController="vXZ-lx-hvc">
2+
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="6254" systemVersion="14B25" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" initialViewController="vXZ-lx-hvc">
33
<dependencies>
4-
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="6238"/>
4+
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="6247"/>
55
</dependencies>
66
<scenes>
77
<!--View Controller-->
@@ -22,7 +22,7 @@
2222
<textInputTraits key="textInputTraits" autocapitalizationType="words" spellCheckingType="no"/>
2323
</textField>
2424
<button opaque="NO" contentMode="scaleToFill" ambiguous="YES" misplaced="YES" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="ire-dV-SY0">
25-
<rect key="frame" x="261" y="241" width="78" height="30"/>
25+
<rect key="frame" x="261" y="300" width="78" height="30"/>
2626
<state key="normal" title="Refresh">
2727
<color key="titleShadowColor" white="0.5" alpha="1" colorSpace="calibratedWhite"/>
2828
</state>
@@ -33,15 +33,32 @@
3333
<imageView userInteractionEnabled="NO" contentMode="scaleToFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" ambiguous="YES" misplaced="YES" translatesAutoresizingMaskIntoConstraints="NO" id="UjT-K7-3lm">
3434
<rect key="frame" x="240" y="61" width="121" height="121"/>
3535
</imageView>
36+
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" ambiguous="YES" misplaced="YES" text="Circular clipping?" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="mr7-vk-mDn">
37+
<rect key="frame" x="203" y="248" width="134" height="21"/>
38+
<fontDescription key="fontDescription" type="system" pointSize="14"/>
39+
<color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
40+
<nil key="highlightedColor"/>
41+
</label>
42+
<switch opaque="NO" contentMode="scaleToFill" horizontalHuggingPriority="750" verticalHuggingPriority="750" ambiguous="YES" misplaced="YES" contentHorizontalAlignment="center" contentVerticalAlignment="center" translatesAutoresizingMaskIntoConstraints="NO" id="Av4-Ns-UeI">
43+
<rect key="frame" x="355" y="243" width="51" height="31"/>
44+
<connections>
45+
<action selector="refreshSampleImage:" destination="vXZ-lx-hvc" eventType="valueChanged" id="pIE-Ee-3FL"/>
46+
</connections>
47+
</switch>
3648
</subviews>
3749
<color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
3850
<constraints>
3951
<constraint firstAttribute="centerX" secondItem="UjT-K7-3lm" secondAttribute="centerX" id="0sJ-Kt-FjR"/>
52+
<constraint firstItem="Kb8-Um-vXe" firstAttribute="leading" secondItem="mr7-vk-mDn" secondAttribute="leading" id="4i9-aH-qGG"/>
53+
<constraint firstItem="mr7-vk-mDn" firstAttribute="top" secondItem="Kb8-Um-vXe" secondAttribute="bottom" constant="15" id="JFV-Q6-xkq"/>
4054
<constraint firstAttribute="centerX" secondItem="ire-dV-SY0" secondAttribute="centerX" id="V82-gj-67V"/>
55+
<constraint firstItem="Kb8-Um-vXe" firstAttribute="trailing" secondItem="Av4-Ns-UeI" secondAttribute="trailing" id="hQc-8Y-tDY"/>
56+
<constraint firstItem="Av4-Ns-UeI" firstAttribute="top" secondItem="Kb8-Um-vXe" secondAttribute="bottom" constant="10" id="nS6-rI-jgZ"/>
4157
<constraint firstAttribute="centerX" secondItem="Kb8-Um-vXe" secondAttribute="centerX" id="zEH-qr-EpS"/>
4258
</constraints>
4359
</view>
4460
<connections>
61+
<outlet property="circularSwitch" destination="Av4-Ns-UeI" id="NLi-1C-wRw"/>
4562
<outlet property="nameField" destination="Kb8-Um-vXe" id="pLf-IH-SIi"/>
4663
<outlet property="sampleImageView" destination="UjT-K7-3lm" id="Fbv-NK-W1d"/>
4764
</connections>

‎UIImageViewLettersSample/UIImageViewLettersSample/UIImageView+Letters/UIImageView+Letters.h‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,16 @@
4242
@param string The string used to generate the initials. This should be a user's full name if available
4343
@param color (optional) This optional paramter sets the background of the image. If not provided, a random color will be generated
4444
*/
45+
4546
- (void)setImageWithString:(NSString *)string color:(UIColor *)color;
4647

48+
/**
49+
Sets the image property of the view based on initial text, a specified background color, and a circular clipping
50+
51+
@param string The string used to generate the initials. This should be a user's full name if available
52+
@param color (optional) This optional paramter sets the background of the image. If not provided, a random color will be generated
53+
@param isCircular This boolean will determine if the image view will be clipped to a circular shape
54+
*/
55+
- (void)setImageWithString:(NSString *)string color:(UIColor *)color circular:(BOOL)isCircular;
56+
4757
@end

‎UIImageViewLettersSample/UIImageViewLettersSample/UIImageView+Letters/UIImageView+Letters.m‎

Lines changed: 22 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -24,13 +24,23 @@
2424

2525
#import "UIImageView+Letters.h"
2626

27+
@interface UIImageView (LettersPrivate)
28+
29+
- (UIImage *)imageSnapshotFromText:(NSString *)text backgroundColor:(UIColor *)color circular:(BOOL)isCircular;
30+
31+
@end
32+
2733
@implementation UIImageView (Letters)
2834

2935
- (void)setImageWithString:(NSString *)string {
30-
[self setImageWithString:string color:nil];
36+
[self setImageWithString:string color:nil circular:NO];
3137
}
3238

3339
- (void)setImageWithString:(NSString *)string color:(UIColor *)color {
40+
[self setImageWithString:string color:color circular:NO];
41+
}
42+
43+
- (void)setImageWithString:(NSString *)string color:(UIColor *)color circular:(BOOL)isCircular {
3444
NSMutableString *displayString = [NSMutableString stringWithString:@""];
3545

3646
NSMutableArray *words = [[string componentsSeparatedByCharactersInSet:[NSCharacterSet whitespaceAndNewlineCharacterSet]] mutableCopy];
@@ -60,7 +70,7 @@ - (void)setImageWithString:(NSString *)string color:(UIColor *)color {
6070

6171
UIColor *backgroundColor = color ? color : [self randomColor];
6272

63-
self.image = [self imageSnapshotFromText:[displayString uppercaseString] backgroundColor:backgroundColor];
73+
self.image = [self imageSnapshotFromText:[displayString uppercaseString] backgroundColor:backgroundColor circular:isCircular];
6474
}
6575

6676
#pragma mark - Helpers
@@ -89,7 +99,7 @@ - (UIColor *)randomColor {
8999
return [UIColor colorWithRed:red green:green blue:blue alpha:1.0f];
90100
}
91101

92-
- (UIImage *)imageSnapshotFromText:(NSString *)text backgroundColor:(UIColor *)color {
102+
- (UIImage *)imageSnapshotFromText:(NSString *)text backgroundColor:(UIColor *)color circular:(BOOL)isCircular {
93103

94104
CGFloat scale = [UIScreen mainScreen].scale;
95105

@@ -107,6 +117,15 @@ - (UIImage *)imageSnapshotFromText:(NSString *)text backgroundColor:(UIColor *)c
107117

108118
CGContextRef context = UIGraphicsGetCurrentContext();
109119

120+
if (isCircular) {
121+
//
122+
// Clip context to a circle
123+
//
124+
CGPathRef path = CGPathCreateWithEllipseInRect(self.bounds, NULL);
125+
CGContextAddPath(context, path);
126+
CGContextClip(context);
127+
}
128+
110129
//
111130
// Fill background of context
112131
//

‎UIImageViewLettersSample/UIImageViewLettersSample/ViewController.h‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,8 @@
1515

1616
@property (nonatomic, weak) IBOutlet UITextField *nameField;
1717

18+
@property (nonatomic, weak) IBOutlet UISwitch *circularSwitch;
19+
1820
- (IBAction)refreshSampleImage:(id)sender;
1921

2022
@end

‎UIImageViewLettersSample/UIImageViewLettersSample/ViewController.m‎

Lines changed: 2 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -20,27 +20,11 @@ - (void)viewDidLoad {
2020
[super viewDidLoad];
2121
// Do any additional setup after loading the view, typically from a nib.
2222

23-
/**
24-
* Make the image look a little nicer
25-
*/
26-
27-
// Set corner radius
28-
_sampleImageView.layer.cornerRadius = CGRectGetHeight(_sampleImageView.frame) / 2;
29-
_sampleImageView.clipsToBounds = YES;
30-
31-
// Add border
32-
_sampleImageView.layer.borderColor = [[UIColor colorWithWhite:0.84f alpha:1.0f] CGColor];
33-
_sampleImageView.layer.borderWidth = 3.0f;
34-
35-
// Add shadow
36-
_sampleImageView.layer.shadowOffset = CGSizeMake(0, 0);
37-
_sampleImageView.layer.shadowRadius = 1.5;
38-
_sampleImageView.layer.shadowOpacity = 0.3;
39-
4023
/**
4124
* Let's start with a sample
4225
*/
4326
_nameField.text = @"Michael Bluth"; // everyone's favorite son
27+
_circularSwitch.on = NO;
4428
[self refreshSampleImage:nil];
4529

4630
}
@@ -54,7 +38,7 @@ - (void)didReceiveMemoryWarning {
5438

5539
- (IBAction)refreshSampleImage:(id)sender {
5640

57-
[_sampleImageView setImageWithString:_nameField.text];
41+
[_sampleImageView setImageWithString:_nameField.text color:nil circular:_circularSwitch.isOn];
5842

5943
}
6044

0 commit comments

Comments
 (0)