cocos2dx videoPlayer 上显示UI界面

参考链接

• cocos creater 视频控件videoplayer动态切换到canvas下面
• cocos2d-x 3.4版本，videoPlayer和webView上添加sprite等cocos控件

---

成功版本信息

cocos2d-x-3.16

将视频切换到 canvas 的最下面

安卓 java 代码

1. 取消 videoPlayer 置顶

路径 cocos2d-x/cocos/platform/android/java/src/org/cocos2dx/lib/Cocos2dxVideoHelper.java

	private void _createVideoView(int index) {
        Cocos2dxVideoView videoView = new Cocos2dxVideoView(mActivity,index);
        sVideoViews.put(index, videoView);
        FrameLayout.LayoutParams lParams = new FrameLayout.LayoutParams(
                FrameLayout.LayoutParams.WRAP_CONTENT,
                FrameLayout.LayoutParams.WRAP_CONTENT);
        mLayout.addView(videoView, lParams);
        // 设置 video 置顶。 如果没有切换video 层级的需求 可以直接注释这句
        videoView.setZOrderOnTop(true);
        videoView.setVideoViewEventListener(videoEventListener);
    }

2. 设置渲染支持透明通道

cocos2d-x/cocos/platform/android/java/src/org/cocos2dx/lib/Cocos2dxActivity.java

    public Cocos2dxGLSurfaceView onCreateView() {
        Cocos2dxGLSurfaceView glSurfaceView = new Cocos2dxGLSurfaceView(this);
        //this line is need on some device if we specify an alpha bits
        // FIXME: is it needed? And it will cause afterimage.
        // if(this.mGLContextAttrs[3] > 0) glSurfaceView.getHolder().setFormat(PixelFormat.TRANSLUCENT);

        // use custom EGLConfigureChooser
        // Cocos2dxEGLConfigChooser chooser = new Cocos2dxEGLConfigChooser(this.mGLContextAttrs);
		// glSurfaceView.setEGLConfigChooser(chooser);

		// 设置支持透明通道
        glSurfaceView.setEGLConfigChooser(8, 8, 8, 8, 16, 8);
        glSurfaceView.getHolder().setFormat(PixelFormat.RGBA_8888);
        glSurfaceView.setZOrderMediaOverlay(true);
        
        return glSurfaceView;
    }

3. 解除原始videoPlayer 控件的点击拦击

cocos2d-x/cocos/platform/android/java/src/org/cocos2dx/lib/Cocos2dxVideoView.java

	public boolean onTouchEvent(MotionEvent event) {
        if ((event.getAction() & MotionEvent.ACTION_MASK) == MotionEvent.ACTION_UP) {
            this.sendEvent(EVENT_CLICKED);
        }
        // return true;
        return false; 		// 因为video 显示到canvas下边了。所以没必要拦截点击 
    }

---

将 Canvas 背景设置透明

设置背景 为透明，可以将最底层的videoPlayer 的播放内容显示出来setClearColor(Color4F(0,0,0,0));
cocos2d-x/cocos/base/CCDirector.cpp

// Draw the Scene
void Director::drawScene()
{
    _renderer->beginFrame();

    // calculate "global" dt
    calculateDeltaTime();
    
    if (_openGLView)
    {
        _openGLView->pollEvents();
    }

    //tick before glClear: issue #533
    if (! _paused)
    {
        _eventDispatcher->dispatchEvent(_eventBeforeUpdate);
        _scheduler->update(_deltaTime);
        _eventDispatcher->dispatchEvent(_eventAfterUpdate);
    }

	// 清楚背景 设置透明
	setClearColor(Color4F(0,0,0,0));
    _renderer->clear(ClearFlag::ALL, _clearColor, 1, 0, -10000.0);
    
    _eventDispatcher->dispatchEvent(_eventBeforeDraw);
    
    /* to avoid flickr, nextScene MUST be here: after tick and before draw.
     * FIXME: Which bug is this one. It seems that it can't be reproduced with v0.9
     */
    if (_nextScene)
    {
        setNextScene();
    }

    pushMatrix(MATRIX_STACK_TYPE::MATRIX_STACK_MODELVIEW);
    
    if (_runningScene)
    {
#if (CC_USE_PHYSICS || (CC_USE_3D_PHYSICS && CC_ENABLE_BULLET_INTEGRATION) || CC_USE_NAVMESH)
        _runningScene->stepPhysicsAndNavigation(_deltaTime);
#endif
        //clear draw stats
        _renderer->clearDrawStats();
        
        //render the scene
        if(_openGLView)
            _openGLView->renderScene(_runningScene, _renderer);
        
        _eventDispatcher->dispatchEvent(_eventAfterVisit);
    }

    // draw the notifications node
    if (_notificationNode)
    {
        _notificationNode->visit(_renderer, Mat4::IDENTITY, 0);
    }

    updateFrameRate();
    
    if (_displayStats)
    {
#if !CC_STRIP_FPS
        showStats();
#endif
    }
    
   _renderer->render();

    _eventDispatcher->dispatchEvent(_eventAfterDraw);

    popMatrix(MATRIX_STACK_TYPE::MATRIX_STACK_MODELVIEW);

    _totalFrames++;

    // swap buffers
    if (_openGLView)
    {
        _openGLView->swapBuffers();
    }
    
    _renderer->endFrame();

    if (_displayStats)
    {
#if !CC_STRIP_FPS
        calculateMPF();
#endif
    }
}

这一步，我试了很多方法都没成功，也查了很多资料，最后发现了这种方式设置可以正常显示，目前就这样吧，留个参考链接

IOS 进度条显示

默认是不显示进度条，现在需要显示出进度条，只要做下面的修改就可以显示出来了
需要修改文件位置
/frameworks/cocos2d-x/cocos/ui/UIVideoPlayer-ios.mm

VideoPlayer::VideoPlayer()
: _isPlaying(false)
, _fullScreenDirty(false)
, _fullScreenEnabled(false)
, _keepAspectRatioEnabled(false)
, _videoPlayerIndex(-1)
, _eventCallback(nullptr)
, _isLooping(false)
, _isUserInputEnabled(true) // 之前是 false 改为 true
, _styleType(StyleType::DEFAULT) // 将 StyleType::NONE 改为 StyleType::DEFAULT
{
    _videoView = [[UIVideoViewWrapperIos alloc] init:this];
    setStyle(_styleType);
        // ios 13设不设置都不影响主UIView的touchesBegan
        setUserInputEnabled(_isUserInputEnabled);


#if CC_VIDEOPLAYER_DEBUG_DRAW
    _debugDrawNode = DrawNode::create();
    addChild(_debugDrawNode);
#endif
}

修改上面两个地方就可以出现了，做下记录。。。仅供参考，根据实际情况修改！