MSDN > 論壇首頁 > Windows Presentation Foundation (WPF) > change foreground color of every textblock element inside a grid
發問發問
 

已答覆change foreground color of every textblock element inside a grid

  • 2009年7月2日 下午 10:31andradf 使用者勳章使用者勳章使用者勳章使用者勳章使用者勳章
     
    Hello,
    I am starting to learn WPF and I've come across an issue I cant seem to be able to get around.
    I have a grid with some textBlocks in it. I want to change the color of the text in all of these depending on the value on a slider.
    In the <grid> tag I can set the property TextBlock.Foreground="#..." and it sets the color for all its children that are TextBlocks.

    How can I set the TextBlock.Foreground property in a Grid element during runtime?

    many thanks.

    andraf.

解答

  • 2009年7月3日 上午 04:34Rahul P Nath 使用者勳章使用者勳章使用者勳章使用者勳章使用者勳章
     已答覆包含代碼
    Hi,
    You can use DataTrigger .Based on the value in the cell you can assign different colors(or someother property).

    Here is an example.
    If you enter 5 in the textbox it will show in red
    <TextBox  Height="23" Margin="120,33,38,0" Name="TextBox1" VerticalAlignment="Top" >
                <TextBox.Style>
                    <Style TargetType="{x:Type TextBox}">
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding RelativeSource={RelativeSource Self},Path=Text}" Value="5">
                                <Setter Property="Foreground" Value="Red"/>
                            </DataTrigger>
                        </Style.Triggers>  
                    </Style>
                </TextBox.Style>
            </TextBox>
    

    You could also use a Converter on your foreground property and assign the color based on your requirement
    See this link for as sample in using converters(it might not be directly addressing your problem though)

    Hope it helps
    FEAR NOT TO BE JUST Please mark posts as answers/helpful if it answers your query
  • 2009年7月9日 上午 07:35Bruce.ZhouMSFT, 版主使用者勳章使用者勳章使用者勳章使用者勳章使用者勳章
     已答覆包含代碼
    Hi andradf,

    Rahul has given useful suggestions and code. Here I wrote the code directly addressing your problems. The R property of the Color will change according to the value of the slider control. They are connected using databinding.

    XAML code:

    <Window x:Class="ChangeTextBlockForegroundProperty.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:local="clr-namespace:ChangeTextBlockForegroundProperty"
        Title="Window1" Height="300" Width="300">
        <Window.Resources>
        </Window.Resources>
        <Grid Name="grid1">
            <Grid.Resources>
                <Style TargetType="TextBlock">
                    <Style.Setters>
                        <Setter Property="Foreground">
                            <Setter.Value>
                                <Binding ElementName="slider1" Path="Value">
                                    <Binding.Converter>
                                        <local:MyConverter></local:MyConverter>
                                    </Binding.Converter>
                                </Binding>
                            </Setter.Value>    
                        </Setter>
                    </Style.Setters>
                </Style>
            </Grid.Resources>
            <StackPanel>
            <TextBlock>dddd</TextBlock>
                <TextBlock>abc</TextBlock>
                <TextBlock>ddd</TextBlock>
                <TextBlock>eee</TextBlock>
                <Slider Name="slider1" Maximum="255" Minimum="0"></Slider>
                </StackPanel>
        </Grid>
    </Window>
    
    
    C# code:

    Implement the converter:
        public partial class Window1 : Window
        {
            public Window1()
            {
                InitializeComponent();
                
            }
        }
        public class MyConverter : IValueConverter 
        {
            public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
            {
                byte a = 0;
                Color c = Color.FromArgb(0,0,0,0) ;
                 SolidColorBrush brush =null;
                 if (value != null)
                 {
                     double tmp = double.Parse(value.ToString());
                     a = (byte)tmp;
                     // Red color will change according to the value of the Slider
                     c = Color.FromArgb(255, a, 0, 0);
                     brush = new SolidColorBrush(c);
                 }
                 else
                 {
                     throw new ArgumentException("value can not be null");
                 }
                return brush;
            }
            public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
            {
                //no need to implement here.
                throw new NotImplementedException();
            }
        }
    

    After you change the value of the slider bar, you will see the Foreground color of the TextBlock changes.


    Best regards,
    Bruce Zhou


    Please mark the replies as answers if they help and unmark if they don't.

