Skip to content

Commit

Permalink
ADD: support for right-oriented segment images
Browse files Browse the repository at this point in the history
  • Loading branch information
u10int committed Aug 19, 2014
1 parent 43e3e54 commit 7ea7685
Show file tree
Hide file tree
Showing 4 changed files with 58 additions and 17 deletions.
23 changes: 12 additions & 11 deletions README.md
Expand Up @@ -26,7 +26,7 @@ URBSegmentedControl
Add the following to your `Podfile` and run `$ pod install`:

pod "URBSegmentedControl"

If you don't have CocoaPods installed or integrated into your project, you can learn how to do via [CocoaPods](http://cocoapods.org/).

### Installing Manually
Expand Down Expand Up @@ -85,17 +85,18 @@ Your `URBSegmentedControl` can be customized using the following properties:

```objective-c
// base styles
@property (nonatomic, strong) UIColor *baseColor; // default [UIColor colorWithWhite:0.3 alpha:1.0]
@property (nonatomic, strong) UIColor *strokeColor; // default [UIColor darkGrayColor]
@property (nonatomic, assign) CGFloat strokeWidth; // default 2.0
@property (nonatomic) CGFloat cornerRadius; // default 2.0
@property (nonatomic, assign) UIEdgeInsets segmentEdgeInsets; // default UIEdgeInsetsMake(4.0, 4.0, 4.0, 4.0)
@property (nonatomic, strong) UIColor *baseColor; // default [UIColor colorWithWhite:0.3 alpha:1.0]
@property (nonatomic, strong) UIColor *strokeColor; // default [UIColor darkGrayColor]
@property (nonatomic, assign) CGFloat strokeWidth; // default 2.0
@property (nonatomic) CGFloat cornerRadius; // default 2.0
@property (nonatomic, assign) UIEdgeInsets segmentEdgeInsets; // default UIEdgeInsetsMake(4.0, 4.0, 4.0, 4.0)
@property (nonatomic, assign) URBSegmentImagePosition imagePosition; // default URBSegmentImagePositionLeft

// segment styles
@property (nonatomic, strong) UIColor *segmentBackgroundColor; // default [UIColor redColor]
@property (nonatomic, strong) UIColor *imageColor; // default [UIColor grayColor]
@property (nonatomic, strong) UIColor *selectedImageColor; // default [UIColor whiteColor]
@property (nonatomic, assign) BOOL showsGradient; // determines if the base and segment background should have a gradient applied, default YES
@property (nonatomic, strong) UIColor *segmentBackgroundColor; // default [UIColor redColor]
@property (nonatomic, strong) UIColor *imageColor; // default [UIColor grayColor]
@property (nonatomic, strong) UIColor *selectedImageColor; // default [UIColor whiteColor]
@property (nonatomic, assign) BOOL showsGradient; // determines if the base and segment background should have a gradient applied, default YES
```

By default, your images will be tinted with the colors you define using the `imageColor` and `selectedImageColor` properties. If you would rather keep your images in their original format, just set these color properties to `nil`:
Expand All @@ -117,7 +118,7 @@ In most cases, the default insets applied to the content, title and image for ea

- Support setting images to use for background and segment states instead of drawing in CoreGraphics within the class
- Support for UISegmentedControl's `momentary` mode
- Better support for customization using UIAppearance
~~- Better support for customization using UIAppearance~~

## Credits

