タグ

関連タグで絞り込む (2)

タグの絞り込みを解除

autolayoutに関するgriefworkerのブックマーク (3)

  • Auto Layoutの静的な制約で実現するカラム幅が可変のテーブル - 24/7 twenty-four seven

    次に示すような見出しと各カラムが右寄せ、ラベルの文字数によってカラムの幅が伸縮し、広くなった場合は隣の列を押し出し、短くなった場合は少なくとも見出しの幅に収まり、各列の間には一定のマージンを置くというテーブルレイアウトを、静的なAuto Layoutの制約だけで作ることを考えます。 このような、UIコンポーネントが持つコンテンツの大きさによって隣接するコンポーネントを押し出すような場面ではAuto Layoutがとても効果的に働きます。 Auto Layoutなしで実現しようとすると、列ごとの各行の文字幅を計算し、最大の幅に合わせて再配置する、という処理をコンテンツが変わるたびに行うということになりますが、Auto Layoutの制約を使用する場合ではそもそもレイアウトの再計算を自分でやる必要はないので、コンテンツの変わったタイミングなどを気にする必要はありません。 ただデータを再代入する

    Auto Layoutの静的な制約で実現するカラム幅が可変のテーブル - 24/7 twenty-four seven
  • Auto Layoutの静的な制約で実現する伸び縮みするヘッダービュー - 24/7 twenty-four seven

    TL;DR, 優先度の異なる複数の制約を同時に定義することで、静的な定義だけで動的な振る舞いを実現できる 動的な要素の少ない構造のビューはより堅牢である はじめに 読みやすくメンテナンスしやすいソフトウェアを作るために重要なことの一つは構造をシンプルに保つことです。 iOSアプリのビューは壊れやすいソフトウェアの代表ですが、できるだけシンプルに作ることで変化に強い、堅牢で壊れにくいソフトウェアにできます。 動的な要素が少ないということは、ビューがシンプルであるということの指標の1つと言えます。 この記事では下記に示すような、スクロールに合わせて伸び縮みするヘッダーを、動的な要素を無くし、Auto Layoutの静的な制約のみで実現する方法を解説します。 動的な要素とは、実行時におけるビューおよび制約の追加・削除、Frameや制約を更新することと、機種やスクリーンサイズ、標準UIコンポーネン

    Auto Layoutの静的な制約で実現する伸び縮みするヘッダービュー - 24/7 twenty-four seven
  • Auto Layoutの静的な制約で実現するテキストの量によって折りたたみ可能なテキストビュー - 24/7 twenty-four seven

    長いテキストが初期表示では折りたたまれて表示されていて、「つづきを読む」ボタンを押すことで表示エリアが拡大して全文が表示されるという挙動を、できるだけ動的な要素を排除して実現してみます。 サンプルコードは下記のリポジトリで公開しています。 github.com 今回の例ではUIStackViewを活用します。UIStackViewは内部のビューのisHiddenプロパティによってビューのサイズをゼロにできるので、うまく活用すればあたかも複数のレイアウトを切り替えているような挙動を実現できます。 テキストビュー(またはラベル)の左右両端と上端が一致するようにStack Viewに制約を付けます。 さらにテキストビューとStack Viewの高さが一致する制約を付けます。 Stack Viewの中のビューに高さの制約として折りたたんだときのサイズを指定します。例では200ptです。 テキストの

    Auto Layoutの静的な制約で実現するテキストの量によって折りたたみ可能なテキストビュー - 24/7 twenty-four seven
  • 1