« 仮説:間違い:科学ジャーナリズム:ウソ:オカルト | トップページ | ◆手持ちドローンCamが欲しい »

swift3でボタンレイアウト

 swift3で多解像度対応ボタンレイアウト

swift3プログラムで画面解像度を反映するボタンレイアウトを行いました。
例えばiPad-mini-2(retina)とiPod-touchで表示すると次のようになります。

位置やサイズ、フォントサイズは画面全体のサイズから計算して出しています。 (奇怪至極のstoryboard使用のレイアウトは行いません)

プログラムを示します。2016/09段階でのswift3(Xcode Version 8.0 (8A218a))でワーニング無しで動きます。

import UIKit
class ViewController: UIViewController {
   override func viewDidLoad() {
      super.viewDidLoad()
      // Do any additional setup after loading the view, typically from a nib.
      let screenSize:CGSize = UIScreen.main.bounds.size;     // 画面サイズ
      let bh:CGFloat        = screenSize.height * 0.1;       // ボタンの高さ
      let bw:CGFloat        = bh * 3.0;                      // ボタンの幅
      let fs:CGFloat        = bw / 8.0;                      // フォントサイズ
      for i in 0...2 {
         let b:UIButton = UIButton();                        // ボタン生成
         b.frame = CGRect(x:     (screenSize.width-bw)  / 2.0 * CGFloat(i)
                         ,y:     (screenSize.height-bh) / 2.0 * CGFloat(i)
                         ,width: bw
                         ,height:bh);                        // 位置とサイズ
         b.setTitle("BUTTON-\(i + 1)",for:UIControlState()); // 表示文字
         b.titleLabel?.font = UIFont.systemFont(ofSize:fs)   // フォントサイズ
         b.setTitleColor(UIColor.red,for:UIControlState());  // 文字の色
         b.backgroundColor = UIColor.yellow;                 // 背景色
         b.addTarget(self
                    ,action:#selector(ViewController.buttonDown(_:))
                    ,for:UIControlEvents.touchDown);         // callback設定
         b.layer.borderColor  = UIColor.black.cgColor;       // 枠の色
         b.layer.borderWidth  = 1;                           // 枠の幅
         b.layer.cornerRadius = 4;                           // 枠の角の曲がり
         self.view.addSubview(b);                            // 親viewへの追加
         }
      }
   override func didReceiveMemoryWarning() {
      super.didReceiveMemoryWarning()
      // Dispose of any resources that can be recreated.
      }
   @objc func buttonDown(_ sender:Any){    // callback関数
      let b:UIButton = sender as! UIButton;
      if( b.currentTitleColor == UIColor.red ){              // 赤なら
         b.setTitleColor(UIColor.blue,for:UIControlState()); // 青に
         }
      else {                                                 // 赤でないなら
         b.setTitleColor(UIColor.red ,for:UIControlState()); // 赤に
         }
      }
   }

ボタンを次の位置に出します。

  • 左上  (0,0)
  • 真ん中 ((画面幅-ボタン幅)/2,(画面高-ボタン高)/2)
  • 右下  (画面幅-ボタン幅,画面高-ボタン高)

ボタンには位置、サイズの他、

  • タイトル文字列
  • タイトル色
  • 地の色
  • フォントサイズ(さらなる検討が必要)
  • 枠(色,幅,角の具合)
  • ボタンが押された時に呼ばれる関数
をセットしています。フォントサイズも画面サイズを反映します。

ボタンが押される度に赤と青が反転するようにしています。

 メモ

ビルド/実行しようとして
 The maximum number of apps for free development profiles has been reached.
というエラーがでたら実機(iPhone/iPad/iPod)側にある試験appを削除する。


文字列中に演算結果を入れるには\(xxx)記述を使う。
 "BUTTON-\(i + 1)"
あるいはStringに変換して結合する。
 "BUTTON-" + String(i + 1)


編集中にブレークポイントがちょっとしたことでいとも簡単に全く意識することなく意地悪く設定されてしまうので、 ビルド/実行前に必ずブレークポイントを確認し削除するという手間を惜しんではならない。


演算子の前後は必ず空白を入れること。
例えば、

  let A = XYZ*W;  // OK
  let B = A  *W;  // エラー!!
--
  let A = XYZ * W;// OK
  let B = A   * W;// OK
という形になる。現時点ではswiftは真っ当な構文解析能力を有していない。


同じswift3といってもバージョンupのたびに記述法が変わることに注意が必要。

|

« 仮説:間違い:科学ジャーナリズム:ウソ:オカルト | トップページ | ◆手持ちドローンCamが欲しい »

トラックバック


この記事へのトラックバック一覧です: swift3でボタンレイアウト:

« 仮説:間違い:科学ジャーナリズム:ウソ:オカルト | トップページ | ◆手持ちドローンCamが欲しい »