Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
コードでUI構築してみた
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
tiking
October 02, 2020
Programming
0
140
コードでUI構築してみた
以前LTで登壇した内容です
tiking
October 02, 2020
Tweet
Share
More Decks by tiking
See All by tiking
デザインシステムっていいな
tiking76
0
240
GraphQL 入門
tiking76
0
1.5k
みんなTCAって 知ってる?ver2.0
tiking76
1
360
みんなTCAって知ってる?
tiking76
0
1k
最近きてるかもって思ってるデザイン
tiking76
0
290
Swiftのちょっとうれしい構文
tiking76
0
130
p1assさんを作ろうと試みました
tiking76
0
170
PRのときに使われがちな略語のやつ
tiking76
0
140
swiftでもグラフ書いてみたくない??
tiking76
0
270
Other Decks in Programming
See All in Programming
PJのドキュメントを全部Git管理にしたら、一番喜んだのはAIだった
nanaism
0
240
ベクトル検索のフィルタを用いた機械学習モデルとの統合 / python-meetup-fukuoka-06-vector-attr
monochromegane
2
340
Rails Girls Tokyo 18th GMO Pepabo Sponsor Talk
yutokyokutyo
0
210
Fundamentals of Software Engineering In the Age of AI
therealdanvega
1
220
モジュラモノリスにおける境界をGoのinternalパッケージで守る
magavel
0
3.5k
AWS Infrastructure as Code の新機能 2025 総まとめ 〜SA 4人による怒涛のデモ祭り〜
konokenj
10
3.3k
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
300
DSPy入門 Pythonで実現する自動プロンプト最適化 〜人手によるプロンプト調整からの卒業〜
seaturt1e
1
600
nuget-server - あなたが必要だったNuGetサーバー
kekyo
PRO
0
200
Claude Code の Skill で複雑な既存仕様をすっきり整理しよう
yuichirokato
1
320
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
420
AWS×クラウドネイティブソフトウェア設計 / AWS x Cloud-Native Software Design
nrslib
11
2.6k
Featured
See All Featured
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
aleyda
1
1.1k
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
chikuwait
0
380
Skip the Path - Find Your Career Trail
mkilby
1
72
Building Applications with DynamoDB
mza
96
6.9k
Stop Working from a Prison Cell
hatefulcrawdad
274
21k
It's Worth the Effort
3n
188
29k
The Limits of Empathy - UXLibs8
cassininazir
1
250
From π to Pie charts
rasagy
0
150
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
900
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
1.9k
State of Search Keynote: SEO is Dead Long Live SEO
ryanjones
0
150
Visual Storytelling: How to be a Superhuman Communicator
reverentgeek
2
460
Transcript
コードでUI構築してみた 2020/07/18 Zli × DMM合同
Readme name : 舘佳紀 colleage : 会津大学学部3年 さーくる : Zli所属です
Handlename : チキング 好きな言語 swift twitter @tikin0716 gitHub tiking76
背景 先日参加したハッカソンにて初めて体験して めっちゃええやんってなったので、個人でも やってみました。
あと… ・メルカリさんのこの記事をみて来てるぞ!!と思ったので… https://tech.mercari.com/entry/2019/12/13/155700 ・SwiftUIを用いてのXcode Previewによってデバックが手軽になったため。
今回やったこと storyboardやxibを使わずに、アプリを作った。
まずその前に… コードでUIを作るって実際どうなん?
メリット ・コードレビューがカンタン、差分がわかりやすい ・プルリクエスト、マージしようとしたときにコンフリクト(競合)が起きにくい ・パーツやUIViewControllerの再利用、継承がカンタン ・実装がコードに集約される(読みやすい)
storyboardのXML
デメリット ・iOSアプリ開発の入門はStoryboard前提のものが大半のため、学習コストがかかる ・レイアウトの確認に時間がかかる ・iOSエンジニア以外がレイアウトを確認したり、微調整するのに困難がある
どうやって作るん? ・コードでパーツを作っていきます。初回するコードの書き方→Initialization Closure ・自分の場合は、navigationControllerとか、rootViewの設定は、 SceneDelegate.swiftに書いてました ・layoutとかは、以下の画像のように実装していました。
SceneDeligateのコード
Layoutのコード Extention.swift
ラベルをつくりたい CustomInputAccessoryView.swif
ボタンをつくりたい CustomInputAccessoryView.swif, RegistrationController.swift
xibみたいなことしたい
None
letとlazyを使う時の注意 letでプロパティを定義した際には、viewDidloadで定義していないとselfが使えずエラー がでます。 button.addTarget(self, action: #selector(showNewMessage), for: .touchUpInside) この時にbuttonをlazyで定義してあげると、アクセス時に初期化されるのでselfが使え るようになります。
今回は、confighogehogeっていう関数で定義しているので使えている感じです。
画面遷移したい Loginページからメイン画面に遷移する
DEMO
参考資料 https://qiita.com/gaku2n/items/fa095276ab2d75cc8797
リポジトリー https://github.com/tiking76/chatapp
やってみておもったこと ・思いのほか自由なことができる反面、改めてIB(Interface Builder)の恩恵が あることを感 じることができました。 ・自分自身UIkitの知識が不足していたので、良い勉強になりました。
ここまで ありがとうございました