Weex 載入 .xcassets 中的圖片資源
背景
因為 .xcassets 中的圖片資源只能通過 imageNamed:
方法載入,所以需要做一些特殊處理,才能提供給 Weex 使用(PS:純屬娛樂,因為 Weex 跨平臺的特性,這種針對某一端做實現的方案實用價值並不大)。
方案
觀察 WeexSDK 發現有 WXImgLoaderProtocol
這個協議,這個協議包含了下面的方法:
- (id<WXImageOperationProtocol>)downloadImageWithURL:(NSString *)url imageFrame:(CGRect)imageFrame userInfo:(NSDictionary *)options completed:(void(^)(UIImage *image, NSError *error, BOOL finished))completedBlock;
從名字就可以看出來,這個方法宣告的功能就是通過指定的 URL 下載圖片並返回一個 UIImage
物件。
下載過 WeexDemo 的人應該都知道里面有一個叫 WXImgLoaderDefaultImpl
的類(PS:別告訴我你對 Weex 感興趣確連 WeexDemo 裡面有啥都不知道)。這個類實現了 WXImgLoaderProtocol
協議,內容如下:
- (id<WXImageOperationProtocol>)downloadImageWithURL:(NSString *)url imageFrame:(CGRect)imageFrame userInfo:(NSDictionary *)userInfo completed:(void(^)(UIImage *image, NSError *error, BOOL finished))completedBlock
{
if ([url hasPrefix:@"//"]) {
url = [@"http:" stringByAppendingString:url];
}
return (id<WXImageOperationProtocol>)[[SDWebImageManager sharedManager] downloadImageWithURL:[NSURL URLWithString:url] options:0 progress:^(NSInteger receivedSize, NSInteger expectedSize) {
} completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, BOOL finished, NSURL *imageURL) {
if (completedBlock) {
completedBlock(image, error, finished);
}
}];
}
其實就是利用 SDWebImage
這個庫實現圖片下載功能。而且我還發現,如果不實現 WXImgLoaderProtocol
協議,就無法在 Weex 的程式碼中通過 URL 載入網路圖片。也就是說 Weex 其實是依賴原生來做網路圖片載入,至於為什麼這麼做,我只能說:我不知道。��
然後 WeexDemo 通過下面的程式碼把 WXImgLoaderDefaultImpl
註冊為 Weex 的一個 iOS 原生 handler
[WXSDKEngine registerHandler:[WXImgLoaderDefaultImpl new] withProtocol:@protocol(WXImgLoaderProtocol)];
這樣我們就可以在 Weex 中載入網路圖片了,比如:
<image class="img" style="width: 68px; height: 68px;margin-left:20px;" src="https://gw.alicdn.com/tps/TB1El.mKXXXXXXyapXXXXXXXXXX-34-34.gif"></image>
好了,現在就來說說怎麼載入 .xcassets 中的圖片資源,其實很簡單,在 WXImgLoaderDefaultImpl
實現的方法中新增幾行程式碼就可以:
if ([url hasPrefix:@"xcassets:"]) {
UIImage *image = [UIImage imageNamed:[url substringFromIndex:9]];
completedBlock(image, nil, YES);
return [WXXCassetsLoaderOperation new];
}
這裡我定義的規則是:xcassets:+[.xcassets 中的圖片名]。所以我們判斷 url
是不是以 xcassets:
開頭,如果是,通過 imageNamed
方法載入圖片並返回即可。
因為 downloadImageWithURL
方法要求返回遵循 WXImageOperationProtocol
協議的物件,所以我們新建一個 WXXCassetsLoaderOperation
類,然後實現 WXImageOperationProtocol
協議中的 cancel
方法:
- (void)cancel {
}
然後我們就可以在 Weex 中載入 .xcassets 中的圖片了。程式碼如下:
<image class="img" style="width: 300px; height: 300px;" src="xcassets:reload"></image>
相關推薦
Weex 載入 .xcassets 中的圖片資源
背景 因為 .xcassets 中的圖片資源只能通過 imageNamed: 方法載入,所以需要做一些特殊處理,才能提供給 Weex 使用(PS:純屬娛樂,因為 Weex 跨平臺的特性,這種針對某一端做實現的方案實用價值並不大)。 方案 觀察 Weex
預載入+監聽圖片資源載入製作進度條
這兩天遇到一個新需求:一個一鏡到底的h5動畫。因為功能的特殊性,就要求我們提前監聽頁面的靜態圖片是否全部載入完畢。即處理預載入。 總結下來,下次這種需求需要提前注意以下幾點: 一、圖片而不是背景圖 本來,我所用到的圖都是用背景圖製作的(因為非介面返回的圖片都要求用背景圖)。 但是監聽靜態圖片時,後
載入 Bundle 中圖片的三種方法
第一種方法 NSString *path = [[NSBundle mainBundle] pathForResource:@"myBundle" ofType:@"bundle"]; NSBun
UIWebview 載入本地html圖片資源無法正常載入的問題
今天在做webview載入本地html的時候遇到一個問題,本地html中含有圖片資源,用瀏覽器直接正常載入html,但是UIWebview在載入的時候圖片找不到,懷疑是圖片路徑問題,於是查了好多資料,
關於Android studio 中圖片資源存在 執行時卻找不到
今天碰到了一個比較無奈的 問題,圖片資源明明存在 程式碼編寫時 沒有錯誤報出。然而 當程式跑起來的時候,卻報出 android.content.res.Resources$NotFoundException: Resource ID #0x7f060062 研究好長時間,發現
weex 載入三端(android ios web) 本地圖片 解決(專案中已實踐)
本文講解內容為weex載入三端本地圖片,所寫解決方案均已驗證,使用sdk版本為0.18.0,其他版本不能保證可行。 weex載入圖片方式有三種,1.src直接引用base64編碼,2.載入網路圖片,3.載入本地圖片(三端分別放在專案目錄)。前兩種都是比較簡單直接,第三種相對初
weex載入三端本地圖片解決(專案中已實踐)
本文講解內容為weex載入三端本地圖片,所寫解決方案均已驗證,使用sdk版本為0.18.0,其他版本不能保證可行。 weex載入圖片方式有三種,1.src直接引用base64編碼,2.載入網路圖
CBitmap程式中動態載入 本地檔案上的BMP圖片資源
HBITMAP bitmap; BITMAP bm; bmBkgnd.Detach(); bitmap = (HBITMAP)::LoadImage(NULL,strPath, IMAGE_BITMAP, 0, 0, LR_CREATEDIBSECTION|LR_LOADFROMFILE|LR_D
Images.xcassets 載入圖片資源的方法
一般載入圖片資源使用的是兩種方式,一種是直接用UIImage imagedNamed 來載入。長這個樣子。 [UIImage imageNamed:imageName] 這種載入的方式是會快取圖片
cocos2dx中載入圖片資源的方法,和從記憶體中獲取已經載入的圖片資源的方法 以及釋放問題
遊戲中通常需要將常用的資源如:聲音,圖片,plist檔案,提前載入進記憶體,以加快遊戲的流暢度 1.預載入聲音: SimpleAudioEngine::getInstance()->preloadBackgroundMusic("boom.mp3"); 載入之後就可以
Java將圖片資源以二進制的形式保存到Sqlserver數據庫中
賦值 sets table date image arc 轉換成 ret ros 如何使用Java語言將圖片資源以二進制的形式保存的數據庫中 在sqlserver中創建表 use MyDb1gocreate table SaveImg(id varchar(10) pr
解壓Assets.car獲取App中的圖片資源
一個 git 源代碼 .com 技術分享 tps 生成 ets http iOS開發時圖片資源(png)是放置在Images.xcassets文件夾中進行管理的。 項目歸檔後就是ipa文件,在ipa文件中,Images.xcassets文件夾的內容放置在了Assets.ca
WWW實現圖片資源顯示以及儲存和本地載入
WWW實現圖片資源顯示以及儲存和本地載入 using UnityEngine; using System.Collections; using System.IO; using UnityEditor; enum GetPicType { DownLoad = 0, Local
iOS 如何計算圖片載入記憶體中所佔的大小
首先圖片自動縮放到2的n次方大小,例如200 * 300畫素 會變成256 * 512大小。 圖片記憶體大小的計算公式 寬度 * 高度 * bytesPerPixel/8。 bytesPerPixel : 每個畫素所佔的位元組數。 RGB顏色空間下 每個顏色分量由8位組成
Android獲取圖片資源之 拍照後在程式中顯示照片
分享一下我老師大神的人工智慧教程!零基礎,通俗易懂!http://blog.csdn.net/jiangjunshow 也歡迎大家轉載本篇文章。分享知識,造福人民,實現我們中華民族偉大復興!  
QT 中新增資源圖片
分享一下我老師大神的人工智慧教程!零基礎,通俗易懂!http://blog.csdn.net/jiangjunshow 也歡迎大家轉載本篇文章。分享知識,造福人民,實現我們中華民族偉大復興!  
網頁中圖片預載入的原理
分享一下我老師大神的人工智慧教程!零基礎,通俗易懂!http://blog.csdn.net/jiangjunshow 也歡迎大家轉載本篇文章。分享知識,造福人民,實現我們中華民族偉大復興!  
Android載入圖片資源的幾種方式
1. 圖片放在sdcard中, Bitmap imageBitmap = BitmapFactory.decodeFile(path) (path 是圖片的路徑,跟目錄是/sdcard) 2. 圖片在專案的res資料夾下面 //得到applicat
2. springboot專案載入linux中的圖片 (利用tomcat虛擬目錄) (可用)
1. springboot專案埠 8080 ( linux80埠 指向 8080, 直接ip就可訪問專案 ) 2. linux上的tomcat埠 8081 , 設定server.xml配置虛擬目錄 jia 指向 /
Android中具有動畫效果的圖片資源
在一些場景下,圖片需要具有動畫效果。當你想顯示一個由多張圖片組成的loading動畫,或者一個圖示切換過程,就需要到具有動畫效果的圖片了。Android提供了幾種方式實現動畫圖片。 下面的是個示例: 第一種方式是使用Animation Drawable,這是通過建立多張靜態