[转载-仅为个人学习所用]Stack Menu

时间:2023-03-09 08:04:19
[转载-仅为个人学习所用]Stack Menu

http://code4app.com/ios/51fa7d7e6803fa2710000006

我有个很牛的同学朋友同事舍友···他技术牛人,写的博客都是原创,粉丝无数,说实话我真的挺妒嫉的,试过为了拉取博客人气,专门在各处找来一些没有用的博文,伪装成自己的。However,不是自己的就不是自己的。还是承认比较好,我的博客里面主要还是为了个人学习所用,所以,看到者勿吐槽。我会努力,争取成为牛人,写出属于自己的技术博文。

实现类似Mac OS系统Dock上的弹出菜单(stack menu)。点击主按钮,会弹出一个由成弧形依次排列的多个按钮组成的菜单。适用环境:Xcode 4.5, iOS 5.0 以上。

这个Demo主要是在Code4APP上下载的,绝非我的创作。后面我应该还会不断从上面学习各种Demo,并粘贴到自己的博客中。

具体它提供的也只有代码,那我就从代码开始分析吧,略笨的方法

PCStackMenuItem

 #import <UIKit/UIKit.h>

 @interface PCStackMenuItem : UIView

 - (id)initWithFrame:(CGRect)frame withTitle:(NSString *)title withImage:(UIImage *)image alignment:(UITextAlignment)alignment;

 @property (nonatomic)                BOOL            highlight;

 @property (nonatomic, readonly)        UILabel            *stackTitleLabel;
 @property (nonatomic, readonly)     UIImageView        *stackIimageView;

 @end

 CGAffineTransform CGAffineTransformMakeRotationAt(CGFloat angle, CGPoint pt);

定义了菜单单项视图,一个Label和一个ImageView,所以如果你希望能实现一个更复杂的弹出菜单单项视图,就改这个文件吧。该类中有个BOOL型属性highlight,应该就是判断菜单项是否为当前选中项吧。而这个Demo并没有实现hover特效,所以有机会后面我会在这个基础上修改,添加hover的效果。UIView类型属性hightlightView则是为了在选中的时候添加一个0.2透明度的UIView来实现选择阴影效果的。

 #import "PCStackMenuItem.h"
 #import <QuartzCore/QuartzCore.h>

 @interface PCStackMenuItem ()
 {
     UIView                    *_highlightView;
 }

 @end

 @implementation PCStackMenuItem

 - (BOOL)highlight
 {
     return (_highlightView != nil);
 }

 - (void)setHighlight:(BOOL)highlight
 {
     if(!highlight && _highlightView == nil)
         return;
     if(highlight && _highlightView != nil)
         return;

     if(highlight)
     {
         _highlightView = [[UIView alloc] initWithFrame:self.bounds];
         _highlightView.layer.cornerRadius = ;
         _highlightView.layer.masksToBounds = YES;
         _highlightView.backgroundColor = [[UIColor darkGrayColor] colorWithAlphaComponent:0.2];
         [super addSubview:_highlightView];
     }
     else
     {
         [_highlightView removeFromSuperview];
         _highlightView = nil;
     }
 }

 - (id)initWithFrame:(CGRect)frame withTitle:(NSString *)title withImage:(UIImage *)image alignment:(UITextAlignment)alignment
 {
     self = [self initWithFrame:frame];
     if (self)
     {
         CGRect rect = CGRectMake(alignment == UITextAlignmentLeft ?  : frame.size.width - frame.size.height, , frame.size.height, frame.size.height);
         _stackIimageView = [[UIImageView alloc] initWithFrame:rect];
         _stackIimageView.contentMode = UIViewContentModeScaleAspectFit;
         _stackIimageView.image = image;
         [self addSubview:_stackIimageView];

         rect = CGRectMake(alignment == UITextAlignmentRight ?  : frame.size.height + , , frame.size.width - frame.size.height - , frame.size.height - );
         _stackTitleLabel = [[UILabel alloc] initWithFrame:rect];
         _stackTitleLabel.textAlignment = alignment;
         _stackTitleLabel.font = [UIFont boldSystemFontOfSize:];
         _stackTitleLabel.backgroundColor = [UIColor clearColor];
         _stackTitleLabel.textColor = [UIColor whiteColor];
         _stackTitleLabel.shadowColor = [UIColor darkGrayColor];
         _stackTitleLabel.shadowOffset = CGSizeMake(, );
         _stackTitleLabel.text = title;
         CGSize labelSize = [title sizeWithFont:_stackTitleLabel.font];
         rect.size.width = labelSize.width + ;
         _stackTitleLabel.frame = rect;
         [self addSubview:_stackTitleLabel];

         CGFloat width = labelSize.width + (_stackIimageView ? _stackIimageView.frame.size.width +  : );
         if(alignment == UITextAlignmentRight)
             frame.origin.x += (frame.size.width - width) - ;
         frame.size.width = width + ;
         self.frame = frame;

         rect = _stackIimageView.frame;
         rect.origin.x = alignment == UITextAlignmentLeft ?  : frame.size.width - frame.size.height;
         _stackIimageView.frame = rect;
     }
     return self;
 }

 - (id)initWithCoder:(NSCoder *)aDecoder
 {
     self = [super initWithCoder:aDecoder];
     if (self)
     {
         // Initialization code
     }
     return self;
 }

 - (id)initWithFrame:(CGRect)frame
 {
     self = [super initWithFrame:frame];
     if (self)
     {
         // Initialization code
     }
     return self;
 }

 CGAffineTransform CGAffineTransformMakeRotationAt(CGFloat angle, CGPoint pt)
 {
     const CGFloat fx = pt.x;
     const CGFloat fy = pt.y;
     const CGFloat fcos = cos(angle);
     const CGFloat fsin = sin(angle);
     return CGAffineTransformMake(fcos, fsin, -fsin, fcos, fx - fx * fcos + fy * fsin, fy - fx * fsin - fy * fcos);
 }

 @end

