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

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

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

问题

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

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

这是我的代码示例：

<ControlTemplate x:Key="RadioButtonTemplate">
    <Border Stroke="Transparent" BackgroundColor="Transparent">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroupList>
                <VisualStateGroup x:Name="CheckedStates">
                    <VisualState x:Name="Checked">
                        <VisualState.Setters>
                            <Setter TargetName="check" Property="Opacity" Value="1" />
                            <Setter TargetName="check_circle" Property="Opacity" Value="1" />
                            <Setter TargetName="border_circle" Property="Opacity" Value="0" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="Unchecked">
                        <VisualState.Setters>
                            <Setter TargetName="check" Property="Opacity" Value="0" />
                            <Setter TargetName="check_circle" Property="Opacity" Value="0" />
                            <Setter TargetName="border_circle" Property="Opacity" Value="1" />
                        </VisualState.Setters>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateGroupList>
        </VisualStateManager.VisualStateGroups>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="20" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>
            <Grid WidthRequest="20" HeightRequest="20" Grid.Column="0" VerticalOptions="Center" HorizontalOptions="Center">
                <Ellipse x:Name="border_circle" StrokeThickness="2" Stroke="{StaticResource PlaceholderColor}" Fill="Transparent" WidthRequest="18" HeightRequest="18" HorizontalOptions="Center" VerticalOptions="Center" />
                <Ellipse x:Name="check" Fill="{StaticResource BackgroundColor}" WidthRequest="10" HeightRequest="10" HorizontalOptions="Center" VerticalOptions="Center" />
                <Ellipse x:Name="check_circle" StrokeThickness="2" Stroke="{StaticResource BackgroundColor}" WidthRequest="18" HeightRequest="18" HorizontalOptions="Center" VerticalOptions="Center" />
            </Grid>
            <ContentPresenter Margin="10,0,0,0" Grid.Column="1" HorizontalOptions="Start" VerticalOptions="Center" />
        </Grid>
    </Border>
</ControlTemplate>

<Style TargetType="RadioButton" x:Key="RadioButtonStyle">
    <Setter Property="ControlTemplate" Value="{StaticResource RadioButtonTemplate}" />
    <Setter Property="TextColor" Value="{StaticResource Black}" />
</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:

&lt;ControlTemplate x:Key=&quot;RadioButtonTemplate&quot;&gt;
&lt;Border Stroke=&quot;Transparent&quot; BackgroundColor=&quot;Transparent&quot;&gt;
&lt;VisualStateManager.VisualStateGroups&gt;
&lt;VisualStateGroupList&gt;
&lt;VisualStateGroup x:Name=&quot;CheckedStates&quot;&gt;
&lt;VisualState x:Name=&quot;Checked&quot;&gt;
&lt;VisualState.Setters&gt;
&lt;Setter TargetName=&quot;check&quot; Property=&quot;Opacity&quot; Value=&quot;1&quot; /&gt;
&lt;Setter TargetName=&quot;check_circle&quot; Property=&quot;Opacity&quot; Value=&quot;1&quot; /&gt;
&lt;Setter TargetName=&quot;border_circle&quot; Property=&quot;Opacity&quot; Value=&quot;0&quot; /&gt;
&lt;/VisualState.Setters&gt;
&lt;/VisualState&gt;
&lt;VisualState x:Name=&quot;Unchecked&quot;&gt;
&lt;VisualState.Setters&gt;
&lt;Setter TargetName=&quot;check&quot; Property=&quot;Opacity&quot; Value=&quot;0&quot; /&gt;
&lt;Setter TargetName=&quot;check_circle&quot; Property=&quot;Opacity&quot; Value=&quot;0&quot; /&gt;
&lt;Setter TargetName=&quot;border_circle&quot; Property=&quot;Opacity&quot; Value=&quot;1&quot; /&gt;
&lt;/VisualState.Setters&gt;
&lt;/VisualState&gt;
&lt;/VisualStateGroup&gt;
&lt;/VisualStateGroupList&gt;
&lt;/VisualStateManager.VisualStateGroups&gt;
&lt;Grid&gt;
&lt;Grid.ColumnDefinitions&gt;
&lt;ColumnDefinition Width=&quot;20&quot; /&gt;
&lt;ColumnDefinition Width=&quot;Auto&quot; /&gt;
&lt;/Grid.ColumnDefinitions&gt;
&lt;Grid WidthRequest=&quot;20&quot; HeightRequest=&quot;20&quot; Grid.Column=&quot;0&quot; VerticalOptions=&quot;Center&quot; HorizontalOptions=&quot;Center&quot;&gt;
&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;
&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;
&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;
&lt;/Grid&gt;
&lt;ContentPresenter Margin=&quot;10,0,0,0&quot; Grid.Column=&quot;1&quot; HorizontalOptions=&quot;Start&quot; VerticalOptions=&quot;Center&quot; /&gt;
&lt;/Grid&gt;
&lt;/Border&gt;
&lt;/ControlTemplate&gt;
&lt;Style TargetType=&quot;RadioButton&quot; x:Key=&quot;RadioButtonStyle&quot;&gt;
&lt;Setter Property=&quot;ControlTemplate&quot; Value=&quot;{StaticResource RadioButtonTemplate}&quot; /&gt;
&lt;Setter Property=&quot;TextColor&quot; Value=&quot;{StaticResource Black}&quot; /&gt;
&lt;/Style&gt;

答案1

得分: 0

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

<RadioButton Value="Elephant">
    <RadioButton.Content>
        <StackLayout>
            <Image Source="dotnet_bot.png"
                   HorizontalOptions="Center"
                   VerticalOptions="Center" />
            <Label Text="Elephant" TextColor="Yellow"
                   HorizontalOptions="Center"
                   VerticalOptions="End" />
        </StackLayout>
    </RadioButton.Content>
</RadioButton>

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

希望对你有帮助！

英文:

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

&lt;RadioButton Value=&quot;Elephant&quot;&gt;
&lt;RadioButton.Content&gt;
&lt;StackLayout&gt;
&lt;Image Source=&quot;dotnet_bot.png&quot;
HorizontalOptions=&quot;Center&quot;
VerticalOptions=&quot;Center&quot; /&gt;
&lt;Label Text=&quot;Elephant&quot; TextColor=&quot;Yellow&quot;
HorizontalOptions=&quot;Center&quot;
VerticalOptions=&quot;End&quot; /&gt;
&lt;/StackLayout&gt;
&lt;/RadioButton.Content&gt;
&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:

确定