質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.34%

swift4.2 UIButton, UIStackViewを用いたドロップダウンへのアイテム追加(コード記述で)

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 1,322

mogiruri

score 21

こんにちは。
iOSアプリでドロップダウン機能の実装を試みています。

以下リンクを参考にしました。
参考リンク

実装方法としては、storyboard(SB)を用いることが前提の内容で
1:表示及び開閉スイッチ役のボタン(スイッチボタン)、プラス選択肢のアイテムの数分ボタン(アイテムボタン)を下に配置
2:全てをstackViewでまとめる
3:サイズ等のUI設定を行い、アイテムボタンをisHidden = true
4:スイッチボタンをSBからエディタへ引っ張っての@IBOutlet @IBAction作成
5:アイテムボタンの一つを同じように繋げ、outletはcollection、そして@IBActionを作成
6:残りのアイテムを上記で作成したoutlet, actionに数だけドラッグで接続

コードは以下のように記述して作成自体はOK,動作もOK
余計なところは割愛します

import UIKit

class SettingViewController: UIViewController {

    @IBOutlet weak var tagDDIcon: UIButton!
    @IBOutlet weak var tagSetBtn: UIButton!
    @IBOutlet var tagSetItems: [UIButton]!
    @IBOutlet weak var tagStackView: UIStackView!

  var datas = [
    cellData(name: "Item", detail: "detail", tag: "tag", memo: "aafdagdagggfsgesighreiwhgiurewhiugrhewuihgurewhgiurhewiugrheiwghruiehwgiurhewuighriuewhgiurewghriuewhguirehwgiurhewighreuwighruiewhguirehwgiurhewiughriuwghiurehwighriuehugihruiwghwiurhiuhiuwegh", fav: false, cellNo: 0),
    cellData(name: "Item1", detail: "detail", tag: "tag2", memo: "aafdagdagggfsgesighreiwhgiurewhiugrhewuihgurewhgiurhewiugrheiwghruiehwgiurhewuighriuewhgiurewghriuewhguirehwgiurhewighreuwighruiewhguirehwgiurhewiughriuwghiurehwighriuehugihruiwghwiurhiuhiuwegh", fav: false, cellNo: 1)
]
    var tags = [String]()


    override func viewDidLoad() {
        super.viewDidLoad()

        timeDDIcon.isEnabled = false
        tagDDIcon.isEnabled = false

     // datasからtag:Stringを抜き出してarrayを作るメソッド
     // 重複はなくなるように設定
        createTagArray() 

     //タグの数だけボタンを作成してアイテムを追加して行こうという算段
        // が、何も起こらず、、、
        for i in 0...tags.count - 1 {
            let button = UIButton()
            tagStackView.frame = CGRect(x: tagStackView.frame.origin.x, y: tagStackView.frame.origin.y, width: tagStackView.frame.width, height: tagStackView.frame.height + tagSetBtn.frame.height)
            button.backgroundColor = UIColor.hex(string: "24262F", alpha: 1)
            button.titleLabel?.text = tags[i]
            button.setTitleColor(.white, for: .normal)
            button.frame = CGRect(x: 0, y: 0, width: tagStackView.frame.width, height: 30)
            button.isHidden = true
            tagStackView.addSubview(button)
            print("reputation \(i)")
            print(tagStackView.subviews)
        }

    }

    /* -------------------------------------------------------------
     dropdown functions
    ------------------------------------------------------------- */


    // 押すとドロップダウン作動
    @IBAction func tagSetBtnAction(_ sender: UIButton) {
        tagSetItems.forEach { (button) in
            UIView.animate(withDuration: 0.3, animations: {
                button.isHidden = !button.isHidden
                if !button.isHidden {
                    self.tagDDIcon.setImage(#imageLiteral(resourceName: "dropup"), for: .normal)
                }else{
                    self.tagDDIcon.setImage(#imageLiteral(resourceName: "dropDown"), for: .normal)
                }
                self.view.layoutIfNeeded()
            })
        }
    }

  //アイテムボタン触ると作動 SBからアイテムが結び付けられてる
    @IBAction func tagSetItemsAction(_ sender: UIButton) {
        tagSetBtn.titleLabel?.text = sender.titleLabel?.text
        tagSetItems.forEach { (button) in
            UIView.animate(withDuration: 0.3, animations: {
                button.isHidden = !button.isHidden
                if !button.isHidden {
                    self.tagDDIcon.setImage(#imageLiteral(resourceName: "dropup"), for: .normal)
                }else{
                    self.tagDDIcon.setImage(#imageLiteral(resourceName: "dropDown"), for: .normal)
                }
                self.view.layoutIfNeeded()
            })
        }
    }

}

UIイメージ

これを
before
押すとこうなります。
after

AllはSBで上記のやり方で事前に作成してます
buttons

やりたいこと

やりたいことは、タグの数(ドロップダウンアイテムの数)は可変なので、初期設定のAll以外のボタンはコードで実装する必要があります。
なので、オブジェクトをコードで作成してUI設定をし、stackViewのsubViewに追加してみましたが何も起きませんでした。
手助け願えると幸いです。

補足

constraintsは

stackview

アイテム間のスペーサーは1
左右は横アイテムに7

ボタンたち

hight はそれぞれ 30

追記

addArrangedSubView(button)を試みたがドロップダウンでは追加されていませんでした。

オブジェクト自体はsubViewに追加されているようです。(printで確認)

[<UIButton: 0x7fbf94622cd0; frame = (0 0; 186.667 30); opaque = NO; autoresize = RM+BM; layer = <CALayer: 0x600003996760>>,
<UIButton: 0x7fbf94619760; frame = (0 0; 186.667 30); hidden = YES; opaque = NO; autoresize = RM+BM; layer = <CALayer: 0x600003994800>>,
<UIButton: 0x7fbf9444d570; frame = (0 0; 186.667 30); hidden = YES; opaque = NO; layer = <CALayer: 0x600003980f80>>
]
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

checkベストアンサー

0

UIStackViewに追加する場合はaddSubView()ではなく、addArrangedSubView()を使う必要があります。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/02/28 17:40 編集

    コメントありがとうございます。
    addArrangeSubView()で追加してみましたが、ドロップダウンには追加されませんでした。
    stackViewの中身をコンソールに出してみたところ、追加はされてるようなのですが、、

    プリント内容追記いたしました。

    SBで作成したアイテムはドラッグでエディタの outletCollection と @IBAction につなぐ工程があったのですが、コードで作成したこのUIButtonも何か記述で施す必要があるのでしょうか?

    キャンセル

  • 2019/02/28 19:26

    コードで、アイテムをoutletCollection.append(アイテム)、アイテム.addTarget()で記述の関数にセレクタを合わせることで解決できました!
    ちなみに、上記のコードのアイテム.titleLabel?.textにstringを代入するとオプショナルエラーになってしまっていたのですが、アイテム.setTitle()に変更することでそれも解決できました。

    助言ありがとうございました!

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.34%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る