關(guān)于新增iOS 13 Dark Mode API的那些事语淘。。际歼。

Xcode11 設(shè)置LauchImage:(坑的很~~~蘋果這臭小子)????????惶翻,不過(guò)據(jù)說(shuō)好像2020年4月會(huì)強(qiáng)制使用LauchScreen.storyboard.


7A04FC61B8A753A1B2F2F4CE5BB74230.jpg

2020年:禁止使用uiwebview,小伙們注意了鹅心。


IMG_3090.JPG

UIViewController新增:

overrideUserInterfaceStyle

/* Set overrideUserInterfaceStyle to cause this view controller and its children to have a specific UIUserInterfaceStyle. This does not affect the application or any parent view controllers.
*/
/ *設(shè)置overrideUserInterfaceStyle以使該視圖控制器及其子控件具有特定的UIUserInterfaceStyle吕粗。 這不會(huì)影響應(yīng)用程序或任何父視圖控制器。
*/
@property (nonatomic) UIUserInterfaceStyle overrideUserInterfaceStyle ; // Defaults to UIUserInterfaceStyleUnspecified
The user interface style adopted by the view controller and all of its children.
視圖控制器及其所有子節(jié)點(diǎn)采用的用戶界面樣式旭愧。

Use this property to force the view controller to always adopt a light or dark interface style. The default value of this property is UIUserInterfaceStyleUnspecified, which causes the view controller to inherit the interface style from the system or a parent view controller. If you assign a different value, the new style applies to the view controller, its entire view hierarchy, and any embedded child view controllers.

使用此屬性可強(qiáng)制視圖控制器始終采用淺色或深色界面樣式颅筋。 此屬性的默認(rèn)值為UIUserInterfaceStyleUnspecified,這會(huì)使視圖控制器從系統(tǒng)或父視圖控制器繼承接口樣式输枯。 如果指定其他值议泵,則新樣式將應(yīng)用于視圖控制器,其整個(gè)視圖層次結(jié)構(gòu)以及任何嵌入式子視圖控制器桃熄。

該屬性為枚舉類型:
值如下:
typedef NS_ENUM(NSInteger, UIUserInterfaceStyle) {
UIUserInterfaceStyleUnspecified,
UIUserInterfaceStyleLight, ///正常模式
UIUserInterfaceStyleDark, /// 暗黑模式
} API_AVAILABLE(tvos(10.0)) API_AVAILABLE(ios(12.0)) API_UNAVAILABLE(watchOS);

UIUserInterfaceStyleUnspecified<===>Choose this option when you want to follow the system's interface style.如果要按照系統(tǒng)的界面樣式選擇此選項(xiàng)先口。

UIUserInterfaceStyleLight<===>The light interface style.iOS13之前默認(rèn)的系統(tǒng)風(fēng)格(白色的)

UIUserInterfaceStyleDark<===>The dark interface style.黑暗的界面風(fēng)格。

例如:強(qiáng)制設(shè)置當(dāng)前控制器為暗黑模式:
self.overrideUserInterfaceStyle = UIUserInterfaceStyleDark;

UIColor 中更新了若干顏色屬性對(duì)暗黑模式進(jìn)行支持;

pragma mark Foreground colors

/* Foreground colors for static text and related elements.
靜態(tài)文本和相關(guān)元素的前景顏色
*/
@property (class, nonatomic, readonly) UIColor *labelColor;
The color for text labels containing primary content.
包含主要內(nèi)容的文本標(biāo)簽的顏色碉京。

@property (class, nonatomic, readonly) UIColor *secondaryLabelColor;
The color for text labels containing secondary content.
包含輔助內(nèi)容的文本標(biāo)簽的顏色厢汹。

@property (class, nonatomic, readonly) UIColor *tertiaryLabelColor;
The color for text labels containing tertiary content.
包含第三級(jí)內(nèi)容的文本標(biāo)簽的顏色。

@property (class, nonatomic, readonly) UIColor *quaternaryLabelColor;
The color for text labels containing quaternary content.
包含四元內(nèi)容的文本標(biāo)簽的顏色谐宙。

/* Foreground color for standard system links.
*/
/ *標(biāo)準(zhǔn)系統(tǒng)鏈接的前景色烫葬。
*/
@property (class, nonatomic, readonly) UIColor *linkColor;
The color for links.
超鏈接標(biāo)簽的顏色

