.netwpfuser-interfacexamlwpf-controls

How to implement Balloon message in a WPF application


We would like to use balloon messages as described in the UX Guide from Microsoft. I found some samples which uses native code from Windows Forms, but the native code requires a handle to the component which a bit difficult for a WPF application since it doesn't follow the same concept.

I found some sample code which uses WPF's decorator mechanism, but I'm still not convinced that this is the easiest approach for WPF application. Could a possible implementation be to implement a decorator around a tooltip?

The concrete case I have is a form with several text boxes which need input validation and notification on possible wrong input values - something which seems appropriate for balloon messages.

Is there a commercial or open source control built for this use case under WPF that I should be aware of?


Solution

  • I ended up putting a TextBlock in the adorner layer:

    <Setter Property="Validation.ErrorTemplate">
        <Setter.Value>
            <ControlTemplate>
                <StackPanel Orientation="Vertical">
                    <Border>
                        <AdornedElementPlaceholder  x:Name="adorner"/>
                    </Border>
                    <TextBlock 
                        Height="20" Margin="10 0" Style="{StaticResource NormalColorBoldWeightSmallSizeTextStyle}"
                        Text="{Binding ElementName=adorner, Path=AdornedElement.(Validation.Errors)[0].ErrorContent}"/>
                </StackPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    

    I also used the tooltip as shown in every WPF examples out there:

    <Style.Triggers>
        <Trigger Property="Validation.HasError" Value="True">
            <Setter Property="ToolTip"
                    Value="{Binding RelativeSource={RelativeSource Self}, Path=(Validation.Errors)[0].ErrorContent}">
            </Setter>
        </Trigger>
    </Style.Triggers>
    

    Not optimal (would really like a Balloon Message control), but works good enough for the need we have.