<span id="mktg5"></span>

<i id="mktg5"><meter id="mktg5"></meter></i>

        <label id="mktg5"><meter id="mktg5"></meter></label>
        最新文章專(zhuān)題視頻專(zhuān)題問(wèn)答1問(wèn)答10問(wèn)答100問(wèn)答1000問(wèn)答2000關(guān)鍵字專(zhuān)題1關(guān)鍵字專(zhuān)題50關(guān)鍵字專(zhuān)題500關(guān)鍵字專(zhuān)題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關(guān)鍵字專(zhuān)題關(guān)鍵字專(zhuān)題tag2tag3文章專(zhuān)題文章專(zhuān)題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專(zhuān)題3
        問(wèn)答文章1 問(wèn)答文章501 問(wèn)答文章1001 問(wèn)答文章1501 問(wèn)答文章2001 問(wèn)答文章2501 問(wèn)答文章3001 問(wèn)答文章3501 問(wèn)答文章4001 問(wèn)答文章4501 問(wèn)答文章5001 問(wèn)答文章5501 問(wèn)答文章6001 問(wèn)答文章6501 問(wèn)答文章7001 問(wèn)答文章7501 問(wèn)答文章8001 問(wèn)答文章8501 問(wèn)答文章9001 問(wèn)答文章9501
        當(dāng)前位置: 首頁(yè) - 科技 - 知識(shí)百科 - 正文

        React Native如何消除啟動(dòng)時(shí)白屏的方法

        來(lái)源:懂視網(wǎng) 責(zé)編:小采 時(shí)間:2020-11-27 22:33:17
        文檔

        React Native如何消除啟動(dòng)時(shí)白屏的方法

        React Native如何消除啟動(dòng)時(shí)白屏的方法:在RN 項(xiàng)目啟動(dòng)之后有一個(gè)短暫的白屏,調(diào)試階段白屏的時(shí)間較長(zhǎng),大概3-5秒,打正式包后這個(gè)白屏?xí)r間會(huì)大大縮短,大多時(shí)候都是一閃而過(guò),所以稱(chēng)之為閃白。 其實(shí)解決的方案也有很多,這里做一個(gè)簡(jiǎn)單的總結(jié)。 白屏的原因 在iOS App 中有 啟動(dòng)圖(Lau
        推薦度:
        導(dǎo)讀React Native如何消除啟動(dòng)時(shí)白屏的方法:在RN 項(xiàng)目啟動(dòng)之后有一個(gè)短暫的白屏,調(diào)試階段白屏的時(shí)間較長(zhǎng),大概3-5秒,打正式包后這個(gè)白屏?xí)r間會(huì)大大縮短,大多時(shí)候都是一閃而過(guò),所以稱(chēng)之為閃白。 其實(shí)解決的方案也有很多,這里做一個(gè)簡(jiǎn)單的總結(jié)。 白屏的原因 在iOS App 中有 啟動(dòng)圖(Lau

        在RN 項(xiàng)目啟動(dòng)之后有一個(gè)短暫的白屏,調(diào)試階段白屏的時(shí)間較長(zhǎng),大概3-5秒,打正式包后這個(gè)白屏?xí)r間會(huì)大大縮短,大多時(shí)候都是一閃而過(guò),所以稱(chēng)之為“閃白”。

        這里寫(xiě)圖片描述

        這里寫(xiě)圖片描述

        其實(shí)解決的方案也有很多,這里做一個(gè)簡(jiǎn)單的總結(jié)。

        白屏的原因

        在iOS App 中有 啟動(dòng)圖(LaunchImage),啟動(dòng)圖結(jié)束后才會(huì)出現(xiàn)上述的閃白,這個(gè)過(guò)程是 js 解釋的過(guò)程,JS 解釋完畢之前沒(méi)有內(nèi)容,所以才表現(xiàn)出白屏,那么解決的方法就是在啟動(dòng)圖結(jié)束后,JS 解釋完成前做一些簡(jiǎn)單的處理。

        解決的常見(jiàn)方案:

      1. 啟動(dòng)圖結(jié)束后通過(guò)原生代碼加載一張全屏占位圖片,跟啟動(dòng)圖一樣的圖片,混淆視聽(tīng)“欺騙用戶(hù)”。
      2. JS解釋完畢后通知原生可以移除占位圖
      3. 收到 JS 發(fā)來(lái)的可以移除占位圖的通知,移除占位圖
      4. 代碼實(shí)現(xiàn)

        新建一個(gè)SplashScreen 文件用來(lái)接收 JS 發(fā)來(lái)的”移除占位圖”的消息。相關(guān)代碼如下:

        SplashScreen.h

        #import <Foundation/Foundation.h>
         #import "RCTBridgeModule.h"
         @interface SplashScreen : NSObject<RCTBridgeModule>
        
         @end
        

        SplashScreen.m

        #import "SplashScreen.h"
         @implementation SplashScreen
        
         RCT_EXPORT_MODULE();
        
         RCT_EXPORT_METHOD(close){
         [[NSNotificationCenter defaultCenter] postNotificationName:@"Notification_CLOSE_SPLASH_SCREEN" object:nil];
         }
         @end
        

        在AppDelegate.m 加入以下代碼:

        @interface AppDelegate ()
         {
         UIImageView *splashImage;
         }
         @end
        
         @implementation AppDelegate
        
         - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
         {
         [[NSNotificationCenter defaultCenter]addObserver:self selector:@selector(closeSplashImage) name:"Notification_CLOSE_SPLASH_SCREEN" object:nil];
        
         ...
         [self autoSplashScreen];//寫(xiě)在 return YES 之前,其他代碼之后
         return YES;
         }
         -(void)autoSplashScreen {
         if (!splashImage) {
         splashImage = [[UIImageView alloc]initWithFrame:[UIScreen mainScreen].bounds];
         }
         if (IPHONESCREEN3p5) {
         [splashImage setImage:[UIImage imageNamed:@"launch4"]];
         }else if (IPHONESCREEN4){
         [splashImage setImage:[UIImage imageNamed:@"launch5"]];
         }else if (IPHONESCREEN4p7){
         [splashImage setImage:[UIImage imageNamed:@"launch6"]];
         }else if (IPHONESCREEN5p5){
         [splashImage setImage:[UIImage imageNamed:@"launch7"]];
         }
         [self.window addSubview:splashImage];
         }
         -(void)closeSplashImage {
         dispatch_sync(dispatch_get_main_queue(), ^{
         [UIView animateWithDuration:0.5 animations:^{
         splashImage.alpha = 0;
         } completion:^(BOOL finished){
         [splashImage removeFromSuperview];
         }];
         });
         }
        
        

        在合適的時(shí)機(jī)選擇移除占位圖。js端代碼:

        if (Platform.OS === 'ios') {
         NativeModules.SplashScreen.close();
         };
        

         更加詳細(xì)的信息可以訪問(wèn):https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.zh.md

        聲明:本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

        文檔

        React Native如何消除啟動(dòng)時(shí)白屏的方法

        React Native如何消除啟動(dòng)時(shí)白屏的方法:在RN 項(xiàng)目啟動(dòng)之后有一個(gè)短暫的白屏,調(diào)試階段白屏的時(shí)間較長(zhǎng),大概3-5秒,打正式包后這個(gè)白屏?xí)r間會(huì)大大縮短,大多時(shí)候都是一閃而過(guò),所以稱(chēng)之為閃白。 其實(shí)解決的方案也有很多,這里做一個(gè)簡(jiǎn)單的總結(jié)。 白屏的原因 在iOS App 中有 啟動(dòng)圖(Lau
        推薦度:
        標(biāo)簽: 白屏 方法 啟動(dòng)
        • 熱門(mén)焦點(diǎn)

        最新推薦

        猜你喜歡

        熱門(mén)推薦

        專(zhuān)題
        Top
        主站蜘蛛池模板: 午夜电影免费观看| 久久免费的精品国产V∧| 成人午夜大片免费7777| 亚洲AV无码久久久久网站蜜桃| **aaaaa毛片免费同男同女| 久久久久亚洲AV无码网站| 99久久99这里只有免费的精品| 亚洲综合色婷婷七月丁香| 中文日本免费高清| 久久精品国产亚洲| 91香焦国产线观看看免费| 亚洲免费视频网址| 国产猛烈高潮尖叫视频免费| 爱情岛论坛免费视频| 国产亚洲情侣一区二区无| 久久免费区一区二区三波多野| 亚洲日本国产精华液| 免费毛片在线看片免费丝瓜视频 | 国产精品网站在线观看免费传媒| 亚洲成AV人片在| 男女做羞羞的事视频免费观看无遮挡| 亚洲人成网站日本片| 国产成人免费片在线视频观看| 美女被羞羞网站免费下载| 香蕉蕉亚亚洲aav综合| 91香蕉视频免费| 搜日本一区二区三区免费高清视频| 久久久久亚洲AV成人网| 亚洲成人免费网站| 理论片在线观看免费| 久久久久亚洲精品无码系列| 性色av免费观看| 九九99热免费最新版| 亚洲人成毛片线播放| 亚洲一区视频在线播放| 99久久久国产精品免费蜜臀| 亚洲av乱码一区二区三区按摩 | 亚洲综合精品网站| 182tv免费视视频线路一二三| 亚洲精品成a人在线观看☆| 国产精品亚洲片在线观看不卡 |