单选按钮错误样式 [英] Radio Button Error Style

问题描述

我已经实现了错误的风格，使用以下code文本框。这将设置一个工具提示，并提出一个不错的错误图像文本框的右侧，如果该元素通过IDataErrorInfo的接口报告错误状态：

I have implemented an error style for textboxes using the following code. This sets a tool tip and puts a nice error image to the right of the textbox if the element reports an error status via an IDataErrorInfo interface:

    <!-- Set error style for textboxes -->
    <Style x:Key="txtBoxErrStyle" TargetType="{x:Type TextBox}">
        <Style.Triggers>
            <Trigger Property="Validation.HasError" Value="True">
                <Setter Property="ToolTip" 
                        Value="{Binding RelativeSource={x:Static RelativeSource.Self}, 
                        Path=(Validation.Errors)[0].ErrorContent}" />
            </Trigger>
        </Style.Triggers>

        <Setter Property="Validation.ErrorTemplate">
            <Setter.Value>
                <ControlTemplate>
                    <DockPanel DockPanel.Dock="Right">
                        <AdornedElementPlaceholder />
                        <Image Source="Icons/Error.png"
                               Height="16"
                               Width="16"
                               ToolTip="{Binding Path=AdornedElement.ToolTip, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Adorner}}}" />
                    </DockPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

这个作品真的很好，我通过添加工具提示文本和图像Error.png设置文本框的右侧。但我想要做的是一个单选按钮，给类似的功能。我试图通过复制上述code和改变变量要做到这一点：

This works really well for me by adding the tool tip text and setting the Error.png image to the right of the textbox. But what I want to do is give similar functionality to a radio button. I attempted to do this by copying the above code and changing the tag to be:

    <!-- Set error style for radio buttons -->
    <Style x:Key="radioBtnErrStyle" TargetType="{x:Type RadioButton}">

这单选按钮通过IDataErrorInfo的接口势必会报告错误，单选按钮本身ValidatesOnDataErrors设置为true。字段

The field that the radio button is bound to reports errors via the IDataErrorInfo interface, and the radio button itself has ValidatesOnDataErrors set to true.

本排序为我工作。当单选按钮被认为是错误的，刀尖的是设置为错误消息从IDataErrorInfo的例程返回。但我似乎无法得到Error.png图像显示在表格上。

This sort of worked for me. When the radio button is deemed to be in error, the tool tip is set to the error message returned from the IDataErrorInfo routine. But I cannot seem to get the Error.png image to display on the form.

我已经尝试了一些基本的拧与周围的风格，比如调换和元素的顺序，但没有我尝试似乎工作。

I have tried some basic screwing around with the style, such as swapping the order of the and elements, but nothing I tried seemed to work.

因此​​，任何想法，我怎么能得到要显示的图像？

So any ideas as to how I can get the image to display?

更新

斯特芬的答复击中了要害。增大余量确实允许空间将被显示的图像。

Steffen's reply hit the nail on the head. Increasing the margin did allow room for the image to be displayed.

不过，我已经运行到另一个，在不同的问题，如果错误的条件是present当程序首先启动，然后刀尖将反映出现的错误，但图像也不会被显示。只有当该程序开始做该图像也可显示后错误条件正在积极提高。我以前看过这一点，但现在还没有看到它处理的正确方法。时间到另一个研究课题WPF！

However I have run into another, separate issue in that if the error condition is present when the program first starts then the tool tip will reflect the error condition, but the image will not be displayed. It is only when error condition is actively raised after the program start does the image also be displayed. I have seen this before but have not yet seen the correct way of handling it. Time to research another WPF topic!

推荐答案

鉴于风格似乎得到放在首位正确应用这很可能只是一个的特定窗口组成的效应，即宽度，边缘和安置相关的控件：

Given that the style seems to get applied correctly in the first place this is likely just an effect of your particular window composition, i.e. width, margin and placement of the related controls:

根据您的布局图像可能最终的背后的单选按钮画布，因此无形的，如果他们不是在窗口内留下足够的空间来显示你旁边的控制，例如图像如果单选填补了的StackPanel 行的整个宽度。

Depending on your layout the image might end up behind the radio button 'canvas' and thus invisible, if their is not enough space left within the window to display the image alongside your control, e.g. if the RadioButton fills the entire width of a StackPanel row.

因此​​，你应该能够提供足够的空间，你认为合适，例如以泄露的形象通过在设置的情况下至少有16适当的右页边距：

Consequently you should be able to 'reveal' the image by providing enough space as you see fit, e.g. by setting an appropriate right margin of at least 16 in your case:

<RadioButton Margin="0,0,16,0"/>

根据这个假设，我确实能够重现该问题：presumably很容易被忽视，因为宽度和/或保证金的文本框往往由于默认的文本框边界提供明确和可见无论哪种方式，而这是一个单选及其边界不太常见默认情况下是不可见的。

According to this assumptions I've indeed been able to reproduce the issue: presumably it is easily overlooked because width and/or margin of a TextBox are often provided explicitly and visible either way due to the default TextBox border, while this is less common for a RadioButton and its border is invisible by default.

这篇关于单选按钮错误样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！