CODEWITHSUNDEEP
c#buttonuwptextbox
Dizzelowski
Dizzelowski

Reputation: 13

UWP: TextBox inside Button, how to prevent SpaceBar from triggering the Click event?

i want to put a TextBox, together with a Label and a SymbolIcon into a Button, so that the whole thing is clickable. at the start you can only see the label and the symbol. By clicking on the button, the label gets hidden and the textBox appears, where you can type some text. By clicking again the label comes up again with the new entered text and the TextBox disappears.

My problem is, that by setting the focus to the TextBox, the button (parent) also seems to get into focus, because everytime you press the spacebar, the Click Event of the button fires. I dont want this to happen, while the TextBox has focus.

XAML

    <Button Click="ToggleTopic"
            HorizontalAlignment="Stretch"
            HorizontalContentAlignment="Stretch">
        <Grid>                                            
            <TextBlock x:Name="textBlockInfoTopic" 
                       Text=""
                       HorizontalAlignment="Left"
                       Margin="100,0,100,0"/>
            <TextBox x:Name="textBoxTopic" 
                     PlaceholderText="enter Topic..."
                     HorizontalAlignment="Stretch"
                     Margin="100,0,100,0"
                     Visibility="Collapsed"/>

            <SymbolIcon x:Name="symbolTopicButton" 
                        Symbol="Add"
                        HorizontalAlignment="Right"/>
        </Grid>
    </Button>

C#

private void ToggleTopic(object sender, RoutedEventArgs e)
        {
            if (textBoxTopic.Visibility == Visibility.Visible)
            {
                //non edit mode
                textBoxTopic.Visibility = Visibility.Collapsed;
                textBlockInfoTopic.Visibility = Visibility.Visible;
                symbolTopicButton.Symbol = Symbol.Add;
                textBlockInfoTopic.Text = textBoxTopic.Text;
            }
            else
            {
                //edit mode
                textBoxTopic.Visibility = Visibility.Visible;
                textBoxTopic.Focus(FocusState.Programmatic);
                textBlockInfoTopic.Visibility = Visibility.Collapsed;
                symbolTopicButton.Symbol = Symbol.Go;
                textBlockInfoTopic.Text = "";
            } 
        }

I only want to prevent the triggering of the event through the spaceBar. The return key should trigger the event.

Thanks for helping me!

D.

Upvotes: 1

Views: 657

Answers (1)

Nico Zhu
Nico Zhu

Reputation: 32785

From official document,

If a button has keyboard focus, pressing the Enter key or the Space key also raises the Click event. You generally can't handle low-level PointerPressed events on a Button because it has the Click behavior instead.

If you want to prevent SpaceBar from triggering the Click event, you could override OnProcessKeyboardAccelerators method of Button like the following.

public class MyButton : Button
{

    protected override void OnProcessKeyboardAccelerators(ProcessKeyboardAcceleratorEventArgs args)
    {

        if(args.Key == VirtualKey.Space)
        {
            args.Handled = true;
        }
        base.OnProcessKeyboardAccelerators(args);
    }

}

Usage

<local:MyButton Click="ToggleTopic"  
    HorizontalAlignment="Stretch"
    HorizontalContentAlignment="Stretch">
    <Grid IsTapEnabled="False" >
        <TextBlock x:Name="textBlockInfoTopic" 
               Text=""
               HorizontalAlignment="Left"
               Margin="100,0,100,0"/>
        <TextBox x:Name="textBoxTopic" 
             PlaceholderText="enter Topic..."
             HorizontalAlignment="Stretch"
             Margin="100,0,100,0"
             Visibility="Collapsed"/>

        <SymbolIcon x:Name="symbolTopicButton" 
                Symbol="Add"
                HorizontalAlignment="Right"/>
    </Grid>
</local:MyButton>

Upvotes: 1

Related Questions