iOS 暗黑模式的適配總結

iOS DarkMode Adapter

​ 就在上個月,國內的自媒體就開始瘋傳蘋果要求開發者適配暗黑模式,而且還有謠言說,蘋果通知微信強制適配暗黑模式,次日微信的官方團隊就宣佈暗黑模式已經適配而且在下一個版本中就能夠見到了。果真沒有過多久就真的體驗到了廣大羣衆千呼萬喚的暗黑模式,可是做爲一個iOS使用者,我並無以爲微信的暗黑模式有多好用,甚至以爲有的時候還會給我帶來一些麻煩,最好能在微信中作一個開關,讓用戶本身選擇顯示 什麼模式。可是後來一想,若是這樣作了那是否是就和好幾年前很流行的那種主題功能很相似了......感受在鬼打牆.......ios

我做爲一個低端的iOS開發者,當iOS13 出來時候,咱們第一時間也沒有選擇適配,咱們選擇的是一種簡單快捷的方案,全局關閉暗黑模式。只要作以下操做:objective-c

1.在Info.plist 文件中,添加UIUserInterfaceStyle key 名字爲 User Interface Style 值爲String,微信

2.將UIUserInterfaceStyle key 的值設置爲 Lightide

這樣大家就會看到界面就和以前同樣了,可是還有一個很細微的地方要處理,那就是狀態欄的樣子並不受上面添加的值影響,因此咱們還要對狀態欄作適配函數

if (@available(iOS 13.0, *)) {
    [UIApplication sharedApplication].statusBarStyle =UIStatusBarStyleDarkContent;  }else{
    [UIApplication sharedApplication].statusBarStyle = UIStatusBarStyleDefault;
}
複製代碼

DarkMode 文字的顏色

​ 在測試的時候我發現,但咱們用UILabel顯示文字的時候,只要不去設置顏色,系統會自動的經過現實的模式自動的調節顏色。可是在實際的開發中,咱們並不可能一直都用一個顏色,並且 也不可能都是和白色的。測試

​ 那麼咱們就來看看要怎麼作到經過切換顯示模式自動的切換文字的顏色呢?spa

​ 當你想到這個問題的時候,蘋果都已經幫你解決了。在iOS13的SDK中喲這麼一個函數設計

+ (UIColor *)colorWithDynamicProvider:(UIColor * (^)(UITraitCollection *traitCollection))dynamicProvider API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchos);
複製代碼

​ 這是一個動態顏色的設置,那麼咱們只要寫一個UIColor的Category 就行了,統計一下咱們的項目中都用到了什麼樣的顏色,這個時候也要UI設計師給你設計一下在暗黑模式下,各個文字對應的顏色是什麼。這樣咱們就能夠完成了對文字顏色的適配,其實後來我發現 不僅是文字,只要是涉及到顏色的地方均可以這麼處理。code

​ 下面是我簡單的寫了幾個顏色,僅供參考:圖片

#import <UIKit/UIKit.h>

NS_ASSUME_NONNULL_BEGIN

@interface UIColor (DarkMode)

+ (UIColor *)textColor;

+ (UIColor *)viewControllerBackGroundColor;

@end

NS_ASSUME_NONNULL_END
複製代碼
#import "UIColor+DarkMode.h"

@implementation UIColor (DarkMode)
+ (UIColor *)colorWithHex:(UInt32)hex andAlpha:(CGFloat)alpha {
    int r = (hex >> 16) & 0xFF;
    int g = (hex >> 8) & 0xFF;
    int b = (hex)&0xFF;

    return [UIColor colorWithRed:r / 255.0f green:g / 255.0f blue:b / 255.0f alpha:alpha];
}
+ (UIColor *)textColor{
    if (@available(iOS 13.0, *)) {
          return [UIColor colorWithDynamicProvider:^UIColor * _Nonnull(UITraitCollection * _Nonnull trait) {
             if (trait.userInterfaceStyle == UIUserInterfaceStyleDark) {
                 return [UIColor whiteColor];
             } else {
                 return [UIColor blackColor];
             }
          }];;
      }else{
         return [UIColor blackColor];
      }
}

+ (UIColor *)viewControllerBackGroundColor{
    if (@available(iOS 13.0, *)) {
          return [UIColor colorWithDynamicProvider:^UIColor * _Nonnull(UITraitCollection * _Nonnull trait) {
             if (trait.userInterfaceStyle == UIUserInterfaceStyleDark) {
                 return [UIColor blackColor];
             } else {
                 return [UIColor whiteColor];
             }
          }];;
      }else{
         return [UIColor whiteColor];
      }
}
@end
複製代碼

DarkMode Image Assets

上面說完了顏色的適配,下面就要來講一下還有圖片的適配:

1.建立一個Assets文件(或在現有的Assets文件中)

2.新建一個圖片資源文件(或者顏色資源文件、或者其餘資源文件)

3.選中該資源文件, 打開 Xcode ->View ->Inspectors ->Show Attributes Inspectors (或者Option+Command+4)視圖,將Apperances 選項 改成Any,Dark

4.執行完第三步,資源文件將會有多個容器框,分別爲 Any ApperanceDark Apperance. Any Apperance 應用於默認狀況(Unspecified)與高亮狀況(Light), Dark Apperance 應用於暗黑模式(Dark)

5.代碼默認執行時,就能夠正常經過名字使用了,系統會根據當前模式自動獲取對應的資源文件

相關文章
相關標籤/搜索