タグ

uiとAutoLayoutに関するdaabtkのブックマーク (5)

  • iPhone X対応におけるデザイン上の注意ポイント | fladdict

    iPhone Xが発表されたわけですが、なにこのデザイナー泣かせの変態端末。 iPhoneUI設計者グレッグ・クリスティが追い出されて、ジョナサン・アイヴがソフトウェア統括となったのが2014年。 iOS7のフラット化あたりから、どんどんとUI設計が置いてけぼりになった感がありましたが・・・ここにきてまたデザイナー泣かせの豪速球が。 ざっくりデザインガイドラインを読んでの、気になったところメモ。 画面サイズ サイズは従来のベースであった4.7インチの375pt x 667ptから、375 x 812ptに。縦方向に145pt追加された。 想定されるインパクト 表示可能な情報量が増える 縦スクロール系コンテンツのコンバージョンが増加 スクロールで隠れるナビゲーションの必要性が低下 画面上部のボタンのコンバージョンが低下 ゲームなどの全画面イラストに、黒枠が出たり、見切れたりする グラフィッ

    iPhone X対応におけるデザイン上の注意ポイント | fladdict
  • コードでAutolayoutを簡単に書く方法2つ - Qiita

    動的に生成されるViewに対して、marginなどを指定したいとき Autolayoutをコードで書く必要があります。 ただ、普通に書くと.. addConstraint(NSLayoutConstraint( item: button1, attribute: .Right, relatedBy: .Equal, toItem: button2, attribute: .Left, multiplier: 1.0, constant: -12.0 )) たかだか左右のmarginを書くだけでもこれだけのコード量を書かねば ならず、直感的ではないです。 何かCSSのように、簡単に書ける方法がないか探したところ 2パターンの書き方がありました。 [パターン1]Cartographyを使う Cartography というライブラリを使うと、 Swiftのクロージャを使って簡単にレイアウトが組め

    コードでAutolayoutを簡単に書く方法2つ - Qiita
  • SwiftでもObjective-Cでもコードで簡単にAutoLayoutする - Qiita

    MisterFusionを使ったコード 上記のレイアウトをMisterFusionを使って再現すると、以下のようなコードになります。まずは使いたいクラスの中で、import MisterFusionをしてください。 let redView = UIView() redView.backgroundColor = .redColor() self.view.addLayoutSubview(redView, andConstraints: redView.Top |+| 10, redView.Right |-| 10, redView.Left |+| 10 ) let yellowView = UIView() yellowView.backgroundColor = .yellowColor() self.view.addLayoutSubview(yellowView, andCon

    SwiftでもObjective-Cでもコードで簡単にAutoLayoutする - Qiita
  • AutoLayoutでアニメーションを設定する方法(Swift版) - Qiita

    以前書いたAutoLayoutでアニメーションを設定する方法のSwift版です。 アニメーションで動かしたいものの例 例として、mainViewの上に乗った、movableViewを下に動かすことを考えます。 movableViewの制約は、superViewであるmainViewに対して、以下のような制約を持っているとします。 Top Space, Trailing Space, Leading Spaceの各種の制約の値は0になっています。高さは適当です。 やってみる 基的な考え方は、既に付いているautoLayoutの制約を外し、別の制約を付ける、ということです。今回の場合、"Top Space to SuperView = 0" の制約を外し、Top Space to mainView = 30 といった制約をつけます。 まず外す対象の制約をoutletでソースに結び付けておきま

    AutoLayoutでアニメーションを設定する方法(Swift版) - Qiita
  • UICollectionViewで綺麗な横スクロールページング - Qiita

    UICollectionViewを使用しての横スクロールを実装するUIは多々あると思いますが、検索して出てくる情報ではかなり微妙な動作が多く、自分の決定版として作成方法をまとめます。 今回の作成はAutoLayoutは使用しておりません。 完成イメージ (画像は今回作成段階で参考にさせていただいたeuraka様のブログより転載させていただいてます) 参考記事のように作成する まず、はじめにeureka様がまとめてくださっている記事のように実装してみました。 タイムラインの実装に欠かせない!UICollectionViewで作るFacebook風レイアウト 作成してみると確かに綺麗にTimeline風の横スクロールが実装されています。 しかし、作成の過程上、左右にすき間が発生してしまい、スクロール判定がきかない箇所ができてしまいます。 表示枠のでかいcellの作るのでしたらあまり気にならない

    UICollectionViewで綺麗な横スクロールページング - Qiita
  • 1