2***@qq.com
2***@qq.com
  • 发布:2019-07-16 09:24
  • 更新:2019-07-21 22:19
  • 阅读:1326

【报Bug】华为p9,导航栏设置为"transparent"-透明渐变,顶部会有一个白色的横条

分类:uni-app

[可重现代码片段]
可运行附件中的demo文件进行测试,问题可以重现。

页面:代码index.vue

<template>  
    <view class="content">  
        <image class="logo" src="/static/logo.png"></image>  
        <view class="text-area" style="height: 2000upx;text-align: center;">  
            <navigator url="../movie/movie">  
                <text class="title">{{title}}  

                向上滑动屏幕,上方白条会消失,每次打开又会出现  
                </text>  
            </navigator>  

        </view>  

    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                title: '点击这里'  
            }  
        },  
        onLoad() {  

        },  
        methods: {  

        }  
    }  
</script>  

<style>  
    .content {  
        display: flex;  
        flex-direction: column;  
        align-items: center;  
        justify-content: center;  
    }  

    .logo {  
        height: 200upx;  
        width: 750upx;  
        margin-top: 0upx;  
        margin-left: auto;  
        margin-right: auto;  
        margin-bottom: 50upx;  
    }  

    .text-area {  
        display: flex;  
        justify-content: center;  
    }  

    .title {  
        font-size: 36upx;  
        color: #8f8f94;  
    }  
</style>  

##pages.json  
{  
    "pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages  
        {  
            "path": "pages/index/index",  

            "style": {  
                "navigationBarTitleText": "uni-app",  
                "navigationBarBackgroundColor":"#000000",                 
                "navigationBarTextStyle":"white",  
                "app-plus": {  
                    "titleNView": {  
                        "type": "transparent",  
                        "backgroundColor":"#000000",  
                        "titleColor":"#FFFFFF",  
                        "buttons": [{  
                            "text": "分享",  
                            "fontSize": "14"  
                        }]  
                    }   
                }  
            }  
        }  
        ,{  
            "path" : "pages/movie/movie",  
            "style" : {  
                "navigationBarTitleText": "uni-app",  
                "navigationBarBackgroundColor":"#000000",                 
                "navigationBarTextStyle":"white",  
                "app-plus": {  
                    "titleNView": {  
                        "type": "transparent",  
                        "backgroundColor":"#000000",  
                        "titleColor":"#FFFFFF",  
                        "buttons": [{  
                            "text": "分享",  
                            "fontSize": "14"  
                        }]  
                    }   
                }  
            }  
        }  
    ],  
    "globalStyle": {  
        "navigationBarTextStyle": "black",  
        "navigationBarTitleText": "uni-app",  
        "navigationBarBackgroundColor": "#F8F8F8",  
        "backgroundColor": "#F8F8F8"  
    }  
}  

联系方式

[QQ]
291947725

2019-07-16 09:24 负责人:无 分享
已邀请:
2***@qq.com

2***@qq.com (作者)

自己解决了,透明渐变导航栏,"navigationBarBackgroundColor"不设置为“#000000” ,就没有白色的那个横条了。

该问题目前已经被锁定, 无法添加新回复