Changing another control's property in some control's Trigger with "dynamic" name

Question

I am trying to change my labels style dynamically on my forms. The behaviour I want is: Every time a textbox called 'txtName', for instance, gets Focused, it should search for a Label Control named 'lblName' and change its FontWeight property to "Bold".

The same for a textbox called 'txtBirthday' and a label called 'lblBirthday', where 'txt' stands for TextBox and lbl for Label.

Every textbox has a NAME and a prefix "txt" and a prefix "lbl" for its corresponding label, but if the textbox doesnt find a correspoding label it should do nothing.

In other words, every time a Textbox get focused on the form, it should search for the label "responsable" for its description and hightlight it (changing its font weight to bold) so the form will be more user frendly. That way the user wont get confused which textbox he is typing in.

I have a peace of code that maybe a good start point, but I dont know how to work with non-static control names.

    <Style TargetType="{x:Type Label}">

    <Style.Triggers>
        <!-- Here is how we bind to another control's property -->
        <DataTrigger Binding="{Binding IsFocused, ElementName=txtUser}" Value="True">
            <Setter Property="FontWeight" Value="Bold" />
            <!-- Here is the 'override' content -->
        </DataTrigger>

    </Style.Triggers>

</Style>

I don't think you are going to be able to use variables in XAML. Put an event handlers on gotfocus and lost focus. — paparazzo, Dec 18 '11 at 01:18
Is your example a simplification of a more complex setup? I would not recommend matching names to change behaviour - this approach is brittle and doesn't scale. They are other built-in alternatives that are more robust (control templates, user controls, etc). — FunnyItWorkedLastTime, Dec 18 '11 at 04:19
@BalamBalam, There are several controls. I will have a HUGE work to do this. Is there a way to define them globally? — Hugo Ramos, Dec 18 '11 at 08:12
@FRuffell, That example is just to show how it would be for one static named textbox. I want to use variables, as BalamBalam said, but I dont know if it's possible. Thank you both for the replies. — Hugo Ramos, Dec 18 '11 at 08:13
If you must use this approach, you should it implement an attached behaviour which you would apply to both `TextBox` and `Labels` that need this effect. — FunnyItWorkedLastTime, Dec 18 '11 at 14:05

score 0 · Accepted Answer · answered Dec 18 '11 at 14:40

As mentioned in the comments above, the technique of searching for and pattern matching element names as the basis for applying visual behaviour is not robust. For example, what happens when you make a typo and use "lbel" instead of "lbl"? Or what happens if you later decide to replace all Labels with TextBlocks - do you still annotate their names with a prefix of "lbl" to preserve the behaviour? Another downside to using code to change visuals - is now understanding the behaviour of your UI from reading XAML alone becomes much harder since properties are being changed behind the scenes. WPF has many built in ways which should be preferred over this approach. If you are interested in alternative implementations, just ask we are here to help :)

That being said, if must use this approach, here is what your attached behaviour would look like:

C#

public static class FontWeightFocusedHelper
{
    private static readonly List<Label> Labels = new List<Label>();

    public static void SetChangeFontWeightOnTextBoxFocused(Label label, bool value)
    {
        label.SetValue(ChangeFontWeightOnTextBoxFocusedProperty, value);
    }

    public static bool GetChangeFontWeightOnTextBoxFocused(Label label)
    {
        return (bool) label.GetValue(ChangeFontWeightOnTextBoxFocusedProperty);
    }

    public static readonly DependencyProperty ChangeFontWeightOnTextBoxFocusedProperty =
        DependencyProperty.RegisterAttached("ChangeFontWeightOnTextBoxFocused", typeof (bool),
                                            typeof (FontWeightFocusedHelper),
                                            new FrameworkPropertyMetadata(OnChangeFontWeightOnTextBoxFocusedPropertyChanged));

    private static void OnChangeFontWeightOnTextBoxFocusedPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        if (d is TextBox)
        {
            var textBox = (TextBox) d;
            // Make sure to use a WeakEventManager here otherwise you will leak ...
            textBox.GotFocus += OnTextBoxGotFocusChanged;
            textBox.LostFocus += OnTextBoxLostFocusChanged;
            return;
        }

        if (d is Label)
        {
            // Make sure to store WeakReferences here otherwise you will leak ...
            Labels.Add((Label)d);
            return;
        }

        throw new InvalidOperationException("ChangeFontWeightOnTextBoxFocused can only be set on TextBox and Label types.");
    }

    private static void OnTextBoxLostFocusChanged(object sender, RoutedEventArgs e)
    {
        SetMatchingLabelFontWeight(sender as TextBox, FontWeights.Regular);
    }

    private static void OnTextBoxGotFocusChanged(object sender, RoutedEventArgs e)
    {
        SetMatchingLabelFontWeight(sender as TextBox, FontWeights.Bold);
    }

    private static void SetMatchingLabelFontWeight(TextBox textBox, FontWeight fontWeight)
    {
        if (textBox != null)
        {
            // Suggest adding a property for LabelPrefix and TextBoxPrefix too, use them here
            var label = Labels.Where(l => !String.IsNullOrEmpty(l.Name))
                              .Where(l => l.Name.Replace("lbl", "txt") == textBox.Name)
                              .FirstOrDefault();

            if (label != null)
            {
                label.FontWeight = fontWeight;
            }
        }
    }
}

XAML

    <StackPanel >
        <StackPanel.Resources>
            <Style TargetType="{x:Type TextBox}">
                <Setter Property="l:FontWeightFocusedHelper.ChangeFontWeightOnTextBoxFocused" Value="True" />
            </Style>
            <Style TargetType="{x:Type Label}">
                <Setter Property="l:FontWeightFocusedHelper.ChangeFontWeightOnTextBoxFocused" Value="True" />
            </Style>
        </StackPanel.Resources>
        <StackPanel Orientation="Horizontal">                
            <Label x:Name="lblOne" VerticalAlignment="Center" Content="First Name"/>
            <TextBox x:Name="txtOne" Width="300" VerticalAlignment="Center"/>
        </StackPanel>
        <StackPanel Orientation="Horizontal">
            <Label x:Name="lblTwo" VerticalAlignment="Center" Content="Last Name" />
            <TextBox x:Name="txtTwo" Width="300" VerticalAlignment="Center" />
        </StackPanel>
    </StackPanel>

Hope this helps!

thank you! It worked like magic! :) Thats exactly what I wanted. I don't if I can ask that here (or if I should open another Question), but what would be a good approach to that? I'm not talking about that specific effect, but a good way to help users to know where they are in a Form with some textboxes? — Hugo Ramos, Dec 19 '11 at 06:16
I would suggest opening another question on how to create this effect using a `UserControl` or custom `Control`. The above example is just that - it will certainly leak memory (unless fixed) and honestly, it is easier (and more common) to not use "dynamic" names. — FunnyItWorkedLastTime, Dec 19 '11 at 17:43

score 0 · Answer 2 · answered Dec 18 '11 at 15:43

0

You can have all gotfocus go to the same event. The sender is passed to the event so you can get the name of the sender. In code behind you can use variable and logic that is not available in XAML.

answered Dec 18 '11 at 15:43

paparazzo

44,497
23
105
176

Thats an approach, indeed, but I wanted something more global. Thank you! – Hugo Ramos Dec 19 '11 at 06:17

Changing another control's property in some control's Trigger with "dynamic" name

2 Answers2