Question

I’m quite new to WPF development and I am unable to find a decisive answer about how to implement a custom border/panel (or drop down menu) that looks something like this:

The idea is to make a drop down menu/panel(with the centered arrow)

Answer 1

This should point you in the right direction:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="24"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="24" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Polygon
         Fill="LightGray"
        Grid.Column="1">
        <Polygon.Points>
            <Point X="12" Y="0" />
            <Point X="0" Y="24" />
            <Point X="24" Y="24" />
        </Polygon.Points>
    </Polygon>
    <ListBox Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="3" />
</Grid>

Of course, you can customize it as you see fit…
Notice that in this example I set the height and width of the top-middle cell to make the arrow 24X24