iOSDC 2017 (Sep 16, 2017) https://iosdc.jp/2017/node/1317 Library: https://github.com/inamiy/Cassowary
レイアウトをInterfaceBuilderを使わずにコードで生成する場合に何とも可読性の低いコードになってしまいます。 そこでAutoLayoutをDSL風に記述できてしまうSnapKitを使ってみたよ、という記録。 SnapKitインストール まず適当にプロジェクトを作ってCocoaPodからSnapkitをインストールします。 以下のようなPodfileを用意します。 source 'https://github.com/CocoaPods/Specs.git' platform :ios, '8.0' use_frameworks! pod 'SnapKit', '~> 0.15.0' let label1 = UILabel() label1.font = UIFont.systemFontOfSize(32) label1.numberOfLines = 4 label1.te
著者の川邉さん(@jeffsuke)および出版社のリックテレコム様より『よくわかるAuto Layout - iOSレスポンシブデザインをマスター』をご献本いただきました。 タイトルの通りAuto Layoutの解説書で、豊富な図やスクリーンショットを用いて、非常にわかりやすく書かれています。前書きによると、本書の対象読者は 過去一度はXcodeを用いてiOSアプリをつくったことがあるが、Auto Layoutとサイズクラスを用いたAdaptive Layoutと言われると尻込みしてしまう開発者 とのこと。 なんかもうベストセラーになったりしてるらしく、 「よくわかるAuto Layout iOSレスポンシブデザインをマスター」発売しました。@tokorom 監修。今、モバイルプログラミング分野でベストセラーらしいです! https://t.co/wx7ZfuWVdf— Yusuke Ka
Rachel Bobbins Stitch FixでiOSのリードエンジニアをしています。以前はPivotal Labsで働いていました。ユーザ・開発者の両方にとって素晴らしい経験を作り出すことを大切にしています。 twitter.com D.A.ノーマン著「誰のためのデザイン?(原題: \"The Design of Everyday Things\")」はデザイン哲学に焦点をあてたデザインの書です。そこで紹介されている多くの原則はSwiftのような物理的ではない言語についても当てはまります。このような原則を通して、読みやすく効果的なコードの書き方を探ります。 6年前に読んだ本を読み返しました。 心理学や認知科学から考えて製品を設計するというものです。 この本で紹介されている内容とコードの関係を考えてしまいます。どうやってコードの設計にこれを適用するか。 ひょっとすると危ない未知を歩んで
当初、めちゃいけてるPullRefreshライブラリDGElasticPullToRefreshを使う予定でしたが、AutoLayoutのバグで使用を断念 RxSwiftでのMVVMモデルの実現 こんなイメージ RxSwiftの使い所 1. Model : リクエストでObservableオブジェクトの生成 ここでは、APIリクエストでObservableオブジェクトを生成 レスポンスのJSONは、ObjectMapperを利用して作成したモデルクラスFeedResponseにマッピングしておくと楽でした func connect() -> Observable<FeedResponse> { let observable: Observable<FeedResponse> = Observable.create { (observer: AnyObserver<FeedResponse>
Eureka EngineeringLearn about Eureka’s engineering efforts, product developments and more.
『アプリ道場 Advent Calendar 2015』8日目は「Auto Layoutが好き過ぎて、StackViewをおかずにご飯3杯いける」ゆこびん(@yucovin)がお送りします。 そもそもイラストレーター/デザイナーなので、アプリの開発をしていても見た目を司るAuto Layoutが気になって気になってしょうがないです。(これは恋?!) ということで、本日は今年綺羅星のごとく現れたAuto Layout界の期待のクラス「UIStackView」についてまとめたいと思います!(๑´ㅂ`๑) UIStackViewは一言で言うと、便利なレイアウト用の箱です。 StackViewは2つ以上の縦または横に並ぶサブビューを面倒な制約(Constraints)を作ることなく、いいカンジにレイアウトしてくれます。 StackViewを上手く使えば制約の数をうんと少なくすることができるんです。
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
Auto Layoutを使って既存アプリをiPhone 6(S)/6(S) Plus対応した際に得た知見をまとめてみました。 以下、上級編となります。 ※iOS 9で導入されたStack ViewについてはiOS 8を切れない事情で使えませんでしたorz... ※下記のサンプルに使用したStoryboardファイルはこちらです。 https://gist.github.com/ypresto/ee3b2f592b40936c11ec ※設計が悪くて画面サイズ変わるとぶっ壊れちゃう箇所をUnit Testで把握するライブラリ書きました https://github.com/ypresto/AutoLayoutLint http://qiita.com/yuya_presto/items/742a9e6dd95667bd62c9 詳解編 Auto Layoutの仕組みやPriority、Int
以前書いた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対応を進めていて、弊チームでは以下の3つのルールを対応必須とすることにしてみました。 全てのStoryboard/Xibでuse AutoLayoutのチェックを有効にする 全てのStoryboard/Xibでuse SizeClassesのチェックを有効にする AutoLayoutのmisplacedは必ず解消した状態でコミットする AutoLayoutはとにかく仕様が複雑で開発するのが大変なので、少しでも楽にしていくために最低限機械的にチェックできるところを自動化しました。 #!/bin/bash ! find . -name '*.xib' -o -name '*.storyboard' | xargs grep misplaced 2>&1 > /dev/null && \ ! find . -name '*.xib' -
Xcode の Storyboard で Scroll View(UIScrollView)を使おうとしたところ、Scroll View に対する AutoLayout の設定が難しくてちょっとはまったので備忘録メモです。Constraints(制約)の警告が消えなかったり、ビルドしたらスクロールしなかったりと、色々試行錯誤してしまいました。 以下のエントリー等のおかげで解決できました。ありがとうございます。 【UIScrollView × Autolayout 問題】Appleエンジニア直伝のファイナルアンサー – Over&Out その後 iOS: How To Make AutoLayout Work On A ScrollView UIScrollView and Autolayout – Xcode 6 – YouTube 3番目 Youtube リンク先が、Xcode での操作
iOS8からのTableViewCellの高さ自動計算は、上スクロールした時にはうまく動かない件で、UITableViewCellの高さ自動計算でハマる場合がある事がわかりました。 これを回避するには、estimatedHeightを使わずに、真面目に高さ計算を行えば良いです。 Autolayoutが無い時代には、これをごりごりと計算していたのですが、UITableViewCellにAutolayoutを使う事で、かなり簡略化できたのでその記録を残します。 おおまかな流れ UITableViewDataSourceから参照できる所に、「表示する事の無い、高さ計算用のダミーセル」を用意します。 tableView:heightForRowAtIndexPath: で、ダミーセルを使って高さ計算を行います。 このときAutolayoutで計算ができるので、比較的楽です。 ソース - (void
Web エンジニアだったはずがひょんなことから iOS アプリを書き始めてはや3ヶ月。ヘルスケア事業部の濱田です。 iOS アプリで画面遷移を実現するためには様々な方法があります。 コードのみを使う方法 xib を使う方法 storyboardを使う方法 etc. 初めはかなり混乱しましたが、最終的には storyboard と xib の合わせ技に落ち着きました。 今回はこの方法についてご紹介します。 storyboard を使うか、xib を使うか、それが問題だ アプリの UI 部品の配置は結構たいへんな作業です。とくに Autolayout の制約の設定などは、コードのみで設定するのは困難でしょう。Interface Builder の支援をなるべく活用したいところです。 そこで、storyboard もしくは xib ファイルを利用して ViewController(以下 VC)
AutoLayoutになってから追加されたUILabelのプロパティpreferredMaxLayoutWidth。なぜ必要になったんでしょうか?intrinsicContentSizeと共に理解する必要があるでしょう。 intrinsicContentSizeはViewの内容を表示するために必要なサイズを返します。UILabelやUIButtonの場合、文字列の長さによってサイズが可変します。UIImageViewの場合は画像サイズを返します。intrinsicContentSizeが返すサイズに応じてAutoLayoutはレイアウトします。 ただのUIViewなどは、それ自身でサイズは決められないので、intrinsicContentSizeはUIViewNoIntrinsicMetric(サイズ不明)を返します。こういったViewはSuperviewで設定されたConstraintに
iOS、Android、Unityなどのアプリ開発について、初心者向けの内容を『RainbowApps』講師陣が分かりやすく解説していきます。 第5回に引き続き、「AutoLayoutの使い方」です。 第5回ではAutoLayoutの基本的な使い方を学びましたので、今回はより実践的なレイアウトを組んでいくことで、AutoLayoutへの理解を深めていきましょう。 【1】画面サイズに応じた大きさでViewを表示する 【2】等間隔にViewを表示する 【3】宿題 最終的に下記のような画面を作っていきます。 【1】画面サイズに応じた大きさでViewを表示する ImageViewを用いて写真やコンテンツの画像を「どーんと表示したい」ことはよくあると思います。しかし、画像のアスペクト比(縦横比)が変わってしまっては台無しですね。 そこで、アスペクト比を維持したまま画面サイズに応じて大きさが変わるよう
はじめまして、xyz_iです。 これまでWebアプリケーションばかり作っていた自分が、1月からiOSアプリ開発を行っています。 いろいろと覚えないとならないことが多く四苦八苦してますが、アプリ開発経験のあるチームメンバーに助けられながらなんとかやっています。 そんな感じで1ヶ月ちょっとやってきて、はじめにこれは抑えておいた方が良いなと思ったことをいくつか挙げていきます。 ただし、作るアプリによって必要になってくるスキルや知識は全く異なってくると思います。今回の記事はあくまで自分自身が携わった部分での話になります。 この記事が対象としているのは、以下のような方です。 iOSアプリ開発をこれから始めようとしていて、学習を始めている iOSアプリ開発を始めて間もない AutoLayout まずAutoLayoutの概要についてAppleの公式ドキュメントから引用してきますと、 Auto Layo
huin Job : Software Engineer(iOS, Android) Use : Objective-C, Swift, Java Like : Gadget, Apple, Photography, Art, Design, UI, UX More posts by huin. 発表直後に一気に話題になりましたがfacebookがReact.jsのスタイルでネイティブアプリを作成するツール「React Native」を発表しました。"Learn once, write anywhere"という思想で、一度学習してしまえばWeb/iOS/Androidとすべての(メジャー)なフロントエンドアプリケーションを作成することができると説明しています。 が、ツール自体はまだ公開されておらず、発表のインパクトの割には中身がしれないのですが、React Nativeが発表されたReac
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く