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
160
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
コードでUI構築してみた
以前LTで登壇した内容です
tiking
October 02, 2020
More Decks by tiking
See All by tiking
デザインシステムっていいな
tiking76
0
300
GraphQL 入門
tiking76
0
1.6k
みんなTCAって 知ってる?ver2.0
tiking76
1
380
みんなTCAって知ってる?
tiking76
0
1.1k
最近きてるかもって思ってるデザイン
tiking76
0
300
Swiftのちょっとうれしい構文
tiking76
0
150
p1assさんを作ろうと試みました
tiking76
0
180
PRのときに使われがちな略語のやつ
tiking76
0
150
swiftでもグラフ書いてみたくない??
tiking76
0
290
Other Decks in Programming
See All in Programming
ハーネス設計入門 〜プロンプト、コンテキストの次〜
kinopeee
53
35k
Can LLMs Replicate 4 Years of Compose Migration? Exploring the boundaries of automation with 279 XML files from a real product
makun
0
130
20260828_品質と開発生産性を両立させる、AI時代のE2Eテストの考え方
magicpod
0
130
AIに既存システムを理解させる技術 ~レガシーを見捨てないハーネスエンジニアリング入門~
ochtum
0
200
MySQLとPostgreSQLって何が違うの?
akagami
PRO
0
160
kubernetes コンポーネント開発入門 / 新卒N年目の勉強会&交流会!〜〇〇への誘い〜 #n_study
mazrean
0
160
Flow は今どうなっているか
mizdra
PRO
0
890
go-spidermonkeyでAIエージェントのCode Modeを実装する
syumai
3
1.5k
XP祭りでしか伝わらないフリップネタ #xpjug
murabayashi
0
110
新卒PdEのリアル
ryu1013
1
300
typoなんかねぇよ
raspython3
0
660
業務時間外もAIに働いてもらう話
colorful12
3
9.9k
Featured
See All Featured
A designer walks into a library…
pauljervisheath
211
25k
Side Projects
sachag
455
43k
Stop Working from a Prison Cell
hatefulcrawdad
274
21k
So, you think you're a good person
axbom
PRO
2
2.1k
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
1
300
The Director’s Chair: Orchestrating AI for Truly Effective Learning
tmiket
1
290
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1.3k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
680
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
sarafernandez
2
1.6k
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
460
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
cargoodrich
3
800
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の知識が不足していたので、良い勉強になりました。
ここまで ありがとうございました