Changing Button behavior RRS feed

  • Question

  • I am trying to change the image of a button on when the pointer is hovering over it.  I have a handler for both the PointerEnteredEvent and PointerExitedEvent

    m_bnLevelSelect[x][y]->AddHandler( UIElement::PointerEnteredEvent, ref new PointerEventHandler(this, &DirectXPage::bnLevelSelect_PointerEntered), true );
    m_bnLevelSelect[x][y]->AddHandler( UIElement::PointerExitedEvent, ref new PointerEventHandler(this, &DirectXPage::bnLevelSelect_PointerExited), true );

    The handlers are getting called when the pointer enters and exists the area of the button.  Within the handler I am changing the background of the button to an image and setting e->handled = True;  however the default gray square seems to override the image I set.  I have verified the button background is getting set to the correct image but the default button hover behavior (a gray box) appears to display over my image.  I know I am correctly setting the Image since if I do not change the image back during the PointerExitedEvent the button is shows as changed to the image for the PointerEnteredEvent as expected.

    How do I get my image to display for the button during the PointerEnteredEvent instead of the default gray rectangle?

    Tuesday, April 8, 2014 4:30 AM


All replies

  • Instead of trying to override the event handlers edit the template to show the image you want in the PointerPressed state. See Quickstart: Styling controls, Quickstart: Control templates, and Button styles and templates .
    • Marked as answer by RJS123 Wednesday, April 9, 2014 2:12 AM
    Tuesday, April 8, 2014 6:10 AM
  • Thank you very much for the links!  They gave me just what I needed.  What I left out of my original message is that I am creating the buttons programmatically because the number of buttons is dynamic. 

    So the next question is how do I use the style for the button from C++

    m_bnLevelSelect[x][y] = ref new Button();
    m_bnLevelSelect[x][y]->Name = (x+1).ToString() + (y+1).ToString();
    m_bnLevelSelect[x][y]->Content = (y + 1).ToString();
    m_bnLevelSelect[x][y]->Foreground = ib[x];
    m_bnLevelSelect[x][y]->SetValue(gdLevelSelector->ColumnProperty, x*2);
    m_bnLevelSelect[x][y]->SetValue(gdLevelSelector->RowProperty, y+2);
    //m_bnLevelSelect[x][y]->Style = "{StaticResource BlockButton}";
    m_bnLevelSelect[x][y]->Click += ref new RoutedEventHandler(this, &DirectXPage::bnLevelSelect_Click);

    I have been trying to set the style of the button to the template style using something like m_bnLevelSelect[x][y]->Style = "{StaticResource BlockButton}"; where BlockButton is the style but I have not been able to determine how to set the value of a Button Style or if that is even the correct way to use the custom template from C+?


    Wednesday, April 9, 2014 12:49 AM
  • You need to use a Style object rather than passing in Xaml. If you have it as a resource you can look it up from your element's Resources property or from App::Current::Resources.


    Thursday, April 10, 2014 12:23 AM
  • Rob thanks again for pointing me in the right direction. I was able to find the solution I was looking for:




    Thursday, April 10, 2014 2:32 AM