上面更多的是围绕布局而写了,没有过多的逻辑可言。

PCStackMenu

 #import <UIKit/UIKit.h>
 #import "PCStackMenuItem.h"

 typedef enum
 {
     PCStackMenuDirectionClockWiseUp = ,
     PCStackMenuDirectionClockWiseDown,
     PCStackMenuDirectionCounterClockWiseUp,
     PCStackMenuDirectionCounterClockWiseDown
 } PCStackMenuDirection;

 typedef void (^PCStackMenuBlock)(NSInteger selectedMenuIndex);

 @interface PCStackMenu : UIView
 {
     PCStackMenuBlock        _block;
 }

 @property (nonatomic, strong)    NSMutableArray        *items;

 + (PCStackMenu *)showStackMenuWithTitles:(NSArray *)titles
                               withImages:(NSArray *)images
                             atStartPoint:(CGPoint)startPoint
                                   inView:(UIView *)parent
                               itemHeight:(CGFloat)itemHeight
                            menuDirection:(PCStackMenuDirection)direction
                             onSelectMenu:(PCStackMenuBlock)block;

 - (PCStackMenu *)initWithTitles:(NSArray *)titles
                      withImages:(NSArray *)images
                    atStartPoint:(CGPoint)startPoint
                          inView:(UIView *)parent
                      itemHeight:(CGFloat)itemHeight
                   menuDirection:(PCStackMenuDirection)direction;

 - (void)show:(PCStackMenuBlock)block;
 - (void)dismiss;

 @end

