Fred
Fred

Reputation: 1221

Moving items down when adding error info using INotifyDataErrorInfo

I have for example a combobox and if it is not chosen then I am displaying an error message under it. When the message is displayed it is displayed on top of the control that is under the combobox. Is there a way to move the control(s) under the combobox down when the error message is shown?

<UserControl.Resources>

    <Style x:Key="ErrorStackPanel" TargetType="{x:Type StackPanel}">
        <Style.Triggers>
            <Trigger Property="Validation.HasError" Value="True">
                <Setter Property="Margin" Value="0 20 0 5"/>
            </Trigger>
        </Style.Triggers>
    </Style>

    <Style x:Key="ErrorComboBox" TargetType="{x:Type ComboBox}">
        <Setter Property="MinWidth" Value="180" />
        
        <Setter Property="Validation.ErrorTemplate">
            <Setter.Value>
                <ControlTemplate>

                    <StackPanel Orientation="Vertical" SnapsToDevicePixels="True">

                        <!--Placeholder for the TextBox itself-->

                        <AdornedElementPlaceholder x:Name="textBox" />
                        <ItemsControl ItemsSource="{Binding}">
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding ErrorContent}" 
                                               Foreground="Maroon"
                                               FontWeight="Bold"
                                                Margin="5 2 0 0"
                                                />
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</UserControl.Resources>

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="auto" />
        <RowDefinition Height="auto" />
    </Grid.RowDefinitions>
    <StackPanel Grid.Row="2" Margin="10 5">
        <Label Content="Switch" />
        <ComboBox Style="{StaticResource ErrorComboBox}" ItemsSource="{Binding Switches}" SelectedItem="{Binding SelectedSwitch}" 
                    DisplayMemberPath="Name"  HorizontalAlignment="Left">
        </ComboBox>
    </StackPanel>


    <StackPanel Grid.Row="3" Margin="10 10" Style="{StaticResource ErrorStackPanel}">
        <RadioButton GroupName="pres" 
                         IsChecked="{Binding TriggerOnPress}" 
                         Content="On" Margin="0 5" />
        <RadioButton GroupName="pres" 
                         IsChecked="{Binding TriggerOnPress, Converter={valueconverters:BoolInverterConverter}}" 
                         Content="Off" Margin="0 5"/>

    </StackPanel>

Upvotes: 0

Views: 36

Answers (1)

ASh
ASh

Reputation: 35679

StackPanel doesn't have error state. Apply trigger to ComboBox and change bottom margin:

<Style x:Key="ErrorComboBox" TargetType="{x:Type ComboBox}">
    <Setter Property="MinWidth" Value="180" />
    
    <Setter Property="Validation.ErrorTemplate">
        <Setter.Value>
            <ControlTemplate>
                ...
            </ControlTemplate>
        </Setter.Value>
    </Setter>

    <Style.Triggers>
        <Trigger Property="Validation.HasError" Value="True">
            <Setter Property="Margin" Value="0 0 0 20"/>
        </Trigger>
    </Style.Triggers>
</Style>

Upvotes: 1

Related Questions