[iPhone] UIButton でヘッダー、フッターバナーを作る (Objective-C)

アプリ画面の上と下にバナー広告を付けたり、リンクを貼りたいケースがあります
UINavigationBar を使うのが常套手段ですが
ボタンでも作れます。メリットは画像バナーにする場合です。
ナビゲーションバーでは、ボタンを中に入れたりできるのですが
逆にそうしないといけない。

sponsored link

UIButton ヘッダー、フッターバナー

 
作成プランとしては
– ヘッダーを通常のボタンでタイトル付き
hedder_1
 
– フッターはカスタムボタンとして背景を画像
footer_1
 

ヘッダーボタンの作成

 
ヘッダーボタン作成の流れは

  1. ボタンのインスタンス作成
  2. Type を UIButtonTypeSystem に設定
    • UIButtonTypeRoundedRectは iOS7 から非推奨
  3. スクリーン幅の取得
    • self.view.frame.size.width を使います
    • 画面が機種や回転で変わっても最上部になるようにする
    • 回転に対応するには、実際はもう一手間かけて
    • 動的に回転を補足する必要があります:参考
  4. 表示するフレームを設定
    • CGRectMake(0, 0,スクリーン幅 ,ボタン高さ)で設定
    • frame に入れボタンの大きさ位置を決める
  5. 背景色の設定
    • backgroundColorを使う
  6. ボタンタイトル色
    • setTitleColorにて設定
  7. ボタンタイトル
    • setTitleによって設定する
  8. ボタン内のタイトル位置マージン調整
    • ヘッダーはステータスバーがあるためをそれを隠すか
    • ボタンのタイトル位置の調整が必要です
    • setTitleEdgeInsets:UIEdgeInsetsMake(top, left, bottom, right)
  9. ビューへ貼る
    • addSubviewでボタンをviewに貼る
  10. ボタンが押されたときのAction
    • addTarget:self
      action:@selector(ボタン名:) // 「:」に注意
      forControlEvents:UIControlEventTouchUpInside

 

 

フッターボタンの作成

 
フッターボタン作成の流れはヘッダーと一部同じです

  1. ボタンのインスタンス作成
  2. フッター画像をプロジェクトに追加
  3. UIImage のインスタンスを生成
  4. ボタンのType を Custom に設定
  5. ボタン背景に画像を貼る
    • ボタンにタイトルを入れるので画像は背景にします
    • setBackgroundImage を使います
    • setImage にするとタイトルが入りません
  6. スクリーン幅/高さの取得
  7. ボタンの高さを決める
  8. 表示するフレームを設定
    • iPhoneの機種毎のスクリーン高さや回転に合わせます
    • CGRectMake(0, screenHeight-buttonHeight, screenWidth, buttonHeight)
  9. ボタンタイトルの色を設定
  10. ボタンタイトルを設定
  11. ビューへ貼る
  12. ボタンが押されたときのAction

 

 

コード

 
全体のコードです
ViewController.m のみです
ボタンが押されたときのメソッド内にそれぞれ
希望する挙動を記述することになります
今回はログを出すだけにしてあります。
 

 
最終的にこのようになりました。
 
hedder_0
 

ページのトップへ戻る
 
sponsored link

シェアする

  • このエントリーをはてなブックマークに追加

フォローする