公告列表
公告列表
收藏
回答

coverview无法覆盖canvas?


return (
    <View className="panel">
        <View className="panel-background">
            <Canvas
                type="2d"
                className="panel-background-canvas"
                style="z-index:-10"
                ref={(node) => { this.canvasNode = node }}
                id="myCanvas"
            >
                <CoverView className="panel-background-gray" ref={canvasRef}>
                </CoverView>
            </Canvas>
             
        </View>
    </View>

)



.panel {
    width: 520px;
    height: 520px;
    margin: 0 auto;
    margin-top: 40px;
    position: relative;
    
    &-background {
        height: 100%;
        position: relative;
        background-size: 100% 100%;
        &-canvas{
            top: 0;
            left: 0;
            position: absolute;
            display: block !important;
            width: 480px;
            height: 480px;
            z-index: -1;
        }
        &-gray {
            top: 0;
            left: 0;
            position: absolute;
            margin: 20px;
            width: 480px;
            height: 480px;
            z-index: 1;
            border-radius: 50%;
            background: blue;
        }
    }
}

"libVersion": "2.9.3",
如上结构

在开发工具上显示如下


效果如图 红色为canvas绘制 蓝色是CoverView 的背景


最后一次编辑于  2019-12-12
回答关注问题邀请回答
收藏

4 个回答

  • Cailven
    Cailven
    2020-04-17

    以手机为主，开发者工具一直有这个bug

    2020-04-17
    有用
    回复
  • 灵芝
    灵芝
    2019-12-12

    2d 接口 v2.9.0 起支持同层渲染，可以直接使用view

    2019-12-12
    有用
    回复 2
  • 土家肸哥
    土家肸哥
    2019-12-12

    z-index是有基础课限制的，你这没有样式鬼知道啥情况啊

    2019-12-12
    有用
    回复 1
    • 2019-12-12
      z-index 有什么限制啊 我把样式加上了
      不是时候 coverview会在canvas上面绘制嘛 我也是刚写不太懂
      大佬 在看一下
      2019-12-12
      赞
      回复
  • 2019-12-12

    z-index 不生效 coverview 也不生效

    2019-12-12
    有用
    回复
请 登录 后发表内容
相关文档
问题标签
绘制canvas开发工具