/* Foreground color for placeholder text in controls or text fields or text views.
*/
/ *控件或文本字段或文本視圖中占位符文本的前景色。
*/
@property (class, nonatomic, readonly) UIColor *placeholderTextColor;
The color for placeholder text in controls or text views.
控件或文本視圖中占位符文本的顏色卧惜。

/* Foreground colors for separators (thin border or divider lines).separatorColor may be partially transparent, so it can go on top of any content. opaqueSeparatorColor is intended to look similar, but is guaranteed to be opaque, so it will completely cover anything behind it. Depending on the situation, you may need one or the other.
*/
/ *分隔符的前景顏色(細(xì)邊框或分隔線)厘灼。
*separatorColor可以是部分透明的,因此它可以在任何內(nèi)容之上咽瓷。
*opaqueSeparatorColor旨在看起來(lái)相似设凹,但保證是不透明的,所以它會(huì)
*完全覆蓋它背后的任何東西茅姜。 根據(jù)具體情況闪朱,您可能需要其中一個(gè)。
*/
@property (class, nonatomic, readonly) UIColor *separatorColor;
The color for thin borders or divider lines that allows some underlying content to be visible.
細(xì)邊框或分隔線的顏色钻洒,允許一些底層內(nèi)容可見奋姿。
討論:
This color may be partially transparent to allow the underlying content to show through. It adapts to the underlying trait environment.
此顏色可以是部分透明的,以允許底層內(nèi)容顯示素标。 它適應(yīng)潛在的特質(zhì)環(huán)境称诗。

@property (class, nonatomic, readonly) UIColor *opaqueSeparatorColor;
The color for borders or divider lines that hide any underlying content.
隱藏任何基礎(chǔ)內(nèi)容的邊框或分隔線的顏色。
Discussion
This color is always opaque. It adapts to the underlying trait environment.
這種顏色總是不透明的头遭。 它適應(yīng)潛在的特質(zhì)環(huán)境寓免。

pragma mark Background colors--背景顏色

/* We provide two design systems (also known as "stacks") for structuring an iOS app's backgrounds.
Each stack has three "levels" of background colors. The first color is intended to be the
main background, farthest back. Secondary and tertiary colors are layered on top of the main background, when appropriate.
Inside of a discrete piece of UI, choose a stack, then use colors from that stack. We do not recommend mixing and matching background colors between stacks. The foreground colors above are designed to work in both stacks.1. systemBackground
Use this stack for views with standard table views, and designs which have a white primary background in light mode.*/
/ 我們提供兩個(gè)設(shè)計(jì)系統(tǒng)(也稱為“堆棧”)來(lái)構(gòu)建iOS應(yīng)用程序的背景计维。
每個(gè)堆棧有三個(gè)“級(jí)別”的背景顏色袜香。 第一種顏色是打算主要背景,最后面鲫惶。二級(jí)和三級(jí)顏色分層在頂部適當(dāng)時(shí)的主要背景蜈首。在一個(gè)獨(dú)立的UI內(nèi)部,選擇一個(gè)堆棧欠母,然后使用該堆棧中的顏色欢策。我們不建議在堆棧之間混合和匹配背景顏色。上面的前景顏色設(shè)計(jì)用于兩個(gè)堆棧赏淌。 1. systemBackground 將此堆棧用于具有標(biāo)準(zhǔn)表視圖的視圖和具有白色的設(shè)計(jì)燈光模式下的主要背景猬腰。
*/
@property (class, nonatomic, readonly) UIColor *systemBackgroundColor;
The color for the main background of your interface.
界面主背景的顏色。

@property (class, nonatomic, readonly) UIColor *secondarySystemBackgroundColor;
The color for content layered on top of the main background.
內(nèi)容的顏色分層在主背景之上猜敢。

@property (class, nonatomic, readonly) UIColor *tertiarySystemBackgroundColor;
The color for content layered on top of secondary backgrounds.
內(nèi)容的顏色分層在次要背景之上。

