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
tiking
October 02, 2020
Programming
0
120
コードでUI構築してみた
以前LTで登壇した内容です
tiking
October 02, 2020
Tweet
Share
More Decks by tiking
See All by tiking
デザインシステムっていいな
tiking76
0
200
GraphQL 入門
tiking76
0
1.4k
みんなTCAって 知ってる?ver2.0
tiking76
1
340
みんなTCAって知ってる?
tiking76
0
990
最近きてるかもって思ってるデザイン
tiking76
0
270
Swiftのちょっとうれしい構文
tiking76
0
110
p1assさんを作ろうと試みました
tiking76
0
150
PRのときに使われがちな略語のやつ
tiking76
0
120
swiftでもグラフ書いてみたくない??
tiking76
0
240
Other Decks in Programming
See All in Programming
rage against annotate_predecessor
junk0612
0
160
TDD 実践ミニトーク
contour_gara
1
290
MCPとデザインシステムに立脚したデザインと実装の融合
yukukotani
4
1.4k
知っているようで知らない"rails new"の世界 / The World of "rails new" You Think You Know but Don't
luccafort
PRO
1
100
【第4回】関東Kaggler会「Kaggleは執筆に役立つ」
mipypf
0
1.1k
Azure SRE Agentで運用は楽になるのか?
kkamegawa
0
1.8k
アセットのコンパイルについて
ojun9
0
120
CloudflareのChat Agent Starter Kitで簡単!AIチャットボット構築
syumai
2
450
go test -json そして testing.T.Attr / Kyoto.go #63
utgwkk
3
280
AIでLINEスタンプを作ってみた
eycjur
1
230
「手軽で便利」に潜む罠。 Popover API を WCAG 2.2の視点で安全に使うには
taitotnk
0
820
[FEConf 2025] 모노레포 절망편, 14개 레포로 부활하기까지 걸린 1년
mmmaxkim
0
1.5k
Featured
See All Featured
Statistics for Hackers
jakevdp
799
220k
Being A Developer After 40
akosma
90
590k
Building Flexible Design Systems
yeseniaperezcruz
328
39k
The Art of Programming - Codeland 2020
erikaheidi
55
13k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.6k
Why Our Code Smells
bkeepers
PRO
339
57k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
910
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.1k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
520
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
1.1k
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の知識が不足していたので、良い勉強になりました。
ここまで ありがとうございました