如何在.Net MAUI中更改ContentPresenter中文本的颜色。

huangapple
go评论198阅读模式
英文:

How to change the color of Text of ContentPresenter in .Net MAUI

问题

我在我的应用程序中使用了自定义样式的单选按钮，其中使用ContentPresenter来显示文本/内容。我想要更改文本的颜色。

我尝试过TextColor和TextBlock.Foreground，但它们没有解决这个问题。

这是我的代码示例：

  1. <ControlTemplate x:Key="RadioButtonTemplate">
  2.     <Border Stroke="Transparent" BackgroundColor="Transparent">
  3.         <VisualStateManager.VisualStateGroups>
  4.             <VisualStateGroupList>
  5.                 <VisualStateGroup x:Name="CheckedStates">
  6.                     <VisualState x:Name="Checked">
  7.                         <VisualState.Setters>
  8.                             <Setter TargetName="check" Property="Opacity" Value="1" />
  9.                             <Setter TargetName="check_circle" Property="Opacity" Value="1" />
  10.                             <Setter TargetName="border_circle" Property="Opacity" Value="0" />
  11.                         </VisualState.Setters>
  12.                     </VisualState>
  13.                     <VisualState x:Name="Unchecked">
  14.                         <VisualState.Setters>
  15.                             <Setter TargetName="check" Property="Opacity" Value="0" />
  16.                             <Setter TargetName="check_circle" Property="Opacity" Value="0" />
  17.                             <Setter TargetName="border_circle" Property="Opacity" Value="1" />
  18.                         </VisualState.Setters>
  19.                     </VisualState>
  20.                 </VisualStateGroup>
  21.             </VisualStateGroupList>
  22.         </VisualStateManager.VisualStateGroups>
  23.         <Grid>
  24.             <Grid.ColumnDefinitions>
  25.                 <ColumnDefinition Width="20" />
  26.                 <ColumnDefinition Width="Auto" />
  27.             </Grid.ColumnDefinitions>
  28.             <Grid WidthRequest="20" HeightRequest="20" Grid.Column="0" VerticalOptions="Center" HorizontalOptions="Center">
  29.                 <Ellipse x:Name="border_circle" StrokeThickness="2" Stroke="{StaticResource PlaceholderColor}" Fill="Transparent" WidthRequest="18" HeightRequest="18" HorizontalOptions="Center" VerticalOptions="Center" />
  30.                 <Ellipse x:Name="check" Fill="{StaticResource BackgroundColor}" WidthRequest="10" HeightRequest="10" HorizontalOptions="Center" VerticalOptions="Center" />
  31.                 <Ellipse x:Name="check_circle" StrokeThickness="2" Stroke="{StaticResource BackgroundColor}" WidthRequest="18" HeightRequest="18" HorizontalOptions="Center" VerticalOptions="Center" />
  32.             </Grid>
  33.             <ContentPresenter Margin="10,0,0,0" Grid.Column="1" HorizontalOptions="Start" VerticalOptions="Center" />
  34.         </Grid>
  35.     </Border>
  36. </ControlTemplate>
  38. <Style TargetType="RadioButton" x:Key="RadioButtonStyle">
  39.     <Setter Property="ControlTemplate" Value="{StaticResource RadioButtonTemplate}" />
  40.     <Setter Property="TextColor" Value="{StaticResource Black}" />
  41. </Style>
英文:

I have using custom styled Radio Button in my application where it uses ContentPresenter for displaying text/content. I want to change the color of the Text.

I have tried TextColor and TextBlock.Foreground but these doesnot solved it.

