1

理解に苦しむこと: - 4 つのボタンのクリックをキャプチャし、4 桁の ATM デビット カードの PIN 番号を入力するのと同様に正しいシーケンスと一致するかどうかを確認する方法

私は WPF アプリケーションを持っていて、PIN パッド、数字 0 ～ 9、疑問符ボタン (ヘルプ ボタンとして使用)、バックスペース ボタン (間違った数字をクリックした場合)、TextBox を含む新しいウィンドウを追加しました。数字の代わりにドット (Wingdings - 文字 'l') を表示する top と、数字が正しい順序で入力されなかった場合に不正な PIN メッセージを表示する非表示の TextBlock です。とりあえず、4 桁の PIN (たとえば 7410) をハード コードするだけにします。これは、ボタン クリック シーケンスをキャプチャして検証する方法を学習することが主な目的だからです。Enter キー ボタンを使用しないので、最後の番号をクリックしてシーケンスが正しい場合はすぐに次のページに進みたいと思います。それ以外の場合は、PIN が正しくないという通知メッセージを表示します。

ボタンをクリックするたびに呼び出され、シーケンスを追跡し、4 つの数字すべてが正しい順序でクリックされるまで毎回ループバックして次のページに移動するメソッドが必要だと思います。うまく説明できていない場合は申し訳ありませんが、まだ学習中です。詳細が必要な場合は、できる限り詳しく説明します。

前もって感謝します。

以下は、PIN パッドの xaml コードです。

<Border BorderThickness="1" BorderBrush="Black">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="Auto" />
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>

        <Border Background="Black" Height="50" Grid.ColumnSpan="3" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
            <TextBlock x:Name="PINTextBlock" Foreground="White" FontSize="18" FontFamily="Wingdings" VerticalAlignment="Center" HorizontalAlignment="Center" MaxWidth="4" />
        </Border>

        <TextBlock x:Name="ErrorMessageTextBlock" Foreground="Red" Visibility="Collapsed" Grid.ColumnSpan="3" Grid.Row="1" />

        <StackPanel Orientation="Horizontal" Grid.Row="2">
            <Button x:Name="SevenButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="50" Height="50" Click="SevenButton_Click" TabIndex="9">
                <TextBlock Text="7" FontSize="24" FontWeight="Bold" />
            </Button>
            <Button x:Name="EightButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="50" Height="50" Click="EightButton_Click" TabIndex="10">
                <TextBlock Text="8" FontSize="24" FontWeight="Bold" />
            </Button>
            <Button x:Name="NineButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="50" Height="50" Click="NineButton_Click" TabIndex="11">
                <TextBlock Text="9" FontSize="24" FontWeight="Bold" />
            </Button>
        </StackPanel>

        <StackPanel Orientation="Horizontal" Grid.Row="3">
            <Button x:Name="FourButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="50" Height="50" Click="FourButton_Click" TabIndex="6">
                <TextBlock Text="4" FontSize="24" FontWeight="Bold" />
            </Button>
            <Button x:Name="FiveButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="50" Height="50" Click="FiveButton_Click" TabIndex="7">
                <TextBlock Text="5" FontSize="24" FontWeight="Bold" />
            </Button>
            <Button x:Name="SixButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="50" Height="50" Click="SixButton_Click" TabIndex="8">
                <TextBlock Text="6" FontSize="24" FontWeight="Bold" />
            </Button>
        </StackPanel>

        <StackPanel Orientation="Horizontal" Grid.Row="4">
            <Button x:Name="OneButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="50" Height="50" Click="OneButton_Click" TabIndex="3">
                <TextBlock Text="1" FontSize="24" FontWeight="Bold" />
            </Button>
            <Button x:Name="TwoButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="50" Height="50" Click="TwoButton_Click" TabIndex="4">
                <TextBlock Text="2" FontSize="24" FontWeight="Bold" />
            </Button>
            <Button x:Name="ThreeButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="50" Height="50" Click="ThreeButton_Click" TabIndex="5">
                <TextBlock Text="3" FontSize="24" FontWeight="Bold" />
            </Button>
        </StackPanel>

        <StackPanel Orientation="Horizontal" Grid.Row="5">
            <Button x:Name="QuestionMarkButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="50" Height="50" Click="QuestionMarkButton_Click" TabIndex="0">
                <TextBlock Text="?" FontSize="24" FontWeight="Bold" />
            </Button>
            <Button x:Name="ZeroButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="50" Height="50" Click="ZeroButton_Click" TabIndex="1">
                <TextBlock Text="0" FontSize="24" FontWeight="Bold" />
            </Button>
            <Button x:Name="BackspaceButton" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="50" Height="50" Click="BackspaceButton_Click" TabIndex="2">
                <TextBlock Text="Õ" FontFamily="Wingdings" FontSize="24" FontWeight="Bold" />
            </Button>
        </StackPanel>

    </Grid>
