Callout style popup in WPF

Question

In my WPF application, I am trying to implement a Callout style Popup. I got some reference but still could a good solution.

Please find the image what I am trying to implement. It should be a popup window. The initial position should be indicating the parent button. But as it is a window so can be dragged from its location.

Please guide me. Thanks.

Answer 1

You could use a Path:

<ToggleButton x:Name="toggleButton" Content="Button" Margin="100" />

<Popup IsOpen="{Binding IsChecked, ElementName=toggleButton}" 
               PlacementTarget="{Binding ElementName=toggleButton}"
               Placement="Right"
               StaysOpen="False"
               AllowsTransparency="True"
               VerticalOffset="-90">
    <Grid>
        <Border Background="Blue" BorderThickness="1" BorderBrush="Black"
                Width="200" Height="200" Margin="24,0,0,0">
            <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="White">...</TextBlock>
        </Border>
        <Path StrokeThickness="1" Stroke="Black" Fill="Blue" VerticalAlignment="Center">
            <Path.Data>
                <PathGeometry>
                    <PathFigure StartPoint="25,0">
                        <PolyLineSegment Points="0,25 25,50"/>
                        <LineSegment Point="25,0" IsStroked="False"/>
                    </PathFigure>
                </PathGeometry>
            </Path.Data>
        </Path>
    </Grid>
</Popup>