WPF编游戏系列 之八 银行界面及金额校验

原文:WPF编游戏系列 之八 银行界面及金额校验

       在前面《WPF编游戏系列 之四 用户控件》一文中通过用户控件创建了“My Shop”中物品列表框。本篇继续使用用户控件创建银行界面，并在用户进行存钱操作时对其输入金额的有效性进行校验。

1. 在创建好控件BankElement.xaml后，将XAML代码填入其中：

<Grid>
  <Border BorderThickness="3" CornerRadius="5"
          Background="#CEE4E5" BorderBrush="#0C7D42">
    <StackPanel Orientation="Vertical" Margin="5"
                HorizontalAlignment="Center">
        <Image Height="80" Width="80" Margin="5" 
               Source="{Binding BankImage}"></Image>
        <TextBlock Name="bankCash" Margin="5" 
                   Text="{Binding BankCash}"></TextBlock>
        <TextBlock Name="bankInterest" Margin="5" 
                   Text="{Binding BankInterest}"></TextBlock>
        <TextBlock Name="transferInfo" Margin="5"></TextBlock>
        <StackPanel Orientation="Horizontal">
           <TextBox Name="cashTransfer" Margin="5" Width="100"></TextBox>
           <Image Name="transImage" Source="image/trans.png"
                  Cursor="Hand" Width="20" Height="20"></Image>
        </StackPanel>
    </StackPanel>
  </Border>
</Grid>

样式及效果图如下：

2. 当用户在TextBox中输入金额后，首先需要对该数据进行两方面校验：a. 录入金额是否为数字，b. 录入金额是否超出当前总金额，之后再对相应结果进行处理。

private void saveCashImage_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
   Image transferImage = sender as Image;
   //查找输入金额的TextBox
   object findCashTextBox = queryGrid.FindName("saveCash");
   TextBox saveCashInput = findCashTextBox as TextBox;
   //查找反馈结果的TextBlock
   object findCashTextBlock = queryGrid.FindName("saveCashInfo");
   TextBlock saveCashInfo = findCashTextBlock as TextBlock;
   //当前总金额（$750）
   int remainAmount = Convert.ToInt32(transferImage.Tag.ToString());
   //存入金额
   int transAmount;
   //判断saveCashInput是否为数字，否则transAmout为0
   int.TryParse(saveCashInput.Text, out transAmount);
   //如果transAmout为0，则说明输入的数据有误，当然也包括本身输入的就是0
   if (transAmount == 0)
   {
      saveCashInfo.Text = "Not vaild number";
   }
   else
   {
      //如果超出当前总金额…
      if (transAmount > remainAmount)
     {
        saveCashInfo.Text = "No enough cash";
     }
     else
     {
        //可以将Money存入银行了
      }
   }
}

3. 错误提示效果图：

              

待续 … …