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
SFSymbolsの楽しみ方
Search
Lil Ossa リルオッサ
January 15, 2022
Programming
0
120
SFSymbolsの楽しみ方
SFSymbolsの説明と、見つけてしまったSFSymbolsの楽しみ方をお伝えします。
Lil Ossa リルオッサ
January 15, 2022
Tweet
Share
More Decks by Lil Ossa リルオッサ
See All by Lil Ossa リルオッサ
The Widget Revolution
littleossa
1
60
Other Decks in Programming
See All in Programming
Result型で“失敗”を型にするPHPコードの書き方
kajitack
4
380
WindowInsetsだってテストしたい
ryunen344
1
190
GitHub Copilot and GitHub Codespaces Hands-on
ymd65536
1
120
Deep Dive into ~/.claude/projects
hiragram
8
1.5k
ニーリーにおけるプロダクトエンジニア
nealle
0
490
なんとなくわかった気になるブロックテーマ入門/contents.nagoya 2025 6.28
chiilog
1
210
「ElixirでIoT!!」のこれまでとこれから
takasehideki
0
370
Haskell でアルゴリズムを抽象化する / 関数型言語で競技プログラミング
naoya
17
4.9k
プロダクト志向なエンジニアがもう一歩先の価値を目指すために意識したこと
nealle
0
110
Railsアプリケーションと パフォーマンスチューニング ー 秒間5万リクエストの モバイルオーダーシステムを支える事例 ー Rubyセミナー 大阪
falcon8823
4
950
Gleamという選択肢
comamoca
6
760
datadog dash 2025 LLM observability for reliability and stability
ivry_presentationmaterials
0
110
Featured
See All Featured
Into the Great Unknown - MozCon
thekraken
39
1.9k
Java REST API Framework Comparison - PWX 2021
mraible
31
8.6k
4 Signs Your Business is Dying
shpigford
184
22k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Statistics for Hackers
jakevdp
799
220k
GraphQLの誤解/rethinking-graphql
sonatard
71
11k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.4k
Balancing Empowerment & Direction
lara
1
370
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
930
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
Transcript
SFSymbolsͷָ͠Έํ 2022/1/15 ϦϧΦοα
ࣗݾհ Name: ϦϧΦοα note: littleossa Github: littleossa Twitter: @littleossa 2
SFSymbolsΛָ͠ΜͰ͍·͔͢ʁ
SFSymbolsͱ
SFSymbolsͱ • Apple͕ఏڙ͍ͯ͠ΔγϯϘϧϑΥϯτ • SFSymbols3.2࣌Ͱɺ3309ݸͷγϯϘϧΛఏڙ͍ͯ͠·͢ • ͜ΕΒΛΤΫεϙʔτޙɺϕΫλʔάϥϑΟοΫฤूπʔϧͰฤू͠ ͯΧελϜγϯϘϧΛ࡞Ͱ͖Δ • SFͱɺAppleͷఏڙ͍ͯ͠ΔSan
Franciscoͱ͍͏ϑΥϯτͷ͜ͱΛ ࢦ͍ͯ͠Δ
SFSymbolsͷԸܙ • Apple͕ެࣜͰ༻͍ͯ͠Δߴ࣭ͷΞΠί ϯΛಉ͡Α͏ʹ༻Ͱ͖Δ • ݸਓ։ൃऀ͕ΞΠίϯ࡞ʹϦιʔεΛׂ͔ ͳͯ͘ྑ͍ • ༷ʑͳ༻్͚ͷγϯϘϧ͕༻ҙ͞Ε͓ͯ Γɺ͔Ώ͍ͱ͜Ζʹख͕ಧ͘
ϝϞApp
ͲͷΑ͏ͳγϯϘϧ͕͋Δͷ͔
ͲͷΑ͏ͳγϯϘϧ͕͋Δͷ͔ ࣮ࡍʹΞϓϦͷΞΠίϯͱͯ͑ͦ͠͏ͳͷ͔Β ʮ͜Μͳͷ·Ͱ͋ΔΜͩʂʯ ʮ͜ΕҰମ͍ͭ͏Μͩʁʯ ͱ͍͏ͷ·Ͱ ຊʹόϥΤςΟ๛Ͱ SFSymbolsͷΧλϩάΛݟΔ͚ͩͰָ͍͠Ͱ͢
͜Μͳͷ·Ͱ͋ΔΜͩʂ
͜ΕҰମ͍ͭ͏ΜͩϥϯΩϯάୈ3Ґ ※100%ݸਓతͳओ؍Ͱ͢ ҨӨ
͜ΕҰମ͍ͭ͏ΜͩϥϯΩϯάୈ2Ґ ※100%ݸਓతͳओ؍Ͱ͢ ંΓΈܞଳ
͜ΕҰମ͍ͭ͏ΜͩϥϯΩϯάୈ1Ґ ※100%ݸਓతͳओ؍Ͱ͢ Έͦ
SFSymbols͕ؾʹͳͬͨํ ࠓ͙͢Πϯετʔϧʂ
SFSymbolsͷΠϯετʔϧ ํ๏ https://developer.apple.com/sf-symbols/ 1. ͜ͷαΠτʹΞΫηε 2. Լ෦ͷμϯϩʔυ͔Βμϯ ϩʔυͯ͠Πϯετʔϧ͢Δ͚ͩ
࣮ࡍʹ͏
Imageͱͯ͠γϯϘϧΛ͏ 1. StoryboardʹImageViewΛՃ 2. ImageͷϑΥʔϜʹԿ͔จࣈΛೖ ྗ 3. SystemͷImageͱͯ͠γϯϘϧ͕ දࣔ͞ΕΔ ※
OSʹґଘ͢Δͷଟ͘ɺ༻ग़དྷͳ͍߹ܯࠂ͕ग़Δ
Imageͱͯ͠γϯϘϧΛ͏ ίʔυ͔Β༻͢Δ͜ͱͰ͖·͢ɻ let image = UIImage(systemName:"person.crop.artframe") systemNameSFSymbolsͷγϯϘϧͷ໊લͰɺӈΫϦοΫͰ໊લͷ ίϐʔΛબ͢Δ͜ͱ͕ग़དྷ·͢ɻ ※ ίʔυ͔Β༻͢Δ߹ɺOSґଘʹΑΓ༻ग़དྷͳ͍߹ͷܯࠂग़ͳ͍ͷͰҙ͕ඞཁͰ͢
scaleͱweightઃఆͰ͖Δ let configuration = UIImage.SymbolConfiguration(pointSize: UIFont.systemFontSize, weight: .medium, scale: .large)
let image = UIImage(systemName: "square.and.arrow.up", withConfiguration: configuration) Storyboard ίʔυ
iOS15͔Β͑ΔSFSymbolsʹ ෳͷΧϥʔΛઃఆ͢Δํ๏
iOS15ະຬͰͷΧϥʔઃఆํ๏ let image = UIImage(systemName: "face.smiling.fill") imageView.image = image systemeͷImageΛೖ͢Δ͚ͩͰɺ
σϑΥϧτΧϥʔͷ1৭͚ͩͰ০͞Ε͍ͯ·͢ ͋Δ͍ɺ imageView.tintColor = .tintColor
ύϨοτΧϥʔΛઃఆ͢Δ let image = UIImage(systemName: "face.smiling.fill") let configuration = UIImage.SymbolConfiguration(paletteColors:
[.black, .systemYellow]) imageView.image = image imageView.preferredSymbolConfiguration = configuration iOS15͔Β༻Ͱ͖Δ UIImage.SymbolCon fi guration.init(paletteColors:)Ͱ SymbolCon fi gurationΛੜͯ͠ઃఆ͢Δ͜ͱͰγϯϘϧͷΠϝʔδ ʹෳͷΧϥʔΛׂΓͯΔ͜ͱ͕ग़དྷ·͢
֊ΧϥʔΛઃఆ͢Δ iOS15͔Β༻Ͱ͖Δ UIImage.SymbolCon fi guration.init(hierarchicalColor:) ͰSymbolCon fi gurationΛੜͯ͠ઃఆ͢Δ͜ͱͰࢦఆͨ͠جຊ৭ͷ ڧΛԼ͛ͨ৭ͷΛଞͷ֊ͷϨΠϠʔͷׂΓͯ·͢ɻ let
image = UIImage(systemName: "trash.slash") let configuration = UIImage.SymbolConfiguration(hierarchicalColor: .systemMint) imageView.preferredSymbolConfiguration = configuration imageView.image = image
ϚϧνΧϥʔΛઃఆ͢Δ iOS15͔Β༻Ͱ͖Δ UIImage.SymbolCon fi guration.preferringMulticolorϝιουΛ༻ ͢ΔͱɺγϯϘϧ͕ϚϧνΧϥʔόϦΞϯτΛ͍࣋ͬͯΔ߹ ͦͷΧϥʔׂ͕ΓͯΒΕ·͢ let image =
UIImage(systemName: "ladybug.fill") imageView.preferredSymbolConfiguration = UIImage.SymbolConfiguration.preferringMulticolor() imageView.tintColor = .brown imageView.image = image
SFSymbolsͷਅͷָ͠Έํ
Title: DJ શͯSFSymbolsͷΈͰ࡞͠·ͨ͠ɻ
ਪ͠ͷSFSymbolsΛݟ͚ͭͯɺ ָ͠ΜͰ͍ͩ͘͞
None