而在PCStackMenu文件中,为弹出菜单枚举了四种弹出方向,下一行则是声明了一个返回值为空的块函数PCStackMenuBlock,这感觉很不错的编码格式,可以学习学习。

 #import "PCStackMenu.h"

 @interface PCStackMenu ()
 {
     UIWindow                *_overlayWindow;
     NSMutableArray            *_items;
     PCStackMenuDirection    _menuDirection;
 }

 @end

 @implementation PCStackMenu

 //算是设置Hightlight项吗?每一次状态的改变都对所有项进行重新设置
 - (void)clearHighlightWithExcept:(PCStackMenuItem *)selectedItem
 {
     for(PCStackMenuItem *item in _items)
         item.highlight = (item == selectedItem);
 }

 - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
 {
     NSSet            *allTouches = [event allTouches];
     NSArray            *touchs = [allTouches allObjects];
     UITouch            *touch = [touchs lastObject];

     )
     {
         [self clearHighlightWithExcept:nil];
         PCStackMenuItem    *stackItem = nil;
         for(PCStackMenuItem *item in _items)
         {
             CGPoint point = [touch locationInView:item];
             if([item pointInside:point withEvent:event])
             {
                 stackItem = item;
                 [self clearHighlightWithExcept:item];
                 break;
             }
         }
         if(stackItem)
             stackItem.highlight = YES;
     }
 }

 - (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
 {
     NSSet            *allTouches = [event allTouches];
     NSArray            *touchs = [allTouches allObjects];
     UITouch            *touch = [touchs lastObject];

     )
     {
         PCStackMenuItem    *stackItem = nil;
         for(PCStackMenuItem *item in _items)
         {
             CGPoint point = [touch locationInView:item];
             if([item pointInside:point withEvent:event])
             {
                 stackItem = item;
                 [self clearHighlightWithExcept:item];
                 break;
             }
         }
         if(stackItem)
         {
             [self clearHighlightWithExcept:stackItem];
             [self dismissWithSelect:stackItem];
         }
         else
         {
             [self clearHighlightWithExcept:nil];
             [self dismiss];
         }
     }
 }

 - (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
 {
     NSSet                *allTouches = [event allTouches];
     NSArray                *touchs = [allTouches allObjects];
     UITouch                *touch = [touchs lastObject];

     )
     {
         PCStackMenuItem    *stackItem = nil;
         for(PCStackMenuItem *item in _items)
         {
             CGPoint point = [touch locationInView:item];
             if([item pointInside:point withEvent:event])
             {
                 stackItem = item;
                 [self clearHighlightWithExcept:item];
                 break;
             }
         }
         if(!stackItem)
             [self clearHighlightWithExcept:nil];
     }
 }

 - (void)touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event
 {
     [self clearHighlightWithExcept:nil];
 }

 - (void)show:(PCStackMenuBlock)block
 {
     _block = block;

     ; i < [_items count]; i++)
     {
         PCStackMenuItem *stackItem = [_items objectAtIndex:i];
         stackItem.hidden = NO;
     }

     [UIView animateWithDuration:0.2 animations:^{
         ; i < [_items count]; i++)
         {
             PCStackMenuItem *stackItem = [_items objectAtIndex:i];
             CGRect r = stackItem.frame;
             r.origin.y += i * r.size.height * (_menuDirection == PCStackMenuDirectionClockWiseUp || _menuDirection == PCStackMenuDirectionCounterClockWiseUp ? - : );
             stackItem.frame = r;
             CGPoint point = [self centerPointForRotation:stackItem];
             stackItem.transform = CGAffineTransformMakeRotationAt(i * (_menuDirection == PCStackMenuDirectionClockWiseUp || _menuDirection == PCStackMenuDirectionClockWiseDown ?  : -) * M_PI / , point);
             stackItem.alpha = 1.0;
         }
     } completion:^(BOOL finished) {
     }];
 }

 - (void)dismissWithSelect:(PCStackMenuItem *)selectedItem
 {
     int selectedIndex = [_items indexOfObject:selectedItem];
     selectedItem.highlight = YES;

     [UIView animateWithDuration:0.1 animations:^{
         CGRect r;
         ; i < [_items count]; i++)
         {
             PCStackMenuItem *stackItem = [_items objectAtIndex:i];
             )
                 r = stackItem.frame;
             if(selectedItem != stackItem)
             {
                 CGPoint point = [self centerPointForRotation:stackItem];
                 stackItem.transform = CGAffineTransformMakeRotationAt( * M_PI / , point);
                 stackItem.frame = r;
                 stackItem.alpha = 0.2;
             }
         }
     } completion:^(BOOL finished) {
         ; i < [_items count]; i++)
         {
             PCStackMenuItem *stackItem = [_items objectAtIndex:i];
             if(selectedItem != stackItem)
                 stackItem.hidden = YES;
         }
         [UIView animateWithDuration:0.2 animations:^{
             PCStackMenuItem *stackItem = [_items objectAtIndex:selectedIndex];
             CGRect r = ((UIView *)[_items objectAtIndex:]).frame;
             if(selectedItem == stackItem)
             {
                 CGPoint point = [self centerPointForRotation:stackItem];
                 stackItem.transform = CGAffineTransformMakeRotationAt( * M_PI / , point);
                 stackItem.frame = r;
                 stackItem.alpha = 0.5;
             }
         } completion:^(BOOL finished) {
             if(_block)
                 _block(selectedIndex);
             _overlayWindow = nil;
             _block = nil;
         }];
     }];
 }

 - (void)dismiss
 {
     [UIView animateWithDuration:0.2 animations:^{
         CGRect r;
         ; i < [_items count]; i++)
         {
             PCStackMenuItem *stackItem = [_items objectAtIndex:i];
             )
                 r = stackItem.frame;
             CGPoint point = [self centerPointForRotation:stackItem];
             stackItem.transform = CGAffineTransformMakeRotationAt( * M_PI / , point);
             stackItem.frame = r;
             stackItem.alpha = 0.2;
         }
     } completion:^(BOOL finished) {
         _block = nil;
         _overlayWindow = nil;
     }];
 }

 + (PCStackMenu *)showStackMenuWithTitles:(NSArray *)titles
                               withImages:(NSArray *)images
                             atStartPoint:(CGPoint)startPoint
                                   inView:(UIView *)parent
                               itemHeight:(CGFloat)itemHeight
                            menuDirection:(PCStackMenuDirection)direction
                             onSelectMenu:(PCStackMenuBlock)block
 {
     PCStackMenu *stackMenu = [[PCStackMenu alloc] initWithTitles:titles withImages:images atStartPoint:startPoint inView:parent itemHeight:itemHeight menuDirection:direction];
     [stackMenu show:block];
     return stackMenu;
 }

 - (PCStackMenu *)initWithTitles:(NSArray *)titles
                      withImages:(NSArray *)images
                    atStartPoint:(CGPoint)startPoint
                          inView:(UIView *)parent
                      itemHeight:(CGFloat)itemHeight
                   menuDirection:(PCStackMenuDirection)direction
 {
     self = [self initWithFrame:[UIScreen mainScreen].bounds];
     _menuDirection = direction;

     int max = MAX([titles count], [images count]);
     ; i < max; i++)
     {
         CGRect r = CGRectMake((direction == PCStackMenuDirectionClockWiseUp || direction == PCStackMenuDirectionCounterClockWiseDown) ?  : startPoint.x,
                               startPoint.y + (direction == PCStackMenuDirectionClockWiseDown || direction == PCStackMenuDirectionCounterClockWiseDown ?  : -itemHeight),
                               (direction == PCStackMenuDirectionClockWiseUp || direction == PCStackMenuDirectionCounterClockWiseDown) ? startPoint.x : self.frame.size.width - startPoint.x,
                               itemHeight);
         r = [self convertRect:r fromView:parent];
         NSString *title = (i < [titles count]) ? [titles objectAtIndex:i] : @"";
         UIImage *image = (i < [images count]) ? [images objectAtIndex:i] : nil;
         PCStackMenuItem *stackItem = [[PCStackMenuItem alloc] initWithFrame:r withTitle:title withImage:image alignment:(direction == PCStackMenuDirectionClockWiseUp || direction == PCStackMenuDirectionCounterClockWiseDown) ? UITextAlignmentRight : UITextAlignmentLeft];
         stackItem.alpha = 0.5;
         stackItem.hidden = YES;
         [self addSubview:stackItem];
         [_items addObject:stackItem];
     }

     return self;
 }

 - (CGPoint)centerPointForRotation:(PCStackMenuItem *)item
 {
     CGFloat x = _menuDirection == PCStackMenuDirectionClockWiseUp || _menuDirection == PCStackMenuDirectionCounterClockWiseDown ? self.frame.size.width : -self.frame.size.width;
     CGFloat y = _menuDirection == PCStackMenuDirectionClockWiseDown || _menuDirection == PCStackMenuDirectionCounterClockWiseDown ? -item.frame.origin.y : self.frame.size.height - item.frame.origin.y;
     return CGPointMake(x, y);
 }

 - (void)createOverlayWindow
 {
     _overlayWindow = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
     _overlayWindow.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
     _overlayWindow.backgroundColor = [UIColor clearColor];

     [_overlayWindow makeKeyAndVisible];
     [_overlayWindow addSubview:self];
 }

 - (id)initWithCoder:(NSCoder *)aDecoder
 {
     self = [super initWithCoder:aDecoder];
     if(self)
     {
         _items = [[NSMutableArray alloc] init];
         self.backgroundColor = [UIColor clearColor];
         [self createOverlayWindow];
     }
     return self;
 }

 - (id)initWithFrame:(CGRect)frame
 {
     self = [super initWithFrame:frame];
     if (self)
     {
         _items = [[NSMutableArray alloc] init];
         self.backgroundColor = [UIColor clearColor];
         [self createOverlayWindow];
     }
     return self;
 }

 @end

因为要休息了,更多的分析就等下一次进行修改再说吧。GoodNight