You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在.NET MAUI中禁用TabBar切换时的Hover效果?

问题:点击MAUI Shell底部Tab时出现短暂悬浮圆圈,无法禁用Hover效果

我尝试了多种方法隐藏/禁用Hover效果,但始终找不到触发该效果的元素。当前问题是:点击任意底部Menu Tab时会出现短暂的悬浮圆圈,严重影响UI表现。

我仍在寻找可禁用该Hover效果的UI触发器。

XAML代码:

<?xml version="1.0" encoding="UTF-8" ?>
<Shell 
    x:Class="MauiApp1.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:views="clr-namespace:MauiApp1.Views.Main"
    xmlns:auth_folder="clr-namespace:MauiApp1.Views.Auth"
    Shell.TabBarUnselectedColor="White" Shell.TabBarIsVisible="True" Shell.TabBarForegroundColor="White"
    Shell.TabBarBackgroundColor="{StaticResource PrimaryColor}" Shell.TabBarDisabledColor="{StaticResource PrimaryColor}"
    Shell.UnselectedColor="{StaticResource PrimaryColor}"
    Shell.FlyoutBehavior="Disabled"
    Shell.ForegroundColor="White" 
    Shell.BackgroundColor="{StaticResource PrimaryColor}"
    Shell.TitleColor="White"  
    Shell.NavBarHasShadow="False" >

    <Shell.Resources>
        <Style TargetType="TabBar">
            <Setter Property="Shell.TabBarBackgroundColor" Value="Blue" />
            <Setter Property="Shell.TabBarCurrentBackgroundColor" Value="Orange" /> // New API function
            <Setter Property="Shell.TabBarUnselectedColor" Value="White"/>
            <Setter Property="Shell.TabBarTitleColor" Value="White"/>
        </Style>
    </Shell.Resources>


    <ShellContent ContentTemplate="{DataTemplate auth_folder:GetStarted}" Route="GetStarted"/>
    <ShellContent ContentTemplate="{DataTemplate auth_folder:LoginForm}" Route="LoginForm"/>

    <TabBar>
        
        <Tab Icon="b_home.png">
            <ShellContent  ContentTemplate="{DataTemplate views:Home}" Route="Home" PropertyChanged="ShellContent_PropertyChanged"
                           Icon="{OnPlatform 'b_home.png', iOS='b_home.png' }" />
        </Tab>

        <Tab Icon="b_persona.png">
            <ShellContent ContentTemplate="{DataTemplate views:Profile}" Route="About" PropertyChanged="ShellContent_PropertyChanged"
            Icon="{OnPlatform 'b_persona.png', iOS='b_persona.png'}" />
        </Tab>
   
        <Tab Icon="b_tel.png">
            <ShellContent ContentTemplate="{DataTemplate views:Red365}" Route="Red365" PropertyChanged="ShellContent_PropertyChanged"
            Icon="{OnPlatform 'b_tel.png', iOS='b_tel.png'}" />
        </Tab>
    </TabBar>
</Shell>

效果说明:

  • 异常状态:点击Tab时,目标图标周围会弹出一个短暂的白色悬浮圆圈,干扰正常UI展示
  • 正常状态:底部TabBar为蓝色背景,包含三个图标(首页、个人中心、联系入口),未触发点击时显示正常

内容的提问来源于stack exchange,提问作者Ibrahim El Aidi

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.23 09:23:14