/* 2. systemGroupedBackground
Use this stack for views with grouped content, such as grouped tables and
platter-based designs. These are like grouped table views, but you may use these colors in places where a table view wouldn't make sense.
*/
/ * 2. systemGroupedBackground
*將此堆棧用于具有分組內(nèi)容的視圖,例如分組表和
*基于拼盤的設(shè)計(jì)缩擂。 這些類似于分組表視圖鼠冕,但您可以使用這些視圖
*表格視圖無(wú)意義的地方的顏色。
*/
@property (class, nonatomic, readonly) UIColor *systemGroupedBackgroundColor;
The color for the main background of your grouped interface.
分組界面主背景的顏色胯盯。

@property (class, nonatomic, readonly) UIColor *secondarySystemGroupedBackgroundColor;
The color for content layered on top of the main background of your grouped interface.
內(nèi)容的顏色分層在分組界面的主背景之上懈费。

@property (class, nonatomic, readonly) UIColor *tertiarySystemGroupedBackgroundColor;
The color for content layered on top of secondary backgrounds of your grouped interface.
內(nèi)容的顏色分層在分組界面的輔助背景之上。

pragma mark Fill colors填充顏色

/* Fill colors for UI elements.
These are meant to be used over the background colors, since their alpha component is less than 1.
systemFillColor is appropriate for filling thin and small shapes.
Example: The track of a slider.
*/
/ *填充UI元素的顏色博脑。
這些用于背景顏色憎乙,因?yàn)樗鼈兊腶lpha分量小于1。
systemFillColor適合填充細(xì)小形狀叉趣。
示例:滑塊的軌跡泞边。
*/
@property (class, nonatomic, readonly) UIColor *systemFillColor; An overlay fill color for thin and small shapes.
薄和小形狀的疊加填充顏色。
Discussion

Use system fill colors for items situated on top of an existing background color. System fill colors incorporate transparency to allow the background color to show through.
Use this color to fill thin or small shapes, such as the track of a slider.
對(duì)位于現(xiàn)有背景顏色頂部的項(xiàng)目使用系統(tǒng)填充顏色疗杉。 系統(tǒng)填充顏色包含透明度阵谚,以允許顯示背景顏色。
使用此顏色填充細(xì)小形狀烟具,例如滑塊的軌跡梢什。

/* secondarySystemFillColor is appropriate for filling medium-size shapes.
Example: The background of a switch.
*/
/ * secondarySystemFillColor適用于填充中等大小的形狀。
示例:開關(guān)的背景朝聋。
*/
@property (class, nonatomic, readonly) UIColor *secondarySystemFillColor;
An overlay fill color for medium-size shapes.
中等大小形狀的疊加填充顏色嗡午。
Discussion
Use system fill colors for items situated on top of an existing background color. System fill colors incorporate transparency to allow the background color to show through.
Use this color to fill medium-size shapes, such as the background of a switch.
討論
對(duì)位于現(xiàn)有背景顏色頂部的項(xiàng)目使用系統(tǒng)填充顏色。 系統(tǒng)填充顏色包含透明度冀痕,以允許顯示背景顏色荔睹。
使用此顏色填充中等大小的形狀,例如開關(guān)的背景金度。

/* tertiarySystemFillColor is appropriate for filling large shapes.
Examples: Input fields, search bars, buttons.
*/
/ * tertiarySystemFillColor適合填充大型形狀应媚。
示例:輸入字段,搜索欄猜极,按鈕中姜。
*/
@property (class, nonatomic, readonly) UIColor *tertiarySystemFillColor;
An overlay fill color for large shapes.
大型形狀的疊加填充顏色。
Discussion
Use system fill colors for items situated on top of an existing background color. System fill colors incorporate transparency to allow the background color to show through.
Use this color to fill large shapes, such as input fields, search bars, or buttons.
討論
對(duì)位于現(xiàn)有背景顏色頂部的項(xiàng)目使用系統(tǒng)填充顏色跟伏。 系統(tǒng)填充顏色包含透明度丢胚,以允許顯示背景顏色。
使用此顏色填充大型形狀受扳,例如輸入字段携龟,搜索欄或按鈕。

