Android部分设备的高度不支持百分比

前提：我开发的应用是跨平台开发的APP应用，基于uniapp创建的项目

我直接在App.vue里面设置了公共样式
body{
height: 100%;
}

因为我的tabbar是自定义的，所以我把系统的tabbar隐藏了，然后tabbar上方我统一添加一个view来展示其它内容，用的是统一样式
.app_container_view{
width: 100%;
height: calc(100% - 100upx - (env(safe-area-inset-bottom) / 2));
display: flex;
flex-direction: column;
}

这个是我自定义tabbar组件容器的样式
.tabbar_content {
position: fixed;
width: 100%;
min-height: 100upx;
display: flex;
flex-direction: row;
justify-content: space-between;
padding: 0;
padding-bottom: calc(env(safe-area-inset-bottom) / 2);
background-color: #E7E7E7;
border-top-left-radius: 50upx;
border-top-right-radius: 50upx;
}

每个页面的布局样式是这样的
<template>
<view>
<!-- 装载其它内容的view容器 -->
<view class="app_container_view">
</view>
<!-- 自定义的tabbar组件 -->
<MyTabbar></MyTabbar>
</view>
</template>

这样每个页面在iOS展示都没有问题的，但是到了部分Android机上面，自定义的tabbar是悬浮在view容器的上面的，tabbar的位置虽然是在底部，但是容器view是变成了全屏，也就是高度是100%的了，请问这是什么原因导致的啊？需要怎么处理？麻烦告知下，谢谢！