This is the Sample of my code:

  1. &lt;ControlTemplate x:Key=&quot;RadioButtonTemplate&quot;&gt;
  2. &lt;Border Stroke=&quot;Transparent&quot; BackgroundColor=&quot;Transparent&quot;&gt;
  3. &lt;VisualStateManager.VisualStateGroups&gt;
  4. &lt;VisualStateGroupList&gt;
  5. &lt;VisualStateGroup x:Name=&quot;CheckedStates&quot;&gt;
  6. &lt;VisualState x:Name=&quot;Checked&quot;&gt;
  7. &lt;VisualState.Setters&gt;
  8. &lt;Setter TargetName=&quot;check&quot; Property=&quot;Opacity&quot; Value=&quot;1&quot; /&gt;
  9. &lt;Setter TargetName=&quot;check_circle&quot; Property=&quot;Opacity&quot; Value=&quot;1&quot; /&gt;
  10. &lt;Setter TargetName=&quot;border_circle&quot; Property=&quot;Opacity&quot; Value=&quot;0&quot; /&gt;
  11. &lt;/VisualState.Setters&gt;
  12. &lt;/VisualState&gt;
  13. &lt;VisualState x:Name=&quot;Unchecked&quot;&gt;
  14. &lt;VisualState.Setters&gt;
  15. &lt;Setter TargetName=&quot;check&quot; Property=&quot;Opacity&quot; Value=&quot;0&quot; /&gt;
  16. &lt;Setter TargetName=&quot;check_circle&quot; Property=&quot;Opacity&quot; Value=&quot;0&quot; /&gt;
  17. &lt;Setter TargetName=&quot;border_circle&quot; Property=&quot;Opacity&quot; Value=&quot;1&quot; /&gt;
  18. &lt;/VisualState.Setters&gt;
  19. &lt;/VisualState&gt;
  20. &lt;/VisualStateGroup&gt;
  21. &lt;/VisualStateGroupList&gt;
  22. &lt;/VisualStateManager.VisualStateGroups&gt;
  23. &lt;Grid&gt;
  24. &lt;Grid.ColumnDefinitions&gt;
  25. &lt;ColumnDefinition Width=&quot;20&quot; /&gt;
  26. &lt;ColumnDefinition Width=&quot;Auto&quot; /&gt;
  27. &lt;/Grid.ColumnDefinitions&gt;
  28. &lt;Grid WidthRequest=&quot;20&quot; HeightRequest=&quot;20&quot; Grid.Column=&quot;0&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot;&gt;
  29. &lt;Ellipse x:Name=&quot;border_circle&quot; StrokeThickness=&quot;2&quot; Stroke=&quot;{StaticResource PlaceholderColor}&quot; Fill=&quot;Transparent&quot; WidthRequest=&quot;18&quot; HeightRequest=&quot;18&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; /&gt;
  30. &lt;Ellipse x:Name=&quot;check&quot; Fill=&quot;{StaticResource BackgroundColor}&quot; WidthRequest=&quot;10&quot; HeightRequest=&quot;10&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; /&gt;
  31. &lt;Ellipse x:Name=&quot;check_circle&quot; StrokeThickness=&quot;2&quot; Stroke=&quot;{StaticResource BackgroundColor}&quot; WidthRequest=&quot;18&quot; HeightRequest=&quot;18&quot; HorizontalOptions=&quot;Center&quot; VerticalOptions=&quot;Center&quot; /&gt;
  32. &lt;/Grid&gt;
  33. &lt;ContentPresenter Margin=&quot;10,0,0,0&quot; Grid.Column=&quot;1&quot; HorizontalOptions=&quot;Start&quot; VerticalOptions=&quot;Center&quot; /&gt;
  34. &lt;/Grid&gt;
  35. &lt;/Border&gt;
  36. &lt;/ControlTemplate&gt;
  37. &lt;Style TargetType=&quot;RadioButton&quot; x:Key=&quot;RadioButtonStyle&quot;&gt;
  38. &lt;Setter Property=&quot;ControlTemplate&quot; Value=&quot;{StaticResource RadioButtonTemplate}&quot; /&gt;
  39. &lt;Setter Property=&quot;TextColor&quot; Value=&quot;{StaticResource Black}&quot; /&gt;
  40. &lt;/Style&gt;

答案1

得分: 0

你可以在使用ControlTemplate时，设置RadioButton.Content中的TextColor。

  1. <RadioButton Value="Elephant">
  2.     <RadioButton.Content>
  3.         <StackLayout>
  4.             <Image Source="dotnet_bot.png"
  5.                    HorizontalOptions="Center"
  6.                    VerticalOptions="Center" />
  7.             <Label Text="Elephant" TextColor="Yellow"
  8.                    HorizontalOptions="Center"
  9.                    VerticalOptions="End" />
  10.         </StackLayout>
  11.     </RadioButton.Content>
  12. </RadioButton>

更多信息，请参考Redefine RadioButton appearance。

希望对你有帮助！

英文:

You could set the TextColor in RadioButton.Content when consuming the ControlTemplate

  1. &lt;RadioButton Value=&quot;Elephant&quot;&gt;
  2. &lt;RadioButton.Content&gt;
  3. &lt;StackLayout&gt;
  4. &lt;Image Source=&quot;dotnet_bot.png&quot;
  5. HorizontalOptions=&quot;Center&quot;
  6. VerticalOptions=&quot;Center&quot; /&gt;
  7. &lt;Label Text=&quot;Elephant&quot; TextColor=&quot;Yellow&quot;
  8. HorizontalOptions=&quot;Center&quot;
  9. VerticalOptions=&quot;End&quot; /&gt;
  10. &lt;/StackLayout&gt;
  11. &lt;/RadioButton.Content&gt;
  12. &lt;/RadioButton&gt;

For more info, you could refer to Redefine RadioButton appearance

Hope it helps!

huangapple
  • 本文由 发表于 2023年8月10日 19:35:20
  • 转载请务必保留本文链接：https://go.coder-hub.com/76875360.html
  • c#
  • contentpresenter
  • maui
  • radio-button
  • xaml
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定