CODEWITHSUNDEEP
wpfwin-universal-appuwpwindows-10-universalwindows-10-mobile
Konstantin Chsherbakov
Konstantin Chsherbakov

Reputation: 652

Button does not respond for the first click

I have the page for user to enter the personal phone number. When the TextBox got focus the virtual keyboard is shown, but then when a user finish typing the phone number and click the "Next" green button (Sorry about Russian language on screenshot) the first click "goes through" the button and close the keyboard and only the next click activate the click event. Any ideas how to fix that? Maybe there are some problems with page focus state, but I honestly don't know.

enter image description here

UPDATE: This is XAML of my page

<Grid x:Name="LayoutRoot" Style="{StaticResource GeneralAppBackground}">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

    // Control to show the loading state
    <controls:LoadingPageState x:Name="LoadingGrid" Visibility="Collapsed" Grid.RowSpan="3" Canvas.ZIndex="1" TitleOfOperation="Проверка существования кошелька..." />
    <Grid Style="{StaticResource GeneralAppHeaderStyle}">
        <TextBlock Text="Введите номер телефона" FontWeight="Normal" HorizontalAlignment="Center" VerticalAlignment="Center" Style="{StaticResource PageHeaderTextBlockStyle}" />
    </Grid>
    <Grid Grid.Row="1">
        <StackPanel Orientation="Vertical" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="20,0,20,0">
            <TextBlock x:Uid="Greeting" Foreground="#979797" TextAlignment="Center" Margin="0,0,0,10" />
            <Grid Margin="0,0,0,5">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <TextBox Grid.Column="0" PlaceholderText="+7" FontSize="18" BorderThickness="0,0,0,2" BorderBrush="#979797" Background="Transparent" IsReadOnly="True" Margin="0,0,10,0" Template="{StaticResource DefaultTextBoxStyle}"/>
                <TextBox x:Name="UserPhoneNumberInput" Grid.Column="1" IsTextPredictionEnabled="False" IsSpellCheckEnabled="False" PlaceholderText="777 123 12 12" FontSize="18" BorderThickness="0,0,0,2" BorderBrush="#979797" MaxLength="10" Background="Transparent" InputScope="TelephoneNumber" Template="{StaticResource DefaultTextBoxStyle}" TextChanged="UserPhoneNumberInput_TextChanged" />
            </Grid>
            <TextBlock x:Name="HintText" TextWrapping="WrapWholeWords" Foreground="#979797" TextAlignment="Center">
                Ваш телефон будет использоваться в качестве номера кошелька
            </TextBlock>
        </StackPanel>
    </Grid>
    <Button x:Name="NextStepButton" Grid.Row="2" IsEnabled="False" Content="Далее" VerticalAlignment="Bottom" Style="{StaticResource WideGreenButtonStyle}" Click="NextStepButton_Click" />
</Grid>

And here is my C# code for button click event

private void NextStepButton_Click(object sender, RoutedEventArgs e)
    {
        if (!UserPhoneNumberInput.Text.All(Char.IsDigit) || UserPhoneNumberInput.Text.Length == 0)
        {
            NotifyUser.ShowWrongPhoneNumberFormatMessage();
            return;
        }

        phoneNumber = Helpers.FormatNumber(UserPhoneNumberInput.Text);

        // Activate the ContentLoading ring
        LoadingGrid.Visibility = Visibility.Visible;
        LoadingGrid.IsProgressRingActive = true;

        CheckNumber(phoneNumber);
    }

And here, if it is important the XAML of my "LoadingGrid"

<Grid x:Name="LayoutRoot" Background="#CC000000">
    <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center">
        <ProgressRing x:Name="ProgressRing" Width="50" Height="50" Foreground="White" IsActive="{x:Bind IsProgressRingActive, Mode=TwoWay}" />
        <TextBlock x:Name="OperationTitle" Text="{x:Bind TitleOfOperation, Mode=TwoWay}" TextAlignment="Center" FontSize="18" Foreground="White" Margin="0,20,0,0" />
    </StackPanel>
</Grid>

Upvotes: 0

Views: 1607

Answers (1)

Vitaly
Vitaly

Reputation: 346

That's by design.

When you click your NextStepButton button, the UserPhoneNumberInput TextBox loses its focus and then the keyboard disappears automatically. Most likely, but depending on your custom layout templates, the NextStepButton just slightly moves down as well. And when you release your mouse button (assuming you're using an emulator), the NextStepButton is not there at that moment. That's why it does not trigger the Click event. As you know, the default ClickMode for buttons is ClickMode.Release. I had the exact same issue recently.

You can try adding IsTabStop="False" to your button properties to work around this behavior.

Upvotes: 3

Related Questions