这是Ionic 6的答案，但它可能会帮助一些人
你可以使用Ionic的动画引擎来创建一个自定义的enterAnimation，它将首先将离子模态移动到你的用例所需要的任何dom节点下。有一个名为beforeAddWrite的钩子，专门用于在动画开始之前执行DOM操作。相关的代码看起来像这样

// rest of animation
.beforeAddWrite(() => {
    const modal = document.querySelector('ion-modal');
    const appTabs = document.querySelector('#bottomNav');
    appTabs.appendChild(modal);
  })

字符串

我不认为你试图用z-index实现的是可能的，因为ion-modal元素是附加在当前页面之外的。
您可以将背景效果分为两部分：

的数据
1.第一部分是你的浮动按钮，我假设你把它沿着在标签栏的ion-tab-button旁边。你可以添加一个background-color，颜色与模态上的颜色相匹配，并使用纯css或你正在寻找的确切形状创建一种拆卸效果。有很多例子，你可以了解更多关于here的信息。
1.第二部分是使用bottom css属性将你的modal放置在标签栏的顶部。

async showModalInsideIonTabs(): Promise<void> {
 const modal = await this.modalController.create({
   component: SomePage,
 });

 // render modal inside active tab page, so tab switch is possible 
 // with opened modal
 const activeTabPage = document.querySelector('ion-content').closest('.ion-page');
 activeTabPage.appendChild(modal);

 await modal.present();
}

字符串
参考：https://github.com/ionic-team/ionic-framework/issues/26792#issuecomment-1429319622