分析cocos2d-x是如何异步的去加载图片

使用cocos2d-x的人应该都知道CCTextureCache类中有个异步加载图片的方法addImageAsync，也都知道其背后的实现原理肯定是基于多线程实现的，那么其背后的具体实现逻辑具体是怎样的，所以就带着好奇心的去把它研究了下：

先看addImageAsync的实现：

void CCTextureCache::addImageAsync(const char *path, CCObject *target, SEL_CallFuncO selector){#ifdef EMSCRIPTEN//在2.2.2的版本中，不能通过脚本语言（lua和js）异步加载图片（听说qiuck-cocos2d-x实现了用脚本来异步加载图片）    CCLOGWARN("Cannot load image %s asynchronously in Emscripten builds.", path);    return;#endif // EMSCRIPTEN    CCAssert(path != NULL, "TextureCache: fileimage MUST not be NULL");//要加载的图片的路径不能为空    CCTexture2D *texture = NULL;    // optimization    std::string pathKey = path;//创建字符串pathKey做为字典查询关键字。    pathKey = CCFileUtils::sharedFileUtils()->fullPathForFilename(pathKey.c_str());//取得图片所在位置的全路径名 ，充当字典中的key    texture = (CCTexture2D*)m_pTextures->objectForKey(pathKey.c_str());//先查询一下是否字典里已经有了此纹理。    std::string fullpath = pathKey;//图片所在位置的全路径名    if (texture != NULL)//如果字典存在该纹理图片，则不需要异步加载，直接执行回调函数    {        if (target && selector)        {            (target->*selector)(texture);//执行回调，将纹理作为参数传入        }                return;    }    // lazy init    if (s_pAsyncStructQueue == NULL)//如果是第一次调用多线程载入，创建信号量并进行相应初始化。    {                     s_pAsyncStructQueue = new queue<AsyncStruct*>();//创建一个存储异步信息队列        s_pImageQueue = new queue<ImageInfo*>();        //创建一个存储图片信息队列        //线程锁初始化        pthread_mutex_init(&s_asyncStructQueueMutex, NULL);        pthread_mutex_init(&s_ImageInfoMutex, NULL);        pthread_mutex_init(&s_SleepMutex, NULL);        pthread_cond_init(&s_SleepCondition, NULL);#if (CC_TARGET_PLATFORM != CC_PLATFORM_WINRT) && (CC_TARGET_PLATFORM != CC_PLATFORM_WP8)        pthread_create(&s_loadingThread, NULL, loadImage, NULL); //创建加载线程。#endif        need_quit = false; //将退出指令设为false。    }    if (0 == s_nAsyncRefCount)//多线程加载图片的引用计数器如果为0，    {//用定时器处理异步加载图片（注意：其中的第三个参数为0，也就意味着这个定时器每帧都会被调用，也就是每帧都会调用一次addImageAsyncCallBack）        CCDirector::sharedDirector()->getScheduler()->scheduleSelector(schedule_selector(CCTextureCache::addImageAsyncCallBack), this, 0, false);    }    ++s_nAsyncRefCount;//计数器加1(这个参数是用来记录有多少个图片是准备用多线程去加载)    if (target)    {        target->retain();//保证addImageAsyncCallBack方法中的回调函数能正确执行    }    // generate async struct    AsyncStruct *data = new AsyncStruct();// 产生一个新的加载消息，放入加载消息队列中。    data->filename = fullpath.c_str();    data->target = target;    data->selector = selector;#if (CC_TARGET_PLATFORM != CC_PLATFORM_WINRT) && (CC_TARGET_PLATFORM != CC_PLATFORM_WP8)    // add async struct into queue    // 在将异步资源放入队列前需要加锁    pthread_mutex_lock(&s_asyncStructQueueMutex);    s_pAsyncStructQueue->push(data);    pthread_mutex_unlock(&s_asyncStructQueueMutex);    pthread_cond_signal(&s_SleepCondition);//发送信量号，唤醒异步加载线程#else    // WinRT uses an Async Task to load the image since the ThreadPool has a limited number of threads    //std::replace( data->filename.begin(), data->filename.end(), '/', '\\');     create_task([this, data] {        loadImageData(data);    });#endif}

这里由于涉及到几个重要的变量，所以在往下研究之前先弄明白这些变量的意思

1）存放异步加载信息的结构体，里面存放了文件名，调用者，和加载完后的回调函数

typedef struct _AsyncStruct{    std::string            filename;//文件名    CCObject    *target;//调用者    SEL_CallFuncO        selector;//加载完的回调函数} AsyncStruct;

2）存放图片信息的结构体（里面存放了异步加载所需的结构体，图片指针，图片类型）

typedef struct _ImageInfo//图片信息{    AsyncStruct *asyncStruct;//异步加载结构体    CCImage        *image;//图片指针    CCImage::EImageFormat imageType;//图片类型} ImageInfo;

3）需要用多线程加载的图片的数量：

static unsigned long s_nAsyncRefCount = 0;

4）与线程相关的四个全局静态变量

static pthread_t s_loadingThread;//加载图片的线程static pthread_mutex_ts_SleepMutex;//用于线程睡眠的线程临界区static pthread_cond_ts_SleepCondition;//用于唤醒在睡眠中的线程的条件static pthread_mutex_t      s_asyncStructQueueMutex;//用于读取异步加载信息队列的线程临界区static pthread_mutex_t      s_ImageInfoMutex;//用于处理存储图片信息结构的临界区

大概理清了上面的变量后就可以往下看addImageAsyncCallBack。当调用了addImageAsync方法后会通过定时器每帧的去调用addImageAsyncCallBack方法：

void CCTextureCache::addImageAsyncCallBack(float dt){    // the image is generated in loading thread    std::queue<ImageInfo*> *imagesQueue = s_pImageQueue;// 取得多线程加载的图片信息队列（在线程执行完加载图片后会将图片的信息结构体加入到s_pImageQueue队列中）    //下面代码作为临界区上锁    pthread_mutex_lock(&s_ImageInfoMutex);//上s_ImageInfoMutex锁    if (imagesQueue->empty())//如果图片信息队列为空直接解锁，否则进行处理    {        pthread_mutex_unlock(&s_ImageInfoMutex);    }    else    {        ImageInfo *pImageInfo = imagesQueue->front();//取出图片信息队列的头一个信息从队列中弹出。        imagesQueue->pop();//取出后从头部弹出来，也就是说先加载的图片先处理        pthread_mutex_unlock(&s_ImageInfoMutex);//解锁临界区        AsyncStruct *pAsyncStruct = pImageInfo->asyncStruct;//取得信息中的加载消息。        CCImage *pImage = pImageInfo->image;//取得图片信息中的CCImage指针。        CCObject *target = pAsyncStruct->target; //取得加载完成后要通知的对象以及要调用的函数。        SEL_CallFuncO selector = pAsyncStruct->selector;//回调函数指针        const char* filename = pAsyncStruct->filename.c_str(); //取得图片文件名        // generate texture in render thread        CCTexture2D *texture = new CCTexture2D();// 新建一个纹理。        //使用CCImage指针pImage来初始化纹理生成OpenGL贴图。#if 0 //TODO: (CC_TARGET_PLATFORM == CC_PLATFORM_IOS)        texture->initWithImage(pImage, kCCResolutioniPhone);#else        texture->initWithImage(pImage);#endif#if CC_ENABLE_CACHE_TEXTURE_DATA       // cache the texture file name       VolatileTexture::addImageTexture(texture, filename, pImageInfo->imageType);#endif        // cache the texture        m_pTextures->setObject(texture, filename);//使用文件名做为查询关键字将纹理存入字典        //这里将texture的引用计数通过内存回收池减1，最后texture的引用计数还原成1，因为上面的setObject会将texture的引用计数加1（其实这里直接调用release更好）        //（这里一定要将引用计数置为1，因为removeUnusedTextures方法与它有关，removeUnusedTextures是一个回收无用贴图的意思，调用它会将引用计数为1的纹理全部release掉，这就是这里要保持为1的原因）        texture->autorelease();        if (target && selector)//调用通知目标的相应函数。        {            (target->*selector)(texture);            target->release();//在调用addImageAsync方法时会将target retain，所以这里对应的要release下        }                pImage->release();//加载完毕释放CCImage对象。        //释放new出来的消息结构和图片信息结构。        delete pAsyncStruct;        delete pImageInfo;        --s_nAsyncRefCount;//多线程加载图片的数量减1，        if (0 == s_nAsyncRefCount)        {//当所有的需要异步加载的图片全部加载完后，从全局定时器中移除掉用于加载的图片的定时器，因为这时没有图片需要异步加载，所以定时器已经没用了            CCDirector::sharedDirector()->getScheduler()->unscheduleSelector(schedule_selector(CCTextureCache::addImageAsyncCallBack), this);        }    }}

可以看出在每帧调用addImageAsyncCallBack方法时的第一个条件便是s_pImageQueue队列要有内容，要使这个队列有内容就必须要通过线程去调用loadImage方法，这个方法会将加载完的图片信息保存到这个队列中（在初始化线程时已经启动了该线程（addImageAsync方法中）：pthread_create(&s_loadingThread, NULL, loadImage, NULL)）。

loadImage方法：

static void* loadImage(void* data){    AsyncStruct *pAsyncStruct = NULL;    while (true)//死循环    {        // create autorelease pool for iOS        CCThread thread;// 创建一个线程信息对象（这里这个对象是没有用到，估计是以后的版本会用，整个CCThread类也都是空实现）        thread.createAutoreleasePool();//空实现        std::queue<AsyncStruct*> *pQueue = s_pAsyncStructQueue;        pthread_mutex_lock(&s_asyncStructQueueMutex);//在处理异步加载信息的时候上锁        if (pQueue->empty())//如果是空队列，解锁        {            pthread_mutex_unlock(&s_asyncStructQueueMutex);//解锁            if (need_quit) {//是否退出（只有调用析构函数时这个变量才会被置为true，然后销毁线程）                break;            }            else {//如果没有退出循环，则等待addImageAsync方法调用时发送信号量，唤醒线程，节省cpu资源                pthread_cond_wait(&s_SleepCondition, &s_SleepMutex);                continue;            }        }        else        {            pAsyncStruct = pQueue->front();//从异步加载信息的结构体队列中取出第一个要处理的结构体            pQueue->pop();//第一个结构体从队列中出列            pthread_mutex_unlock(&s_asyncStructQueueMutex);//解锁            loadImageData(pAsyncStruct);//开始加载图片        }            }        if( s_pAsyncStructQueue != NULL )//当线程退出时，即被析构时清空资源    {        delete s_pAsyncStructQueue;        s_pAsyncStructQueue = NULL;        delete s_pImageQueue;        s_pImageQueue = NULL;        pthread_mutex_destroy(&s_asyncStructQueueMutex);        pthread_mutex_destroy(&s_ImageInfoMutex);        pthread_mutex_destroy(&s_SleepMutex);        pthread_cond_destroy(&s_SleepCondition);    }        return 0;}

最后便是加载图片信息的方法：

static void loadImageData(AsyncStruct *pAsyncStruct){    const char *filename = pAsyncStruct->filename.c_str();//文件名    // compute image type    CCImage::EImageFormat imageType = computeImageFormatType(pAsyncStruct->filename);//文件格式    if (imageType == CCImage::kFmtUnKnown)//不支持的格式则返回并打印信息    {        CCLOG("unsupported format %s",filename);        delete pAsyncStruct;        return;    }            // generate image                CCImage *pImage = new CCImage();//创建一个图片    if (pImage && !pImage->initWithImageFileThreadSafe(filename, imageType))//读取是否成功    {//读取失败，打印信息        CC_SAFE_RELEASE(pImage);        CCLOG("can not load %s", filename);        return;    }    // generate image info    ImageInfo *pImageInfo = new ImageInfo();//图片信息    pImageInfo->asyncStruct = pAsyncStruct;//异步结构信息（文件名，调用者，回调函数）    pImageInfo->image = pImage;//图片    pImageInfo->imageType = imageType;//图片类型    // put the image info into the queue    pthread_mutex_lock(&s_ImageInfoMutex);//上锁，防止addImageAsyncCallBack方法破坏队列    s_pImageQueue->push(pImageInfo);//将图片信息放入队列    pthread_mutex_unlock(&s_ImageInfoMutex);//解锁}

总结：

1）cocos2d-x异步加载图片时其实只启动了一个线程通过维护队列的方式去加载，而不是没加载一次图片，启动一个新线程

2）在处理两个队列s_pImageQueue和s_pAsyncStructQueue时都需要互斥，这样才能保证队列的出队和入队能有序的被处理

3）当没有图片需要异步加载时，线程要进行休眠，知道有新的图片需要异步加载，然后通过发送信号量去唤醒它