How to control the mouse cursor


How to set the mouse cursor in one easy step:  set the Cursor property.  For example, this markup:


 


<Button Cursor=Help>Help</Button>


 


… sets the cursor to be the “Help” cursor, when the mouse is over the button. 


 


Note that since Cursor is scoped, it doesn’t apply to other parts of the page (anything other than that button).  Also note that if a child and parent both set the Cursor, the child wins.  For example, in this markup:


 


<Border Cursor=HandPadding=50 Background=LightYellow >


  <Button Cursor=Help>Help</Button>


</Border>


 


… the cursor is a hand over the Border area, except over the Button it’s overridden to a Help cursor.


 


So by default the child wins over the parent, but the parent gets the final say with the ForceCursor property.  When this property is set, the parent’s cursor overrides the child.  So add this to the border in the above markup, and the cursor is a Hand, even over the button:


 


<Border Cursor=Hand ForceCursor=True Padding=50 Background=LightYellow >


  <Button Cursor=Help>Help</Button>


</Border>


 



 


 


Here’s an example of Cursor and ForceCursor that you can use to see everything (just paste this into XamlPad):


 


<Page   


    xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentation 


    xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml 


    >


 


  <Page.Resources>


 


    <!– Give all the TextBlocks a “hand” cursor –>


    <Style TargetType=TextBlock>


      <Setter Property=Cursor Value=Hand />


      <Setter Property=Background Value=White />


    </Style>


 


    <!– Tell all the borders to give some padding to their child,


         and to have a light blue background.  This will


         make it easier to see which part is the border,


         and which part is the child of the border –>


    <Style TargetType=Border>


      <Setter Property=Padding Value=20 />


      <Setter Property=Background Value=LightBlue />


      <Setter Property=Margin Value=5 />


    </Style>


 


  </Page.Resources>


 


  <StackPanel>


 


    <!– Demonstrate a simple cursor –>


    <Border>


      <TextBlock>


        Just a text block.  This will have a hand cursor over the text block,


        coming from the style.  But the light blue border area will have the


        default arrow cursor.


      </TextBlock>


    </Border>


 


    <!– Demonstrate a child cursor overriding a parent cursor –>


    <Border Cursor=Cross>


      <TextBlock >


        Same text block, but now the border has a cross cursor set.  This will


        still have a hand cursor over the text block, but the light blue border


        will have a cross cursor (the text block’s cursor is overriding the


        border’s cursor).


      </TextBlock>


    </Border>


 


    <!– Demonstrate a parent cursor overriding a child cursor –>


    <Border Cursor=Cross ForceCursor=True>


      <TextBlock>


        Now the border also has ForceCursor set.  So both the border


        area and the text block will have a cross cursor (the border’s cursor


        is now winning over the text block’s cursor.


      </TextBlock>


    </Border>


 


  </StackPanel>


 


</Page>


 


 


 


 

Comments (1)

  1. FKruesch says:

    it would be interesting to know as well, how to change a cursor during drag+drop operations.