</Border>
4

3 に答える 3

1

Xamlとコンバーターを使用して検証を行うことができます。あなたがしなければならないのは;

  • ErrorTextBlockでバインディングを使用し、PinTextBlock.Textをリッスンして、実際の検証を行うコンバーターを実行します。

このようにして、検証ロジックが適切に分離され、再利用可能になります。他にもWPFに組み込まれた検証方法があり、それらについてグーグルで検索できます。（IDataErrorInfoおよびValidationRules）。これが「WPF」の方法になります。

しかし、学習曲線は少し急です。これを完了したいだけの場合は、はい、これをStackPanelに追加します：Button.Click = "buttonClickHandler"、コードビハインドでは、クリックしたすべてのボタンを1か所で受け取ります。そしてそこで計算を行います。

于 2012-09-18T15:16:13.457 に答える
1

ボタンがクリックされるたびに追加される (または の場合は変更されるBackspace)文字列があり、その文字列が 4 文字の長さで PIN # と等しい場合に検証を行います。Clear

4文字で一致したら次のページへ。4 文字で一致しない場合は、エラー メッセージを表示します。

これが学習アプリケーションであることは承知していますが、WPF を使用する場合は、MVVM デザイン パターンを学習することを強くお勧めします。

その場合、3 行 3 列の にセットされたList<KeyValuePair<string, ICommand>> Buttonsにバインドされる のようなものと、コンテンツを にバインドし、コマンドを にバインドするセット と、取得する値があります。エラー メッセージを表示する必要がある場合は常に true に設定します。ItemsControlItemsPanelTemplateUniformGridItemTemplateButtonKeyValuebool IsErrorDisplayed

<TextBlock x:Name="ErrorMessageTextBlock" Foreground="Red" 
           Visibility="{Binding IsErrorDisplayed, Converter={StaticResource BooleanToVisibiltyConverter}}" 
           Grid.ColumnSpan="3" Grid.Row="1" />

<ItemsControl ItemsSource="{Binding Buttons}">
    <!-- ItemsPanelTemplate -->
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <UniformGrid Columns="3" Rows="3" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>

    <!-- ItemTemplate -->
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Button Width="50" Height="50" Command="{Binding Value}">
                <TextBlock Text="{Binding Key}" FontSize="24" FontWeight="Bold" />
            </Button>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

また、PIN # を保護するために何かをするので、プレーンテキストとして保存されません。

于 2012-09-18T15:22:51.657 に答える
1

それらをすべて同じイベント ハンドラーに関連付けます。その場合、uselogic を使用して x:Name を整数に関連付け、4 桁の PIN を作成します。これにより、ロジックを統合できます。

        private void one_Click(object sender, RoutedEventArgs e)
        {
            Button btn = (Button)sender;
            Int32 num;
            switch (btn.Name)
            {
                case "one":
                    num = 1;
                    break;
                case "two":
                    num = 2;
                    break;
                default:
                    // problem
            }
            if (PIN > 1000)   // logic
            // now you have you have num and can deal with the logic in one click event;
            PIN = (PIN * 10) + num;
            if (PIN = correctPIN)
            {
            }
            else
            {
            }          
        }
于 2012-09-18T15:23:31.333 に答える