iOS懸浮異形按鈕實現(xiàn)

我們在開發(fā)中有時候根據(jù)業(yè)務的需要浴井,有時候需要一個在界面上常駐按鈕久脯,或者懸浮按鈕纳胧,且可拖動,可點擊帘撰,該類按鈕主要起到對公司業(yè)務進行推廣或者突顯新功能的作用跑慕,今天我們就來實現(xiàn)下,先看下效果圖:

demo.gif

代碼:

DysmorphismButton按鈕在VC中的使用:

- (void)viewDidLoad {
    [super viewDidLoad];
    UIImage *bgImage = [UIImage imageNamed:@"imageButton"];
    DysmorphismButton *button = [[DysmorphismButton alloc] init];
    button.MoveEnable = YES;
    [button setBackgroundImage:bgImage forState:UIControlStateNormal];
    [button setBackgroundImage:[UIImage imageNamed:@"imageData"] forState:UIControlStateHighlighted];
    [button addTarget:self action:@selector(fileButtonClicked) forControlEvents:UIControlEventTouchUpInside];
    button.frame =
    CGRectMake(self.view.frame.size.width - dyButtonWidth - dyButtonMargin, dyButtonMargin + topNavInsetHeight, dyButtonWidth , dyButtonHeight);
    button.topMargin = dyButtonMargin;
    button.layer.cornerRadius = dyButtonWidth / 2.0f;
    button.clipsToBounds = YES;
    self.dyButton = button;
    [self.view addSubview:self.dyButton];
}

//button action
- (void)fileButtonClicked{
    //TODO
}

DysmorphismButton 按鈕實現(xiàn)部分:

.h文件
#import <UIKit/UIKit.h>
#import <QuartzCore/QuartzCore.h>

@interface DysmorphismButton : UIButton {
    BOOL MoveEnable;
    BOOL MoveEnabled;
    CGPoint benginpoint;
}

@property(nonatomic, assign) BOOL MoveEnable;
@property(nonatomic, assign) BOOL MoveEnabled;
@property(nonatomic, assign) CGFloat topMargin;

@end
.m文件

#define kButtonXoffset 7
#define topNavInsetHeight 64
#import "DysmorphismButton.h"
#import "UIViewAdditions.h"

@implementation DysmorphismButton
@synthesize MoveEnable;
@synthesize MoveEnabled;

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

//touchBegan
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
    MoveEnabled = NO;
    [super touchesBegan:touches withEvent:event];
    if (!MoveEnable) {
        return;
    }
    UITouch *touch = [touches anyObject];
    benginpoint = [touch locationInView:self];
}

//move

-(void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
    if (!MoveEnable) {
        return;
    }
    UITouch *touch = [touches anyObject];
    CGPoint currentPosition = [touch locationInView:self];
    float offsetX = currentPosition.x - benginpoint.x;
    float offsetY = currentPosition.y - benginpoint.y;
    if (ABS(offsetX) < 4 && ABS(offsetY) < 4) {
        return;
    }
    MoveEnabled = YES;
    //移動后坐標
    self.center = CGPointMake(self.center.x + offsetX, self.center.y + offsetY);
    // x軸左右極限坐標
    if (self.center.x >= (self.superview.frame.size.width - self.frame.size.width / 2 - kButtonXoffset)) {
        CGFloat x = self.superview.frame.size.width - self.frame.size.width / 2 - kButtonXoffset;
        self.center = CGPointMake(x, self.center.y);
    } else if (self.center.x <= (self.frame.size.width / 2 + kButtonXoffset)) {
        CGFloat x = self.frame.size.width / 2 + kButtonXoffset;
        self.center = CGPointMake(x, self.center.y);
    }
    
    // y軸上下極限坐標
    CGFloat yOffset = topNavInsetHeight + kButtonXoffset + self.topMargin;
    if (self.center.y > (self.superview.frame.size.height - self.frame.size.height / 2 - kButtonXoffset)) {
        CGFloat x = self.center.x;
        CGFloat y = self.superview.frame.size.height - self.frame.size.height / 2 - kButtonXoffset;
        self.center = CGPointMake(x, y);
    } else if (self.center.y <= self.frame.size.height / 2 + yOffset) {
        CGFloat x = self.center.x;
        CGFloat y = self.frame.size.height / 2;
        self.center = CGPointMake(x, y + yOffset);
    }
}

- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
    if (!MoveEnable) {
        return;
    }
    
    [self handleButtonMoveEndEvent];
    [super touchesEnded:touches withEvent:event];
}

- (void)handleButtonMoveEndEvent {
    if (self.center.x >= self.superview.frame.size.width / 2) {  //向右側移動
        //偏移動畫
        [UIView beginAnimations:@"move" context:nil];
        [UIView setAnimationDuration:.5];
        [UIView setAnimationDelegate:self];
        self.frame = CGRectMake(self.superview.width - self.width - kButtonXoffset, self.top, self.width, self.height);
        //提交UIView動畫
        [UIView commitAnimations];
    } else {  //向左側移動
        
        [UIView beginAnimations:@"move" context:nil];
        [UIView setAnimationDuration:.5];
        [UIView setAnimationDelegate:self];
        self.frame = CGRectMake(0.f + kButtonXoffset, self.top, self.width, self.height);
        //提交UIView動畫
        [UIView commitAnimations];
    }
}
@end

Demo URL:
(鏈接: https://pan.baidu.com/s/1nv55Qid 密碼: 79pi)

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末摧找,一起剝皮案震驚了整個濱河市核行,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌慰于,老刑警劉巖钮科,帶你破解...
    沈念sama閱讀 221,888評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異婆赠,居然都是意外死亡绵脯,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,677評論 3 399
  • 文/潘曉璐 我一進店門休里,熙熙樓的掌柜王于貴愁眉苦臉地迎上來蛆挫,“玉大人,你說我怎么就攤上這事妙黍°睬郑” “怎么了?”我有些...
    開封第一講書人閱讀 168,386評論 0 360
  • 文/不壞的土叔 我叫張陵拭嫁,是天一觀的道長可免。 經常有香客問我抓于,道長,這世上最難降的妖魔是什么浇借? 我笑而不...
    開封第一講書人閱讀 59,726評論 1 297
  • 正文 為了忘掉前任捉撮,我火速辦了婚禮,結果婚禮上妇垢,老公的妹妹穿的比我還像新娘巾遭。我一直安慰自己,他們只是感情好闯估,可當我...
    茶點故事閱讀 68,729評論 6 397
  • 文/花漫 我一把揭開白布灼舍。 她就那樣靜靜地躺著,像睡著了一般涨薪。 火紅的嫁衣襯著肌膚如雪骑素。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,337評論 1 310
  • 那天刚夺,我揣著相機與錄音砂豌,去河邊找鬼。 笑死光督,一個胖子當著我的面吹牛,可吹牛的內容都是我干的塔粒。 我是一名探鬼主播结借,決...
    沈念sama閱讀 40,902評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼卒茬!你這毒婦竟也來了船老?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 39,807評論 0 276
  • 序言:老撾萬榮一對情侶失蹤圃酵,失蹤者是張志新(化名)和其女友劉穎柳畔,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體郭赐,經...
    沈念sama閱讀 46,349評論 1 318
  • 正文 獨居荒郊野嶺守林人離奇死亡薪韩,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 38,439評論 3 340
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了捌锭。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片俘陷。...
    茶點故事閱讀 40,567評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖观谦,靈堂內的尸體忽然破棺而出拉盾,到底是詐尸還是另有隱情,我是刑警寧澤豁状,帶...
    沈念sama閱讀 36,242評論 5 350
  • 正文 年R本政府宣布捉偏,位于F島的核電站倒得,受9級特大地震影響,放射性物質發(fā)生泄漏夭禽。R本人自食惡果不足惜霞掺,卻給世界環(huán)境...
    茶點故事閱讀 41,933評論 3 334
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望驻粟。 院中可真熱鬧根悼,春花似錦、人聲如沸蜀撑。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,420評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽酷麦。三九已至矿卑,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間沃饶,已是汗流浹背母廷。 一陣腳步聲響...
    開封第一講書人閱讀 33,531評論 1 272
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留糊肤,地道東北人琴昆。 一個月前我還...
    沈念sama閱讀 48,995評論 3 377
  • 正文 我出身青樓,卻偏偏與公主長得像馆揉,于是被迫代替她去往敵國和親业舍。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 45,585評論 2 359

推薦閱讀更多精彩內容