所有回覆

  • 2009年7月3日 上午 04:34Rahul P Nath 使用者勳章使用者勳章使用者勳章使用者勳章使用者勳章
     已答覆包含代碼
    Hi,
    You can use DataTrigger .Based on the value in the cell you can assign different colors(or someother property).

    Here is an example.
    If you enter 5 in the textbox it will show in red
    <TextBox  Height="23" Margin="120,33,38,0" Name="TextBox1" VerticalAlignment="Top" >
                <TextBox.Style>
                    <Style TargetType="{x:Type TextBox}">
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding RelativeSource={RelativeSource Self},Path=Text}" Value="5">
                                <Setter Property="Foreground" Value="Red"/>
                            </DataTrigger>
                        </Style.Triggers>  
                    </Style>
                </TextBox.Style>
            </TextBox>
    

    You could also use a Converter on your foreground property and assign the color based on your requirement
    See this link for as sample in using converters(it might not be directly addressing your problem though)

    Hope it helps
    FEAR NOT TO BE JUST Please mark posts as answers/helpful if it answers your query
  • 2009年7月9日 上午 07:35Bruce.ZhouMSFT, 版主使用者勳章使用者勳章使用者勳章使用者勳章使用者勳章
     已答覆包含代碼
    Hi andradf,

    Rahul has given useful suggestions and code. Here I wrote the code directly addressing your problems. The R property of the Color will change according to the value of the slider control. They are connected using databinding.

    XAML code:

    <Window x:Class="ChangeTextBlockForegroundProperty.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:local="clr-namespace:ChangeTextBlockForegroundProperty"
        Title="Window1" Height="300" Width="300">
        <Window.Resources>
        </Window.Resources>
        <Grid Name="grid1">
            <Grid.Resources>
                <Style TargetType="TextBlock">
                    <Style.Setters>
                        <Setter Property="Foreground">
                            <Setter.Value>
                                <Binding ElementName="slider1" Path="Value">
                                    <Binding.Converter>
                                        <local:MyConverter></local:MyConverter>
                                    </Binding.Converter>
                                </Binding>
                            </Setter.Value>    
                        </Setter>
                    </Style.Setters>
                </Style>
            </Grid.Resources>
            <StackPanel>
            <TextBlock>dddd</TextBlock>
                <TextBlock>abc</TextBlock>
                <TextBlock>ddd</TextBlock>
                <TextBlock>eee</TextBlock>
                <Slider Name="slider1" Maximum="255" Minimum="0"></Slider>
                </StackPanel>
        </Grid>
    </Window>
    
    
    C# code:

    Implement the converter:
        public partial class Window1 : Window
        {
            public Window1()
            {
                InitializeComponent();
                
            }
        }
        public class MyConverter : IValueConverter 
        {
            public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
            {
                byte a = 0;
                Color c = Color.FromArgb(0,0,0,0) ;
                 SolidColorBrush brush =null;
                 if (value != null)
                 {
                     double tmp = double.Parse(value.ToString());
                     a = (byte)tmp;
                     // Red color will change according to the value of the Slider
                     c = Color.FromArgb(255, a, 0, 0);
                     brush = new SolidColorBrush(c);
                 }
                 else
                 {
                     throw new ArgumentException("value can not be null");
                 }
                return brush;
            }
            public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
            {
                //no need to implement here.
                throw new NotImplementedException();
            }
        }
    

    After you change the value of the slider bar, you will see the Foreground color of the TextBlock changes.


    Best regards,
    Bruce Zhou


    Please mark the replies as answers if they help and unmark if they don't.