不格好エンジニア (引っ越しました)

wordpress.comから引っ越しました。

【ニュースアプリ/リーダー】tableView/ScrollView上に浮いているUIButtonを実装する 【Gunosy風】

はじめに

前回は、こちらの記事で、ニュースアプリの土台となるUIを作成しました。

【5分でできる】タブと複数tableviewをスワイプする今どきNewsアプリ風のUI(Gunosy, SmartNews等)【コピペで作る】 - 不格好エンジニア (引っ越しました)

今回は、ScrollViewを横にスライドさせても、同じ位置にずっと浮かんでいる設定ボタン(画面右下のやつです)を作成してみます。

f:id:tjnet555:20141126233543p:plain

実装

コード

frameを指定して、設定ボタンを追加していきます。

-(void)loadSettingsButton
{
    CGRect screenFrame = [UIScreen mainScreen].bounds;
    
    //
    //settings button
    CGFloat inset = 20;
    CGFloat settingsButtonHeight = 32;
    CGFloat settingsButtonWidth = 32;
    
    CGRect settingsButtonFrame = CGRectMake(screenFrame.size.width - (settingsButtonWidth + inset),
                                            screenFrame.size.height - (settingsButtonHeight + inset),
                                            settingsButtonWidth,
                                            settingsButtonHeight);
    
    UIButton *settingsButton = [UIButton buttonWithType:UIButtonTypeCustom];
    [settingsButton setFrame:settingsButtonFrame];
    
    [settingsButton setBackgroundImage:[UIImage imageNamed:@"settings_button"] forState:UIControlStateNormal];
    [settingsButton addTarget:self action:@selector(respondToPushSettingsButton:) forControlEvents:UIControlEventTouchUpInside];

    [self.view addSubview:settingsButton];    
    [self.view bringSubviewToFront:settingsButton];

}

ボタンを前面に持ってくる

最後の2行で、追加したボタンを前面に持ってくるのがポイントです。

    [self.view addSubview:settingsButton];    
    [self.view bringSubviewToFront:settingsButton];

bringSubViewToFront:
Moves the specified subview so that it appears on top of its siblings.
This method moves the specified view to the end of the array of views in the subviews property.

追加したsubViewを最前面に移動する訳ですね。あんまり多用するとカオスなコードになりそう。。

まとめ

今回は、tableView/ScrollView上に浮いているUIButtonを実装しました。たぶん続きます。
ソースコードはこちらtjnet/MultipleTableViewModernNewsApp · GitHub