Microsoft Developer Network > Domovská stránka fór > Windows Presentation Foundation (WPF) > change foreground color of every textblock element inside a grid
Odeslat dotazOdeslat dotaz
 

Odpovědětchange foreground color of every textblock element inside a grid

  • 2. července 2009 22:31andradf Uživatelské medaileUživatelské medaileUživatelské medaileUživatelské medaileUživatelské medaile
     
    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.

Odpovědi

  • 3. července 2009 4:34Rahul P Nath Uživatelské medaileUživatelské medaileUživatelské medaileUživatelské medaileUživatelské medaile
     OdpovědětObsahuje kód
    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
  • 9. července 2009 7:35Bruce.ZhouMSFT, ModerátorUživatelské medaileUživatelské medaileUživatelské medaileUživatelské medaileUživatelské medaile
     OdpovědětObsahuje kód
    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.

Všechny reakce

  • 3. července 2009 4:34Rahul P Nath Uživatelské medaileUživatelské medaileUživatelské medaileUživatelské medaileUživatelské medaile
     OdpovědětObsahuje kód
    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
  • 9. července 2009 7:35Bruce.ZhouMSFT, ModerátorUživatelské medaileUživatelské medaileUživatelské medaileUživatelské medaileUživatelské medaile
     OdpovědětObsahuje kód
    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.