前言
用户界面的易用性和交互性变得越来越重要，特别是在平板电脑和其他触摸屏设备上。对于WPF 应用程序来说，提供一个直观、响应迅速且用户体验良好的数字键盘是确保应用成功的关键因素之一。
本篇文章将介绍如何为WPF程序设计和实现一个专用于平板电脑等触摸屏设备的自定义数字小键盘。我们将分享一个实际使用的数字键盘界面案例，并探讨其背后的设计思路和技术细节。
本文帮助开大家更好地理解触摸屏小键盘的设计与实现，从而提升WPF应用程序的用户体验。
正文
WPF程序，用于平板时，一些输入数量的地方我们需要弹出小键盘输入，这个键盘可以调系统的，也可以自己写。
分享个我现在用的一个数字键盘界面。
<Window xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors" x:Class="NFMES.UI.Base.NumericKeyBoard"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
WindowStyle="None" Background="#FF333333" Title="NumericKeyBoard" ResizeMode="NoResize"
Height="400" Width="300" Deactivated="Window_Deactivated" FocusManager.FocusedElement="{Binding ElementName=btn}">
<Window.Resources>
<Style TargetType="{x:Type Button}">
<Setter Property="FontSize" Value="35" />
<Setter Property="Margin" Value="3"/>
</Style>
</Window.Resources>
<Grid FocusManager.FocusedElement="{Binding ElementName=btn}">
<Grid.RowDefinitions>
<RowDefinition Height="0.2*"/>
<RowDefinition Height="0.8*"/>
</Grid.RowDefinitions>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="2*"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>
<dxe:TextEdit x:Name="txtValue" Background="DarkGray" BorderThickness="2" BorderBrush="Black" FontSize="30" HorizontalContentAlignment="Right"/>
<Button Grid.Column="1" Click="Button_Click" >
<!--<Button.Background>
<ImageBrush ImageSource="返回2.png" Stretch="Fill"/>
</Button.Background>-->
<Image Source="前进.png" />
</Button>
</Grid>
<Grid Grid.Row="1" Button.Click="Grid_Click" FocusManager.FocusedElement="{Binding ElementName=btn}">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Button x:Name="btn" Content="1" />
<Button Content="2" Grid.Row="0" Grid.Column="1"/>
<Button Content="3" Grid.Row="0" Grid.Column="2"/>
<Button Content="4" Grid.Row="1" Grid.Column="0"/>
<Button Content="5" Grid.Row="1" Grid.Column="1"/>
<Button Content="6" Grid.Row="1" Grid.Column="2"/>
<Button Content="7" Grid.Row="2" Grid.Column="0"/>
<Button Content="8" Grid.Row="2" Grid.Column="1"/>
<Button Content="9" Grid.Row="2" Grid.Column="2"/>
<Button Content="." Grid.Row="3" Grid.Column="0"/>
<Button Content="0" Grid.Row="3" Grid.Column="1"/>
<Button x:Name="Back" Grid.Row="3" Grid.Column="2">
<!--<Button.Background>
<ImageBrush ImageSource="返回1.png" Stretch="Fill"/>
</Button.Background>-->
<Image Source="返回1.png" />
</Button>
</Grid>
</Grid>
</Window>
后台cs文件代码：
using DevExpress.Xpf.Editors;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;
namespace NFMES.UI.Base
{
/// <summary>
/// NumericKeyBoard.xaml 的交互逻辑
/// </summary>
public partial class NumericKeyBoard : Window
{
private static SpinEdit _SpinEdit;
private static NumericKeyBoard _NumericKeyBoard;
public NumericKeyBoard(SpinEdit spinEdit)
{
InitializeComponent();
_SpinEdit = spinEdit;
}
private void Window_Deactivated(object sender, EventArgs e)
{
// this.Hide();
}
private void Grid_Click(object sender, RoutedEventArgs e)
{
try
{
Button btn = e.OriginalSource as Button;
if (btn.Name == "Back")
{
txtValue.Text = txtValue.Text.Substring(0, txtValue.Text.Length-1);
}
else
{
txtValue.Text += btn.Content;
}
}
catch
{
}
}
private void Button_Click(object sender, RoutedEventArgs e)
{
_SpinEdit.Text = (txtValue.Text.Length==0?"0":txtValue.Text);
this.Close();
}
}
}
当然触摸屏上也可以直接调用系统键盘。
System.Diagnostics.Process.Start(@"C:\Windows\System32\osk.exe");
有时候因为权限问题，不可以直接调用系统盘下面的键盘。我们可以将osk.exe拷贝到程序根目录下再调用。
总结
本文详细介绍了为WPF应用程序创建触摸友好型数字键盘的方法，不仅提供了具体的XAML代码示例以开发界面，还提供了C#后台逻辑的实现方式。通过这种方式，我们可以确保在平板电脑或其他触摸屏设备上输入数值时，用户能够享受到流畅而直观的操作体验。
文章还提到，在某些情况下直接调用系统自带的屏幕键盘（OSK）可能遇到权限问题，因此建议可以考虑将osk.exe拷贝至应用程序目录下作为一种解决方案。
总的来说，本文不仅为大家提供了一个可直接使用的数字键盘实例，还分享了一些关于优化触摸屏输入体验的最佳实践。希望本文的内容能对正在寻找改进WPF应用用户体验方法的大家有所帮助。
最后
如果你觉得这篇文章对你有帮助，不妨点个赞支持一下！你的支持是我继续分享知识的动力。如果有任何疑问或需要进一步的帮助，欢迎随时留言。
也可以加入微信公众号 [DotNet技术匠] 社区，与其他热爱技术的同行一起交流心得，共同成长！
优秀是一种习惯，欢迎大家留言学习！
作者：liuyong111
出处：cnblogs.com/czly/p/9203582.html
声明：网络内容，仅供学习，尊重版权，侵权速删，歉意致谢！
