在TableView上添加懸浮按鈕,tableview懸浮按鈕

來源:互聯網
上載者:User

在TableView上添加懸浮按鈕,tableview懸浮按鈕

  如果直接在TableVIewController上貼Button的話會導致這個會隨之滾動,下面解決在TableView上實現位置固定懸浮按鈕的兩種方法:

  1.在view上貼tableView,然後將懸浮按鈕貼在view的最頂層

  2.使用window

首先看一下最終的效果,在tableViewController上添加一個懸浮按鈕,該按鈕不能隨著視圖的滾動而滾動

   

首先介紹上面的第一種方法:

1)建立tableview和底部按鈕的屬性

//螢幕寬

#define kScreenW [UIScreen mainScreen].bounds.size.width

//螢幕高

#define kScreenH [UIScreen mainScreen].bounds.size.height

@interface broadcastLiveViewController ()<UITableViewDataSource, UITableViewDelegate>

@property(nonatomic) UITableView *livesListTable;

@property(nonatomic) UIButton *bottomButton;

@end

2)建立屬性到最頂部

@implementation broadcastLiveViewController

- (void)viewDidLoad {

    [super viewDidLoad];

  CGRect clientRect = [UIScreen mainScreen].bounds;

  _livesListTable = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, clientRect.size.width, clientRect.size.height-65) style:UITableViewStylePlain];

    [self.view addSubview:_livesListTable];

    _livesListTable.delegate = self;

    _livesListTable.dataSource = self;

 self.bottomButton = [UIButton buttonWithType:UIButtonTypeCustom];

    self.bottomButton.frame = CGRectMake(kScreenW - 80, kScreenH - 140, 60, 60);

    [self.bottomButton setBackgroundImage:[UIImage imageNamed:@"recordLive"] forState:UIControlStateNormal];

    [self.bottomButton addTarget:self action:@selector(onTapLiveBtn) forControlEvents:UIControlEventTouchUpInside];

    [self.view addSubview:self.bottomButton];

 3)實現按鈕事件

- (void)onTapLiveBtn

{

    NSLog(@"點擊底部按鈕");

}

接下來介紹第二種方法:

1)建立一個window,button屬性避免window被釋放

//螢幕寬

#define kScreenW [UIScreen mainScreen].bounds.size.width

//螢幕高

#define kScreenH [UIScreen mainScreen].bounds.size.height

@interface broadcastLiveViewController ()<UITableViewDataSource, UITableViewDelegate>

@property(strong,nonatomic)UIWindow *window;

@property(strong,nonatomic)UIButton *button;

@end

2)建立window和button

 預設的情況下系統只有一個window這時我們需要設定windowLevel

window不用添加在任何視圖上

 - (void)createButton{

    _button = [UIButton buttonWithType:UIButtonTypeCustom];     [_button setBackgroundImage:[UIImage imageNamed:@"recordLive"] forState:UIControlStateNormal];    _button.frame = CGRectMake(0, 0, 60, 60);    [_button addTarget:self action:@selector(onTapLiveBtn) forControlEvents:UIControlEventTouchUpInside];    _window = [[UIWindow alloc]initWithFrame: CGRectMake(kScreenW - 80, kScreenH - 80, 60, 60);];    _window.windowLevel = UIWindowLevelAlert+1;    _window.backgroundColor = [UIColor redColor];    _window.layer.cornerRadius = 30;    _window.layer.masksToBounds = YES;    [_window addSubview:_button];    [_window makeKeyAndVisible];//關鍵語句,顯示window}

3)延時載入window,注意我們需要在rootWindow建立完成之後再建立這個懸浮的按鈕
- (void)viewDidLoad {    [super viewDidLoad];    [self performSelector:@selector(createButton) withObject:nil afterDelay:1];  }
4)實現按鈕事件

- (void)onTapLiveBtn

{

    NSLog(@"點擊底部按鈕");

}


注意::最後再添加一個小功能,使tableview上下滑動的時候,按鈕動畫效果的出現和消失,在這裡是上拉消失,下拽出現

-(void)scrollViewDidScroll:(UIScrollView *)scrollView{

    if (scrollView.contentOffset.y > self.offsetY && scrollView.contentOffset.y > 0) {//向上滑動

        //按鈕消失

        [UIView transitionWithView:self.bottomButton duration:0.1 options:UIViewAnimationOptionTransitionNone animations:^{

            self.bottomButton.frame = CGRectMake(kScreenW - 80, kScreenH - 65, 60, 60);

        } completion:NULL]; 

    }else if (scrollView.contentOffset.y < self.offsetY ){//向下滑動

        //按鈕出現

        [UIView transitionWithView:self.bottomButton duration:0.1 options:UIViewAnimationOptionTransitionNone animations:^{

            self.bottomButton.frame = CGRectMake(kScreenW - 80, kScreenH - 140, 60, 60);

        } completion:NULL];

    }

    self.offsetY = scrollView.contentOffset.y;//將當前位移變成緩衝位移

}

 

 

 

 

 

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.