XAML中同名TextBlock报错问题及后台统一访问方法咨询

为什么会报错？ #

WPF里的Name（或x:Name）是当前窗口/用户控件的全局命名空间里的唯一标识，不是按父控件划分作用域的。哪怕三个Toggle分别在不同Button里，它们都属于同一个窗口的命名容器，所以重名会触发重复定义的错误。

几种实现类似CSS ID效果的方案 #

1. 给每个控件取唯一名称（最直接）

直接给每个TextBlock改个不重复的名字，后台代码直接通过名字访问，简单高效：

<Button Name="OutputButton" Margin="5" Width="150" Click="OutputToggle_Click" TabIndex="0" HorizontalAlignment="Center">
    <TextBlock Name="OutputText" HorizontalAlignment="Center">RF 
        <TextBlock Name="OutputToggle" HorizontalAlignment="Left"></TextBlock>
    </TextBlock>
</Button>
<Button Name="ModulationButton" Margin="5" Width="Auto" HorizontalAlignment="Left" Click="ModulationToggle_Click" IsEnabled="False" TabIndex="0">
    <TextBlock Name="ModulationToggleText" Margin="3">Load Waveform to enable MOD
        <TextBlock Name="ModulationToggle"></TextBlock>
    </TextBlock>
</Button>
<Button Name="LOSharingButton" Margin="5" Width="150" HorizontalAlignment="Left" Click="AutomaticLOSharingButton_Click">
    <TextBlock Name="LOSharingText">LO Sharing
        <TextBlock Name="LOSharingToggle"></TextBlock>
    </TextBlock>
</Button>

后台直接用OutputToggle.Text = "xxx"这类代码操作即可。

2. 用Tag属性标记+后台查找子元素

如果想统一用"Toggle"作为标识，可以给每个TextBlock加Tag="Toggle"，然后写个通用方法从Button里找到对应的元素：
修改后的XAML：

<Button Name="OutputButton" Margin="5" Width="150" Click="OutputToggle_Click" TabIndex="0" HorizontalAlignment="Center">
    <TextBlock Name="OutputText" HorizontalAlignment="Center">RF 
        <TextBlock Tag="Toggle" HorizontalAlignment="Left"></TextBlock>
    </TextBlock>
</Button>
<Button Name="ModulationButton" Margin="5" Width="Auto" HorizontalAlignment="Left" Click="ModulationToggle_Click" IsEnabled="False" TabIndex="0">
    <TextBlock Name="ModulationToggleText" Margin="3">Load Waveform to enable MOD
        <TextBlock Tag="Toggle"></TextBlock>
    </TextBlock>
</Button>
<Button Name="LOSharingButton" Margin="5" Width="150" HorizontalAlignment="Left" Click="AutomaticLOSharingButton_Click">
    <TextBlock Name="LOSharingText">LO Sharing
        <TextBlock Tag="Toggle"></TextBlock>
    </TextBlock>
</Button>

后台写个查找方法：

private TextBlock GetToggleFromButton(Button button)
{
    foreach (var child in LogicalTreeHelper.GetChildren(button))
    {
        if (child is TextBlock outerTextBlock)
        {
            foreach (var innerChild in LogicalTreeHelper.GetChildren(outerTextBlock))
            {
                if (innerChild is TextBlock toggle && toggle.Tag?.ToString() == "Toggle")
                {
                    return toggle;
                }
            }
        }
    }
    return null;
}

使用示例：

// 在OutputToggle_Click事件里
var toggle = GetToggleFromButton(OutputButton);
if(toggle != null)
{
    toggle.Text = "ON";
}

3. MVVM模式下的数据绑定（WPF推荐）

如果是用MVVM开发，建议把每个Toggle的状态绑定到ViewModel的属性上，不用直接操作UI元素：
先定义ViewModel的属性（需要实现INotifyPropertyChanged）：

public class MainViewModel : INotifyPropertyChanged
{
    private string _outputToggleText;
    public string OutputToggleText
    {
        get => _outputToggleText;
        set { _outputToggleText = value; OnPropertyChanged(); }
    }

    private string _modulationToggleText;
    public string ModulationToggleText
    {
        get => _modulationToggleText;
        set { _modulationToggleText = value; OnPropertyChanged(); }
    }

    private string _loSharingToggleText;
    public string LOSharingToggleText
    {
        get => _loSharingToggleText;
        set { _loSharingToggleText = value; OnPropertyChanged(); }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

XAML里绑定：

<!-- 先给窗口设置DataContext为ViewModel实例 -->
<Window.DataContext>
    <local:MainViewModel />
</Window.DataContext>

<Button Name="OutputButton" Margin="5" Width="150" Click="OutputToggle_Click" TabIndex="0" HorizontalAlignment="Center">
    <TextBlock Name="OutputText" HorizontalAlignment="Center">RF 
        <TextBlock Text="{Binding OutputToggleText}" HorizontalAlignment="Left"></TextBlock>
    </TextBlock>
</Button>
<Button Name="ModulationButton" Margin="5" Width="Auto" HorizontalAlignment="Left" Click="ModulationToggle_Click" IsEnabled="False" TabIndex="0">
    <TextBlock Name="ModulationToggleText" Margin="3">Load Waveform to enable MOD
        <TextBlock Text="{Binding ModulationToggleText}"></TextBlock>
    </TextBlock>
</Button>
<Button Name="LOSharingButton" Margin="5" Width="150" HorizontalAlignment="Left" Click="AutomaticLOSharingButton_Click">
    <TextBlock Name="LOSharingText">LO Sharing
        <TextBlock Text="{Binding LOSharingToggleText}"></TextBlock>
    </TextBlock>
</Button>

后台事件里直接修改ViewModel属性：

private void OutputToggle_Click(object sender, RoutedEventArgs e)
{
    var vm = DataContext as MainViewModel;
    vm.OutputToggleText = vm.OutputToggleText == "ON" ? "OFF" : "ON";
}

内容的提问来源于stack exchange，提问作者rickster26ter1