WPF – Create buttons with up and down arrows using standard buttons

Tag: ,

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

4 Answers

  1. xequnsruuh on Mar 05, 2013

    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"/>
    
  2. rajesh on Mar 05, 2013

    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.

  3. johan-offer on Mar 05, 2013

    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.

  4. scott on Mar 05, 2013

    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>