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
980
最近きてるかもって思ってるデザイン
tiking76
0
260
Swiftのちょっとうれしい構文
tiking76
0
100
p1assさんを作ろうと試みました
tiking76
0
150
PRのときに使われがちな略語のやつ
tiking76
0
120
swiftでもグラフ書いてみたくない??
tiking76
0
240
Other Decks in Programming
See All in Programming
管你要 trace 什麼、bpftrace 用下去就對了 — COSCUP 2025
shunghsiyu
0
420
No Install CMS戦略 〜 5年先を見据えたフロントエンド開発を考える / no_install_cms
rdlabo
0
480
サイトを作ったらNFCタグキーホルダーを爆速で作れ!
yuukis
0
350
実践 Dev Containers × Claude Code
touyu
1
210
Webinar: AI-Powered Development: Transformiere deinen Workflow mit Coding Tools und MCP Servern
danielsogl
0
130
Comparing decimals in Swift Testing
417_72ki
0
170
プロダクトという一杯を作る - プロダクトチームが味の責任を持つまでの煮込み奮闘記
hiliteeternal
0
460
MCP連携で加速するAI駆動開発/mcp integration accelerates ai-driven-development
bpstudy
0
300
GUI操作LLMの最新動向: UI-TARSと関連論文紹介
kfujikawa
0
960
DockerからECSへ 〜 AWSの海に出る前に知っておきたいこと 〜
ota1022
5
1.2k
GitHub Copilotの全体像と活用のヒント AI駆動開発の最初の一歩
74th
7
2.9k
Understanding Ruby Grammar Through Conflicts
yui_knk
1
110
Featured
See All Featured
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.8k
Building Applications with DynamoDB
mza
96
6.6k
BBQ
matthewcrist
89
9.8k
Bash Introduction
62gerente
614
210k
The Cost Of JavaScript in 2023
addyosmani
53
8.8k
How STYLIGHT went responsive
nonsquared
100
5.7k
[RailsConf 2023] Rails as a piece of cake
palkan
56
5.8k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
890
A designer walks into a library…
pauljervisheath
207
24k
How to Ace a Technical Interview
jacobian
279
23k
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の知識が不足していたので、良い勉強になりました。
ここまで ありがとうございました