日々の学び

投稿日:

スタックビューを使ってラベルを2個並べる方法−iOSエンジニア8−10週目

 

こんにちは。

2週間ぶりに書いています。動画編集の方が忙しかったので、なかなか書けませんでした。まだ案件は取れていないんですが...。

 

さて、タイトルの通り、長いこと悩んでいたラベルの件が解決したので、それについて書いていこうと思います。

解決したのは8週目なんで、少し前になるんですけどね。

 

スタックビューにラベルを2つ並べて綺麗に表示させる

最初に結論から書くと、「widthAnchor」の値を調節することでうまく表示することができました!

 

やりたかったことは以下の通りです。

「スタックビューにラベルを2つ並べて、片方のラベルが表示されないときはもう一つのラベルをトルツメで表示する。また、その際はラベルのサイズはスタックビューいっぱいに広がらず、文字数に応じたサイズになること。」

 

これを実現させるために、約3週間程あーでもないこーでもないとやっていました。

 

一応コードを書いておきます。

ちなみに実現したいのは、以下の図のようなレイアウトになります。mainStackViewの下にも表示するものはあるのですが、今回は省いています。

 

とりあえずこんな感じでうまく表示されました。

上で書いたように、widthAnchor.constraint(greaterThanOrEqualToConstant: 90)の数字を変えることでラベルの表示幅を調節しました。

 

何点か注意書きを入れておきます。

  • setContentHuggingPriorityに関しては、まだ完全に理解できておらず、動作検証をして表示に問題がないということで、上の値にしています。
  • widthAnchorのgreaterThanOrEqualToConstantについても、まだ理解が甘いと思っています。一応表示はうまくいきましたが。
  • if文の条件に当てはまらないiPhone8などは最初のデフォルト値(105)が採用されます。

 

こんなところでしょうか。

一応、9週目と10週目にも色々やっていたのですが、この辺りで終わりにしておきます。

 

ラベルを並べるのにあたって参考にしたサイトの一覧を並べておきます。

【Swift】Compression Registance PriorityとContent Hugging Priorityをコードから考える

【Swift】超便利StackViewの実践的使い方!まだAutoLayoutで消耗してるの?

 

以上。

スポンサードリンク




スポンサードリンク




-日々の学び

Copyright© トマブログ , 2021 All Rights Reserved Powered by STINGER.