新浪微博,按钮依次弹出动画
来源:互联网 发布:网络禁书100本百度云 编辑:程序博客网 时间:2024/03/29 06:48
1.点击modal出一个控制器
//// ComposeItemViewController.h#import <UIKit/UIKit.h>@interface ComposeItemViewController : UIViewController/** * 有多少个按钮 *///@property(nonatomic,assign) int itemCount;/** * 菜单模型数组 */@property(nonatomic,strong)NSArray *items;@end
//// ComposeItemViewController.m#import "ComposeItemViewController.h"#import "MenuItem.h"#import "MenuItemButton.h"@interface ComposeItemViewController ()/** * 保存所有按钮菜单 */@property(nonatomic,strong)NSMutableArray *itemButtons;@property(nonatomic,assign)int btnIndex;@property(nonatomic,strong)NSTimer *timer;@end@implementation ComposeItemViewController- (NSMutableArray *)itemButtons{ if (_itemButtons == nil) { _itemButtons = [NSMutableArray array]; } return _itemButtons;}- (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view from its nib. // 1.添加所有的item按钮 [self setupAllBtns]; // 2.添加定时器依次让按钮动画 _timer = [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(timeChange) userInfo:nil repeats:YES];}- (void)timeChange{ if (_btnIndex == self.itemButtons.count) { // 定时器停止 [_timer invalidate]; return; } UIButton *btn = self.itemButtons[_btnIndex]; [self btnAnimation:btn]; _btnIndex++;}/** * 给一个按钮做动画 */- (void)btnAnimation:(UIButton *)btn{ [UIView animateWithDuration:0.5 delay:0 usingSpringWithDamping:0.8 initialSpringVelocity:0 options:UIViewAnimationOptionCurveLinear animations:^{ btn.transform = CGAffineTransformIdentity; } completion:nil];}/** * 创建所有按钮 */- (void)setupAllBtns{ int totalCols = 3; //总列数 int col = 0; int row = 0; CGFloat x = 0; CGFloat y = 0; CGFloat wh = 100; CGFloat margin = ([UIScreen mainScreen].bounds.size.width - totalCols * wh) / (totalCols +1); CGFloat originY = 300; for (int i=0; i< _items.count; i++) { MenuItemButton *btn = [MenuItemButton buttonWithType:UIButtonTypeCustom]; col = i % totalCols; row = i / totalCols; x = margin + (margin + wh) * col; y = row * (margin + wh) + originY; btn.frame = CGRectMake(x, y, wh, wh); // 设置按钮的图片和文字 MenuItem *item = _items[i]; [btn setImage:item.image forState:UIControlStateNormal]; [btn setTitle:item.title forState:UIControlStateNormal]; // 偏移到底部 btn.transform = CGAffineTransformMakeTranslation(0, self.view.bounds.size.height); // 添加监听 [btn addTarget:self action:@selector(btnClicked:) forControlEvents:UIControlEventTouchDown]; [self.itemButtons addObject:btn]; [self.view addSubview:btn]; }}- (void)btnClicked:(UIButton *)btn{ [UIView animateWithDuration:0.5 animations:^{ btn.transform = CGAffineTransformMakeScale(1.1, 1.1); } completion:nil];}@end2.按钮需要外部传入图片和文字,所以定义一个按钮模型
//// MenuItem.h// 按钮菜单模型#import <UIKit/UIKit.h>@interface MenuItem : NSObject@property(nonatomic,strong)NSString *title;@property(nonatomic,strong) UIImage *image;/** * 快速创建一个菜单模型 */+ (instancetype)itemWithTitle:(NSString *)title image:(UIImage *)image;@end
//// MenuItem.m#import "MenuItem.h"@implementation MenuItem+ (instancetype)itemWithTitle:(NSString *)title image:(UIImage *)image{ MenuItem *item = [[self alloc] init]; item.title = title; item.image = image; return item;}@end3.按钮图片在上,文字在下,需要自定义
//// MenuItemButton.h#import <UIKit/UIKit.h>@interface MenuItemButton : UIButton@end
//// MenuItemButton.m#import "MenuItemButton.h"#define kImageRatio 0.8@implementation MenuItemButton- (void)awakeFromNib{ [self setup];}- (instancetype)initWithFrame:(CGRect)frame{ if (self = [super initWithFrame:frame]) { [self setup]; } return self;}- (void)setup{ self.imageView.contentMode = UIViewContentModeCenter; self.titleLabel.textAlignment = NSTextAlignmentCenter;}- (void)setHighlighted:(BOOL)highlighted{}// 如果通过代码设置子控件位置,都是在layoutSubviews里面- (void)layoutSubviews{ [super layoutSubviews]; // imageView CGFloat imageX = 0; CGFloat imageY = 0; CGFloat imageW = self.bounds.size.width; CGFloat imageH = self.bounds.size.height * kImageRatio; self.imageView.frame = CGRectMake(imageX, imageY, imageW, imageH); // titleLabel CGFloat labelY = imageH; CGFloat labelH = self.bounds.size.height - labelY; self.titleLabel.frame = CGRectMake(imageX, labelY, imageW, labelH);}- (void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{ [UIView animateWithDuration:0.5 animations:^{ self.transform = CGAffineTransformMakeScale(2.0, 2.0); self.alpha = 0.0; } completion:nil];}@end4.如何使用?
/** * 点击+号按钮 */- (IBAction)btnAction:(UIButton *)sender{ // 创建模型数组 MenuItem *item0 = [MenuItem itemWithTitle:@"点评" image:[UIImage imageNamed:@"tabbar_compose_review"]]; MenuItem *item1 = [MenuItem itemWithTitle:@"更多" image:[UIImage imageNamed:@"tabbar_compose_more"]]; MenuItem *item2 = [MenuItem itemWithTitle:@"拍摄" image:[UIImage imageNamed:@"tabbar_compose_camera"]]; MenuItem *item3 = [MenuItem itemWithTitle:@"相册" image:[UIImage imageNamed:@"tabbar_compose_photo"]]; MenuItem *item4 = [MenuItem itemWithTitle:@"文字" image:[UIImage imageNamed:@"tabbar_compose_idea"]]; MenuItem *item5 = [MenuItem itemWithTitle:@"签到" image:[UIImage imageNamed:@"tabbar_compose_lbs"]]; ComposeItemViewController *vc = [[ComposeItemViewController alloc] init]; vc.items = @[item0,item1,item2,item3,item4,item5]; [self presentViewController:vc animated:YES completion:nil];}
0 0
- 新浪微博,按钮依次弹出动画
- 仿新浪微博 微博运动 勋章弹出动画
- 仿新浪微博加号弹出界面动画
- 新浪微博加号按钮动画实现方案
- ios动画-新浪微博app点击发微博按钮动画的实现
- 分享按钮-新浪微博开放平台
- 新浪微博“加关注”按钮代码
- 自定义新浪微博分享按钮样式
- 仿新浪微博放大缩小按钮
- 自定义新浪微博分享按钮
- 新浪微博加号按钮OC代码
- 源码推荐(6.30):图片浏览器 高仿新浪微博,仿QQ未读消息弹性按钮动画
- 仿新浪微博的导航,动画
- 微博底部弹出动画
- 案列:使用pop实现发布界面6个按钮依次坠落的动画
- 页面中增加新浪微博关注按钮
- 新浪微博分享按钮接口:样式自定义
- ios-新浪微博开发-22-封装标题按钮
- Yii之路(第三)
- struct的创建
- C语言输出打印乘法口诀表
- 皇后
- D21
- 新浪微博,按钮依次弹出动画
- 一个简单的程序教你检测你的机器是大端还是小端?
- 多台Linux服务器SSH相互访问无需密码
- 上机作业2-2,3,4
- Yii之路(第四)
- 04_item简单平移动画
- 05_item平移动画监听
- Yii之路(第五)
- c++作业3