Expand Down
1 change: 1 addition & 0 deletions SampleProject/URBSegmentedControlDemo/AppDelegate.m
Expand Up @@ -46,6 +46,7 @@ - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(
//
URBSegmentedControl *iconControl = [[URBSegmentedControl alloc] initWithItems:titles];
iconControl.frame = CGRectMake(10.0, CGRectGetMaxY(control.frame) + 20.0, 300.0, 40.0);
iconControl.imagePosition = URBSegmentImagePositionRight;
[viewController.view addSubview:iconControl];

// set icons for each segment
Expand Down
19 changes: 15 additions & 4 deletions URBSegmentedControl.h
Expand Up @@ -8,17 +8,20 @@

#import <UIKit/UIKit.h>

enum {
typedef NS_ENUM(NSUInteger, URBSegmentedControlOrientation) {
URBSegmentedControlOrientationHorizontal = 0,
URBSegmentedControlOrientationVertical
};
typedef NSInteger URBSegmentedControlOrientation;

enum {
typedef NS_ENUM(NSUInteger, URBSegmentViewLayout) {
URBSegmentViewLayoutDefault = 0,
URBSegmentViewLayoutVertical
};
typedef NSInteger URBSegmentViewLayout;

typedef NS_ENUM(NSUInteger, URBSegmentImagePosition) {
URBSegmentImagePositionLeft = 0,
URBSegmentImagePositionRight
};

@interface URBSegmentedControl : UISegmentedControl <UIAppearance>

Expand All @@ -34,6 +37,11 @@ typedef void (^URBSegmentedControlBlock)(NSInteger index, URBSegmentedControl *s
*/
@property (nonatomic) URBSegmentViewLayout segmentViewLayout;

/**
* Position of the image when placed horizontally next to a segment label. Not used for controls containing only text or images.
*/
@property (nonatomic, assign) URBSegmentImagePosition imagePosition;

/**
Block handle called when the selected segment has changed.
*/
Expand All @@ -44,6 +52,8 @@ typedef void (^URBSegmentedControlBlock)(NSInteger index, URBSegmentedControl *s
*/
@property (nonatomic, strong) UIColor *baseColor;

@property (nonatomic, strong) UIColor *baseGradient;

/**
Stroke color used around the base container view.
*/
Expand Down Expand Up @@ -74,6 +84,7 @@ typedef void (^URBSegmentedControlBlock)(NSInteger index, URBSegmentedControl *s
///----------------------------

@property (nonatomic, strong) UIColor *segmentBackgroundColor UI_APPEARANCE_SELECTOR;
@property (nonatomic, strong) UIColor *segmentBackgroundGradient UI_APPEARANCE_SELECTOR;
@property (nonatomic, strong) UIColor *imageColor UI_APPEARANCE_SELECTOR;
@property (nonatomic, strong) UIColor *selectedImageColor UI_APPEARANCE_SELECTOR;

Expand Down
32 changes: 30 additions & 2 deletions URBSegmentedControl.m
Expand Up @@ -15,6 +15,7 @@ - (UIColor *)adjustBrightness:(CGFloat)amount;

@interface URBSegmentView : UIButton
@property (nonatomic, assign) URBSegmentViewLayout viewLayout;
@property (nonatomic, assign) URBSegmentImagePosition imagePosition;
@property (nonatomic, strong) UIColor *imageBackgroundColor;
@property (nonatomic, strong) UIColor *selectedImageBackgroundColor;
@property (nonatomic, assign) CGFloat cornerRadius;
Expand Down Expand Up @@ -65,6 +66,7 @@ - (void)initInternal{
// layout
self.layoutOrientation = URBSegmentedControlOrientationHorizontal;
self.segmentViewLayout = URBSegmentViewLayoutDefault;
self.imagePosition = URBSegmentImagePositionLeft;

// base image view
_backgroundView = [[UIImageView alloc] init];
Expand Down Expand Up @@ -153,7 +155,9 @@ - (void)insertSegmentWithTitle:(NSString *)title image:(UIImage *)image atIndex:

// style the segment
segmentView.viewLayout = self.segmentViewLayout;
segmentView.imagePosition = self.imagePosition;
segmentView.showsGradient = self.showsGradient;

if (self.segmentTextAttributes) {
[segmentView setTextAttributes:self.segmentTextAttributes forState:UIControlStateNormal];
}
Expand Down Expand Up @@ -237,6 +241,16 @@ - (void)setShowsGradient:(BOOL)showsGradient {
}
}

- (void)setImagePosition:(URBSegmentImagePosition)imagePosition {
if (_imagePosition != imagePosition) {
_imagePosition = imagePosition;

[self.items enumerateObjectsUsingBlock:^(URBSegmentView *segmentView, NSUInteger idx, BOOL *stop) {
segmentView.imagePosition = imagePosition;
}];
}
}

#pragma mark - UIKit API Overrides

- (void)insertSegmentWithTitle:(NSString *)title atIndex:(NSUInteger)segment animated:(BOOL)animated {
Expand Down Expand Up @@ -674,8 +688,15 @@ - (void)layoutSubviews {
}
else {
CGFloat titleX = CGRectGetWidth(frame) / 3.0;
imageFrame = UIEdgeInsetsInsetRect(imageFrame, UIEdgeInsetsMake(0, 0, 0, CGRectGetWidth(frame) - titleX));
titleFrame = UIEdgeInsetsInsetRect(titleFrame, UIEdgeInsetsMake(0, titleX + 2.0, 0, 0));

if (self.imagePosition == URBSegmentImagePositionRight) {
imageFrame = UIEdgeInsetsInsetRect(imageFrame, UIEdgeInsetsMake(0, CGRectGetWidth(frame) - titleX, 0, 0));
titleFrame = UIEdgeInsetsInsetRect(titleFrame, UIEdgeInsetsMake(0, 0, 0, titleX + 2.0));
}
else {
imageFrame = UIEdgeInsetsInsetRect(imageFrame, UIEdgeInsetsMake(0, 0, 0, CGRectGetWidth(frame) - titleX));
titleFrame = UIEdgeInsetsInsetRect(titleFrame, UIEdgeInsetsMake(0, titleX + 2.0, 0, 0));
}
}
}
self.imageView.frame = imageFrame;
Expand Down Expand Up @@ -732,6 +753,13 @@ - (void)setShowsGradient:(BOOL)showsGradient {
}
}

- (void)setImagePosition:(URBSegmentImagePosition)imagePosition {
if (_imagePosition != imagePosition) {
_imagePosition = imagePosition;
[self setNeedsLayout];
}
}

#pragma mark - Background Images

- (void)updateBackgrounds {
Expand Down

0 comments on commit 7ea7685

Please sign in to comment.