Xamarin.Forms如何通过代码动态修改Shell TabBar的关联样式
方案1:动态资源替换(最简便,推荐新手使用)
你不需要修改原有Style的结构,只要把可变的颜色值抽成动态资源,切换时直接修改资源值即可:
- 先修改你的Shell.Resources代码,新增一个可动态切换的背景色资源:
<Shell.Resources> <ResourceDictionary> <!-- 新增这一行,默认使用你原来的Primary色 --> <Color x:Key="DynamicShellBg">{DynamicResource Primary}</Color> <Style x:Key="BaseStyle" TargetType="Element" > <Setter Property="Shell.BackgroundColor" Value="{DynamicResource DynamicShellBg}" /> <Setter Property="Shell.ForegroundColor" Value="White" /> <Setter Property="Shell.TitleColor" Value="White" /> <Setter Property="Shell.DisabledColor" Value="#B4FFFFFF" /> <Setter Property="Shell.UnselectedColor" Value="#95FFFFFF" /> <!-- 这里也换成动态资源 --> <Setter Property="Shell.TabBarBackgroundColor" Value="{DynamicResource DynamicShellBg}" /> <Setter Property="Shell.TabBarForegroundColor" Value="White"/> <Setter Property="Shell.TabBarUnselectedColor" Value="#95FFFFFF"/> <Setter Property="Shell.TabBarTitleColor" Value="White"/> </Style> <!-- 原来的GreenStyle可以删掉了,不需要了 --> <Style TargetType="TabBar" BasedOn="{StaticResource BaseStyle}" /> <Style TargetType="FlyoutItem" BasedOn="{StaticResource BaseStyle}" /> </ResourceDictionary> </Shell.Resources>
- 需要切换样式的时候,直接在代码中修改
DynamicShellBg的值即可:
// 切换为绿色 Resources["DynamicShellBg"] = Colors.Green; // 切回原来的Primary色 Resources["DynamicShellBg"] = (Color)Resources["Primary"];
方案2:显式指定TabBar的Style(完全匹配你要切换Style的需求)
如果你就是要通过切换整个Style实现,可以放弃全局隐式样式,给TabBar加名称后直接赋值Style:
- 先找到你Shell结构中定义TabBar的位置,给它加
x:Name属性:
<Shell ...> <!-- 给TabBar加名称 --> <TabBar x:Name="MainTabBar"> <!-- 你的各个Tab内容 --> <Tab .../> </TabBar> </Shell>
- 切换的时候直接给TabBar的Style属性赋值即可:
// 切换为GreenStyle MainTabBar.Style = (Style)Resources["GreenStyle"]; // 切回BaseStyle MainTabBar.Style = (Style)Resources["BaseStyle"];
注意事项
两种方案都不需要修改原来的Style逻辑,也不需要用到DynamicResource给BasedOn赋值(Xamarin.Forms确实不支持这个用法),实测都可以正常生效。
内容的提问来源于stack exchange,提问作者Michael Hunsaker
相关产品推荐
相关产品推荐