/* quaternarySystemFillColor is appropriate for filling large areas containing complex content.
Example: Expanded table cells.
*/
/ * quaternarySystemFillColor適用于填充包含復(fù)雜內(nèi)容的大區(qū)域勘高。
示例:擴(kuò)展的表格單元格框全。
*/
@property (class, nonatomic, readonly) UIColor *quaternarySystemFillColor;
An overlay fill color for large areas containing complex content.
包含復(fù)雜內(nèi)容的大區(qū)域的疊加填充顏色螺男。
Discussion
Use system fill colors for items situated on top of an existing background color. System fill colors incorporate transparency to allow the background color to show through.
Use this color to fill large areas that contain complex content, such as an expanded table cell.
討論:
對(duì)位于現(xiàn)有背景顏色頂部的項(xiàng)目使用系統(tǒng)填充顏色班眯。 系統(tǒng)填充顏色包含透明度,以允許顯示背景顏色仅乓。
使用此顏色填充包含復(fù)雜內(nèi)容的大區(qū)域,例如展開的表格單元格蓬戚。

如何監(jiān)聽模式變化(暗黑模式和淺色模式)

系統(tǒng)為我們提供了一個(gè)回調(diào)方法夸楣,當(dāng) light dark 切換時(shí)就會(huì)觸發(fā)這個(gè)方法。

- (void) traitCollectionDidChange: (UITraitCollection *) previousTraitCollection {
    [super traitCollectionDidChange: previousTraitCollection];
    if ((self.traitCollection.verticalSizeClass != previousTraitCollection.verticalSizeClass)
        || (self.traitCollection.horizontalSizeClass != previousTraitCollection.horizontalSizeClass)) {
        // your custom implementation here
        NSLog(@"traitCollectionDidChange");
    }
}

改變當(dāng)前模式

self.overrideUserInterfaceStyle = UIUserInterfaceStyleDark;

需要給每一個(gè) Controller 和 View 都設(shè)置一遍嗎?

答案是不需要子漩,我們先來(lái)看一張圖豫喧。


16b3ccb241c318b7.jpeg

當(dāng)我們?cè)O(shè)置一個(gè) controller 為 dark 之后,這個(gè) controller 下的 view幢泼,都會(huì)是 dark mode紧显,但是后續(xù)推出的 controller 仍然是跟隨系統(tǒng)的樣式。
因?yàn)樘O果對(duì) overrideUserInterfaceStyle 屬性的解釋是這樣的旭绒。
當(dāng)我們?cè)谝粋€(gè)普通的 controlle, view 上重寫這個(gè)屬性鸟妙,只會(huì)影響當(dāng)前的視圖,不會(huì)影響前面的 controller 和后續(xù)推出的 controller挥吵。
但是當(dāng)我們?cè)?window.rootViewController 上設(shè)置 overrideUserInterfaceStyle 的時(shí)候重父,就會(huì)影響 rootViewController 下所有的 controller, view,包括后續(xù)推出的 controller忽匈。
我們回到剛剛的問(wèn)題上房午,如果 App 打開夜間模式,那么很簡(jiǎn)單我們只需要設(shè)置 rootViewController 的 overrideUserInterfaceStyle 屬性就好了丹允。

======================================
***全局關(guān)閉黑暗模式

方式一 配置plist文件: 在Info.plist 文件中郭厌,添加一行如下
UIUserInterfaceStyle Light
======================================

Xcode 11更改了 lauchImage 設(shè)置


image.png

