WPF - Create buttons with up and down arrows using

Question

I want to create some up and down buttons using the standard button background but with black arrows.

What is the best way to accomplish this with WPF??

Malcolm

Answer 1

You can create a Polygon which represents your up and down triangles and then set them to be the content of the buttons:

<Button>
  <Polygon 
    Points="300,200 450,200 375,300 300,200"
    Stroke="Black">
    <Polygon.Fill>
      <SolidColorBrush Color="Black" />
    </Polygon.Fill>
  </Polygon>
</Button>

You can tweak these to draw different figured, but that's generally the XAML you would use for basic geometry.

Answer 2

No discussion on this subject would be complete without mentioning the geometry mini-language (or Path Markup Syntax) for a more compact shape definition:-

  <Button>
    <Path Fill="Black" Data="M 0 6 L 12 6 L 6 0 Z"/>
  </Button>
  <Button>
    <Path Fill="Black" Data="M 0 0 L 6 6 L 12 0 Z"/>
  </Button>

The first describes a Move to 0,6 Line to 12,6 Line to 6,0 and then close the shape (Z).

There is also a curve syntax.

Answer 3

The preferred way to do this now is using Segoe UI Symbol. It replaces Marlett and provides many useful glyphs. Up and down would be

<Button FontFamily="Segoe UI Symbol" Content="&#xE110;"/>
<Button FontFamily="Segoe UI Symbol" Content="&#xE1FD;"/>

This font is pre-installed on all versions of windows 7+.

Answer 4

If you would like to have an arrow with base rectangle you can use this sample...

<Button >
   <Polygon   Stretch="Fill"  Fill="Black" Points="0,0 0,30 0,10 30,10 30,-10 45,10 30,30 30,20 0,20 0,0 30,0 30,10 0,10" />
</Button>

Answer 5

I find Marlett (a font built into Windows) handy for that sort of thing.

<Button FontFamily="Marlett" FontSize="20" Content="5"/>
<Button FontFamily="Marlett" FontSize="20" Content="6"/>