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
Retina Mac
Search
Weizhong Yang
August 26, 2012
Technology
3
210
Retina Mac
Weizhong Yang
August 26, 2012
Tweet
Share
More Decks by Weizhong Yang
See All by Weizhong Yang
導入 Flutter 前你應該知道的事
zonble
7
1.2k
那些年,被蘋果 Ban 掉的 API
zonble
0
92
為視障朋友打造行動應用
zonble
16
1.3k
Aspect Oriented Programming
zonble
2
190
Mac OS X 與 iOS 的 Audio API
zonble
11
950
大家來寫貪食蛇
zonble
7
4.4k
Debug Debug
zonble
6
370
HTML 5 Native Drag
zonble
3
500
Other Decks in Technology
See All in Technology
初めてAWSを使うときのセキュリティ覚書〜初心者支部編〜
cmusudakeisuke
1
250
共有と分離 - Compose Multiplatform "本番導入" の設計指針
error96num
2
510
OCI Oracle Database Services新機能アップデート(2025/06-2025/08)
oracle4engineer
PRO
0
140
ブロックテーマ時代における、テーマの CSS について考える Toro_Unit / 2025.09.13 @ Shinshu WordPress Meetup
torounit
0
120
Terraformで構築する セルフサービス型データプラットフォーム / terraform-self-service-data-platform
pei0804
1
180
未経験者・初心者に贈る!40分でわかるAndroidアプリ開発の今と大事なポイント
operando
5
590
Autonomous Database - Dedicated 技術詳細 / adb-d_technical_detail_jp
oracle4engineer
PRO
4
10k
Django's GeneratedField by example - DjangoCon US 2025
pauloxnet
0
150
バイブスに「型」を!Kent Beckに学ぶ、AI時代のテスト駆動開発
amixedcolor
2
550
サラリーマンの小遣いで作るtoCサービス - Cloudflare Workersでスケールする開発戦略
shinaps
2
440
なぜテストマネージャの視点が 必要なのか? 〜 一歩先へ進むために 〜
moritamasami
0
220
Evolución del razonamiento matemático de GPT-4.1 a GPT-5 - Data Aventura Summit 2025 & VSCode DevDays
lauchacarro
0
190
Featured
See All Featured
How to train your dragon (web standard)
notwaldorf
96
6.2k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
48
9.7k
KATA
mclloyd
32
14k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Done Done
chrislema
185
16k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
580
Bash Introduction
62gerente
615
210k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
139
34k
Thoughts on Productivity
jonyablonski
70
4.8k
Six Lessons from altMBA
skipperchong
28
4k
Transcript
如何⽀支援 Mac OS X 的⾼高解析度模式 楊維中 a.k.a zonble
[email protected]
Sunday,
August 26,
萬惡的根源 Sunday, August 26,
開發環境 • MacBook Pro 2012 • 沒有新機器怎麼辦? • 使⽤用模擬環境 Sunday,
August 26,
模擬環境 Sunday, August 26,
模擬環境 Sunday, August 26,
模擬環境 Quartz Debug Sunday, August 26,
模擬環境 Sunday, August 26,
模擬環境 Sunday, August 26,
Sunday, August 26,
如何⽀支援? • 使⽤用兩倍圖檔 • 改⽤用向量圖形 Sunday, August 26,
使⽤用兩倍圖檔 • 跟 iOS ⼀一樣 • 所有⽤用到的圖⽚片 的檔名加上 @2x,然後加到 應⽤用程式中
Sunday, August 26,
使⽤用向量圖 • 向量圖檔格式很 多:Adobe Illustrator、 Corel Draw、 SVG… • Mac
OS X 系統 ⽀支援的向量格 式,簡單,就是 PDF Sunday, August 26,
Core Animation • CALayer 必須要⼿手動調整屬性,才有辦 法⽀支援 Retina Display • contents
直接給 @2x 圖⽚片是沒⽤用的 • 必須⼿手動設定 contentScale Sunday, August 26,
iOS 上⾯面 • aLayer. contentsScale = [UISCreen mainScreen].scale • 反正⼀一般來說,我們的
UI 只會出現在 mainScreen 上。雖然可以外接投影機, 使⽤用另外⼀一個 UIScreen,但是⼀一般不會 有⼈人去寫這種 App Sunday, August 26,
Mac OS X • CALayer 不⼀一定會出現在哪個 Screen 裡頭, ⽽而是要由⺫⽬目前 layer
所在的 Window 決定是否 要使⽤用⾼高解析度 • 詢問 NSWindow 的 -backingScaleFactor • Window 還可以在不同 Screen (主螢幕、延 伸螢幕)之間移動 • contentsScale 需要隨時改變 • 還有…向下相容,你應該不會只⽀支援 10.7.4 以上的系統 Sunday, August 26,
改變解析度的時機 • Layer 被放到某個 Window 的時候 • 因為 Window 移動⽽而造成
Window 的 scale 改變的時候(Notification) • 以下範例是假設 rootLayer 這個物件被擺 在某個 NSView 裡頭 Sunday, August 26,
Layer 被放到某個 Window 的時候 - (void)viewDidMoveToWindow { if ([rootLayer respondsToSelector:@selector(contentsScale)])
{ // 舊版的 OS 的 CALayer 不⼀一定會有 contentsScale // 舊版的 OS 的 Window 也不⼀一定會有 backingScaleFactor… CGFloat scale = [(id)[self window] backingScaleFactor]; [(id)rootLayer setContentsScale:scale]; } } Sunday, August 26,
訂閱 Window 移動⽽而 解析度改變的通知 • 訂閱 NSWindowDidChangeBackingPropertiesN otification • 但因為舊版系統沒有,所以直接訂閱字
串 @” NSWindowDidChangeBackingPropertiesN otification” Sunday, August 26,
訂閱 Window 移動⽽而 解析度改變的通知 • 在 viewDidMoveToWindow 訂閱 • 在
removeFromSuperview 取消 • 我們先來把剛剛那段修改 contentsScale 的程式拆出來 Sunday, August 26,
拆出來的 private method - (void)_updateContentScale { if (![self window]) {
return; } if ([rootLayer respondsToSelector:@selector(contentsScale)]) { CGFloat scale = [(id)[self window] backingScaleFactor]; [(id)rootLayer setContentsScale:scale]; } } Sunday, August 26,
訂閱通知 - (void)viewDidMoveToWindow { [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(scale DidChange:) name:@"NSWindowDidChangeBackingPropertiesNotification"
object:[self window]]; [self _updateContentScale]; } - (void)removeFromSuperview { [super removeFromSuperview]; [[NSNotificationCenter defaultCenter] removeObserver:self]; } - (void)scaleDidChange:(NSNotification *)n { [self _updateContentScale]; } Sunday, August 26,
向下相容 • ⽤用舊版的 SDK 編譯,compiler 會跟你抱 怨沒有 contentsScale 與 backingScaleFactor…
很討厭 Sunday, August 26,
為了向下相容弄出來 的⻤⿁鬼 Category… @interface NSObject (RetinaDisplay) - (void)setContentsScale:(CGFloat)inScale; - (CGFloat)backingScaleFactor;
@end Sunday, August 26,
That’a all! Sunday, August 26,