資料:
https://juejin.im/post/5cf6276be51d455a68490b26
WWDC2019 適配暗黑模式PPT (https://devstreaming-cdn.apple.com/videos/wwdc/2019/214iqtpuhih53fw2/214/214_implementing_dark_mode_on_ios.pdf?dl=1
https://github.com/Dongxi729/Implementing-Dark-Mode-on-iOS-PDF-
WWDC2019暗黑模式代碼(https://developer.apple.com/documentation/uikit/appearance_customization/adopting_ios_dark_mode
https://github.com/Dongxi729/AdoptingIOSDarkMode
WWDC2019
Implementing Dark Mode on iOS
https://developer.apple.com/videos/play/wwdc2019/214/
視頻流地址:(貌似需要翻墻才能看,雕蔽,折柠,):
https://devstreaming-cdn.apple.com/videos/wwdc/2019/214iqtpuhih53fw2/214/hls_vod_mvp.m3u8

其他博主好文鏈接:
https://juejin.im/post/5d8c8709e51d457806260ea9

iOS 13適配:
https://juejin.im/post/5d8af88ef265da5b6e0a23ac

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市批狐,隨后出現(xiàn)的幾起案子扇售,更是在濱河造成了極大的恐慌,老刑警劉巖嚣艇,帶你破解...
    沈念sama閱讀 222,183評(píng)論 6 516
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件承冰,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡食零,警方通過(guò)查閱死者的電腦和手機(jī)困乒,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,850評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)贰谣,“玉大人娜搂,你說(shuō)我怎么就攤上這事迁霎。” “怎么了百宇?”我有些...
    開封第一講書人閱讀 168,766評(píng)論 0 361
  • 文/不壞的土叔 我叫張陵欧引,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我恳谎,道長(zhǎng),這世上最難降的妖魔是什么憋肖? 我笑而不...
    開封第一講書人閱讀 59,854評(píng)論 1 299
  • 正文 為了忘掉前任因痛,我火速辦了婚禮,結(jié)果婚禮上岸更,老公的妹妹穿的比我還像新娘鸵膏。我一直安慰自己,他們只是感情好怎炊,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,871評(píng)論 6 398
  • 文/花漫 我一把揭開白布谭企。 她就那樣靜靜地躺著,像睡著了一般评肆。 火紅的嫁衣襯著肌膚如雪债查。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,457評(píng)論 1 311
  • 那天瓜挽,我揣著相機(jī)與錄音盹廷,去河邊找鬼。 笑死久橙,一個(gè)胖子當(dāng)著我的面吹牛俄占,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播淆衷,決...
    沈念sama閱讀 40,999評(píng)論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼缸榄,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了祝拯?” 一聲冷哼從身側(cè)響起甚带,我...
    開封第一講書人閱讀 39,914評(píng)論 0 277
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎鹿驼,沒(méi)想到半個(gè)月后欲低,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,465評(píng)論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡畜晰,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,543評(píng)論 3 342
  • 正文 我和宋清朗相戀三年砾莱,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片凄鼻。...
    茶點(diǎn)故事閱讀 40,675評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡腊瑟,死狀恐怖聚假,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情闰非,我是刑警寧澤膘格,帶...
    沈念sama閱讀 36,354評(píng)論 5 351
  • 正文 年R本政府宣布,位于F島的核電站财松,受9級(jí)特大地震影響瘪贱,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜辆毡,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,029評(píng)論 3 335
  • 文/蒙蒙 一菜秦、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧舶掖,春花似錦球昨、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,514評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至鲫售,卻和暖如春共螺,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背龟虎。 一陣腳步聲響...
    開封第一講書人閱讀 33,616評(píng)論 1 274
  • 我被黑心中介騙來(lái)泰國(guó)打工璃谨, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人鲤妥。 一個(gè)月前我還...
    沈念sama閱讀 49,091評(píng)論 3 378
  • 正文 我出身青樓佳吞,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親棉安。 傳聞我的和親對(duì)象是個(gè)殘疾皇子底扳,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,685評(píng)論 2 360

推薦閱讀更多精彩內(nèi)容

  • Swift1> Swift和OC的區(qū)別1.1> Swift沒(méi)有地址/指針的概念1.2> 泛型1.3> 類型嚴(yán)謹(jǐn) 對(duì)...
    cosWriter閱讀 11,113評(píng)論 1 32
  • 國(guó)家電網(wǎng)公司企業(yè)標(biāo)準(zhǔn)(Q/GDW)- 面向?qū)ο蟮挠秒娦畔?shù)據(jù)交換協(xié)議 - 報(bào)批稿:20170802 前言: 排版 ...
    庭說(shuō)閱讀 11,007評(píng)論 6 13
  • 問(wèn)答題47 /72 常見瀏覽器兼容性問(wèn)題與解決方案? 參考答案 (1)瀏覽器兼容問(wèn)題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 13,760評(píng)論 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5贡耽? 答:HTML5是最新的HTML標(biāo)準(zhǔn)衷模。 注意:講述HT...
    kismetajun閱讀 27,518評(píng)論 1 45
  • 總有不舍離開樹枝的葉子, 也有玩的忘記回家的孩子蒲赂, 還有永遠(yuǎn)那關(guān)不上的窗戶阱冶, 仿佛都在和我們?cè)V說(shuō): 那久遠(yuǎn)的過(guò)去,...
    蕭蕤樂(lè)園閱讀 362評(píng)論 0 4