Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
コードで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
320
GraphQL 入門
tiking76
0
1.6k
みんなTCAって 知ってる?ver2.0
tiking76
1
390
みんなTCAって知ってる?
tiking76
0
1.1k
最近きてるかもって思ってるデザイン
tiking76
0
300
Swiftのちょっとうれしい構文
tiking76
0
160
p1assさんを作ろうと試みました
tiking76
0
180
PRのときに使われがちな略語のやつ
tiking76
0
160
swiftでもグラフ書いてみたくない??
tiking76
0
300
Other Decks in Programming
See All in Programming
オーケストレーション記述言語 Katari
yukikurage
0
220
コーディング自動化の次へ。人の介入をゼロにするファクトリーとサポートAIによる実践
timakin
5
5k
AI時代のTerminal環境を UNIX哲学で設計・運用する
yasunori0418
1
330
Coding with AI: How to trust the storyteller (AWS Community Day Adria, Ljubljana 2026)
slobodan
0
130
Modernizing iOS Apps
seyfoyun
0
140
graphql-ruby を Spinel で速くしようとした話
mtsmfm
0
140
TanStack Vue Query と Pinia Colada から学ぶ非同期状態の型設計
aoshi
0
580
Apple Intelligenceとオンデバイス時代の到来
yahir0
0
190
Snowflake Openflow Connector利用の勘所 / 20261024developersio2026tokyo-snowflake-openflow
kasacchiful
PRO
0
260
flutter_test のその先へ — Flutter アプリの LLM 機能に「評価」という品質保証を
kosukesaigusa
0
170
PyConTW 2026 - AI Coding 不只是工具升級, 區域醫院醫療資訊系統協作開發與資訊團隊轉型實踐
cclai999
0
220
Crash Auto Pipelines
veronikapj
1
300
Featured
See All Featured
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
230
23k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
techseoconnect
PRO
0
730
Producing Creativity
orderedlist
PRO
348
41k
Art, The Web, and Tiny UX
lynnandtonic
304
22k
brightonSEO & MeasureFest 2025 - Winning Strategies for Black Friday CRO & PPC - Christian Goodrich
cargoodrich
3
890
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.4k
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
madoxten
70
68k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
33
5.5k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
The Pragmatic Product Professional
lauravandoore
37
7.5k
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
810
First, design no harm
axbom
PRO
2
1.4k
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の知識が不足していたので、良い勉強になりました。
ここまで ありがとうございました