同梱スキン - テンキー.xaml

トグルボタンでの２面切り替えサンプル
数字入力の機会があまりないので 使い勝手が良いかどうかはわかりません
キーボードのFnキーのような機能は ボタンを２つ用意して表示非表示を切り替えるのが簡単で作りやすいです

<!--  zeKey skinfile  https://ze-key.blogspot.jp/  -->
<z:Keyboard xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:z="clr-namespace:zeKey.Skin;assembly=zeKey"
            Width="320"
            Height="400"
            z:DragMoveBehavior.CanMove="True"
            FontFamily="Yu Gothic UI"
            FontWeight="Bold">
  <z:Keyboard.SkinInfo>
    <z:SkinInfo Title="テンキー(標準電卓風)"
                Author="T.Naga"
                License="改変自由"
                Version="1.0.0">
      <z:SkinInfo.Information>
        <TextBlock TextWrapping="Wrap">
          テンキー＋α 標準電卓風な見た目にしてみました<Run Text="&#10;" />
          使い方:<Run Text="&#10;" />
          Fnトグルキー押し込みでNumLock＋α<Run Text="&#10;" />
          通常状態の右クリックで Fn状態のキーが打てます（見えないので覚える他ないですが）<Run Text="&#10;" />
          Fn状態の右クリックに Shift動作や類似キーがついているものがあります<Run Text="&#10;" />
          <LineBreak />
          注意:<Run Text="&#10;" />
          ・Fnキーは実際にはNumLockキーではありません 他のキーもテンキーではありません
          そのため(リアル)キーボードのNumLock状態の影響は受けませんが テンキーを期待しているアプリでは動作しません<Run Text="&#10;" />
          <LineBreak />
          詳しい説明は
          <z:Hyperlink NavigateUri="https://ze-key.blogspot.jp/">ブログ</z:Hyperlink>
          を参照してください
        </TextBlock>
      </z:SkinInfo.Information>
    </z:SkinInfo>
  </z:Keyboard.SkinInfo>
  <z:Keyboard.Resources>
    <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
    <SolidColorBrush x:Key="キーボード 背景" Color="#FFF2F2F2" />
    <SolidColorBrush x:Key="キーボード 枠" Color="Black" />
    <SolidColorBrush x:Key="キーボード 枠ＩＭＥオン" Color="Red" />
    <SolidColorBrush x:Key="キー 背景" Color="#FFE6E6E6" />
    <SolidColorBrush x:Key="キー 押し込み" Color="#FFB8B8B8" />
    <SolidColorBrush x:Key="キー マウスオーバー" Color="#FFCFCFCF" />
    <SolidColorBrush x:Key="文字" Color="Black" />
    <ControlTemplate x:Key="Button">
      <Grid>
        <Rectangle Fill="{TemplateBinding Background}" />
        <Viewbox Stretch="Uniform">
          <TextBlock>
            <TextBlock.Style>
              <Style TargetType="{x:Type TextBlock}">
                <Setter Property="Margin" Value="12,8" />
                <Setter Property="Foreground" Value="{Binding Foreground, RelativeSource={RelativeSource TemplatedParent}}" />
                <Setter Property="Text" Value="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" />
              </Style>
            </TextBlock.Style>
          </TextBlock>
        </Viewbox>
      </Grid>
    </ControlTemplate>
 
    <Style TargetType="{x:Type ButtonBase}">
      <Setter Property="Background" Value="{DynamicResource キー 背景}" />
      <Setter Property="Template" Value="{StaticResource Button}" />
      <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
          <Setter Property="Background" Value="{DynamicResource キー マウスオーバー}" />
        </Trigger>
        <Trigger Property="IsPressed" Value="True">
          <Setter Property="Background" Value="{DynamicResource キー 押し込み}" />
        </Trigger>
        <Trigger Property="ToggleButton.IsChecked" Value="True">
          <Setter Property="Background" Value="{DynamicResource キー 押し込み}" />
        </Trigger>
      </Style.Triggers>
    </Style>
    <Style BasedOn="{StaticResource {x:Type ButtonBase}}" TargetType="{x:Type z:LRRepeatButton}" />
    <Style BasedOn="{StaticResource {x:Type ButtonBase}}" TargetType="{x:Type ToggleButton}" />
 
    <Style x:Key="CloseButton" TargetType="{x:Type Button}">
      <Setter Property="Background" Value="Transparent" />
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate>
            <Grid>
              <Rectangle Fill="{Binding Background, RelativeSource={RelativeSource TemplatedParent}}" />
              <Path Width="12"
                    Height="12"
                    Data="M0,0 L12,12 M0,12 L12,0"
                    Stretch="Fill"
                    Stroke="{Binding Foreground,
                                     RelativeSource={RelativeSource TemplatedParent}}"
                    StrokeThickness="1" />
            </Grid>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
      <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
          <Setter Property="Foreground" Value="White" />
          <Setter Property="Background" Value="#FFE81123" />
        </Trigger>
      </Style.Triggers>
    </Style>
  </z:Keyboard.Resources>
  <Grid>
    <Rectangle Fill="{DynamicResource キーボード 背景}" StrokeThickness="1">
      <Rectangle.Style>
        <Style TargetType="{x:Type Rectangle}">
          <Setter Property="Stroke" Value="{DynamicResource キーボード 枠}" />
          <Style.Triggers>
            <DataTrigger Binding="{Binding ModeKeys.ImeLock}" Value="true">
              <Setter Property="Stroke" Value="{DynamicResource キーボード 枠ＩＭＥオン}" />
            </DataTrigger>
          </Style.Triggers>
        </Style>
      </Rectangle.Style>
    </Rectangle>
    <Button Width="46"
            Height="30"
            Margin="1"
            HorizontalAlignment="Right"
            VerticalAlignment="Top"
            Command="{Binding CloseCommand}"
            Style="{StaticResource CloseButton}" />
    <ToggleButton x:Name="Toggle"
                  Width="{Binding ActualWidth,
                                  ElementName=SpacerBtn}"
                  Height="{Binding ActualHeight,
                                   ElementName=SpacerBtn}"
                  Margin="10,40,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top"
                  Content="Fn"
                  Focusable="False" />
    <!--  表  -->
    <Grid Margin="10,40,10,10">
      <Grid.Style>
        <Style TargetType="{x:Type Grid}">
          <Style.Triggers>
            <DataTrigger Binding="{Binding IsChecked, ElementName=Toggle}" Value="True">
              <Setter Property="Visibility" Value="Hidden" />
            </DataTrigger>
          </Style.Triggers>
        </Style>
      </Grid.Style>
      <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
        <RowDefinition />
        <RowDefinition />
        <RowDefinition />
      </Grid.RowDefinitions>
      <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
        <ColumnDefinition />
        <ColumnDefinition />
      </Grid.ColumnDefinitions>
      <ToggleButton Name="SpacerBtn" Visibility="Hidden" />
      <z:LRRepeatButton Grid.Column="1"
                        Content="/"
                        TypeKey="OemQuestion">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="LeftShift">
            <z:TypeKeys TypeKey="D8" />
          </z:TypeKeys>
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Column="2" Content="*">
        <z:LRRepeatButton.LeftTypeKeys>
          <z:TypeKeys TypeKey="LeftShift">
            <z:TypeKeys TypeKey="Oem1" />
          </z:TypeKeys>
        </z:LRRepeatButton.LeftTypeKeys>
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="LeftShift">
            <z:TypeKeys TypeKey="D9" />
          </z:TypeKeys>
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Column="3"
                        Content="⌫"
                        TypeKey="Backspace">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="Delete" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="1"
                        Content="7"
                        TypeKey="D7">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="Home" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="1"
                        Grid.Column="1"
                        Content="8"
                        TypeKey="D8">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="Up" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="1"
                        Grid.Column="2"
                        Content="9"
                        TypeKey="D9">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="PageUp" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="1"
                        Grid.Column="3"
                        Content="-"
                        TypeKey="OemMinus">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="Oem5" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="2"
                        Content="4"
                        TypeKey="D4">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="Left" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="2"
                        Grid.Column="1"
                        Content="5"
                        TypeKey="D5" />
      <z:LRRepeatButton Grid.Row="2"
                        Grid.Column="2"
                        Content="6"
                        TypeKey="D6">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="Right" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="2"
                        Grid.Column="3"
                        Content="+">
        <z:LRRepeatButton.LeftTypeKeys>
          <z:TypeKeys TypeKey="LeftShift">
            <z:TypeKeys TypeKey="OemPlus" />
          </z:TypeKeys>
        </z:LRRepeatButton.LeftTypeKeys>
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="LeftShift">
            <z:TypeKeys TypeKey="D5" />
          </z:TypeKeys>
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="3"
                        Content="1"
                        TypeKey="D1">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="End" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="3"
                        Grid.Column="1"
                        Content="2"
                        TypeKey="D2">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="Down" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="3"
                        Grid.Column="2"
                        Content="3"
                        TypeKey="D3">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="pageDown" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="3"
                        Grid.RowSpan="2"
                        Grid.Column="3"
                        Content="⏎"
                        TypeKey="Return">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="LeftShift">
            <z:TypeKeys TypeKey="OemMinus" />
          </z:TypeKeys>
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="4"
                        Grid.ColumnSpan="2"
                        Content="0"
                        TypeKey="D0">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="Space" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="4"
                        Grid.Column="2"
                        Content="."
                        TypeKey="OemPeriod">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="OemComma" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
    </Grid>
    <!--  裏  -->
    <Grid Margin="10,40,10,10" Visibility="{Binding IsChecked, Converter={StaticResource BooleanToVisibilityConverter}, ElementName=Toggle}">
      <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
        <RowDefinition />
        <RowDefinition />
        <RowDefinition />
      </Grid.RowDefinitions>
      <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
        <ColumnDefinition />
        <ColumnDefinition />
      </Grid.ColumnDefinitions>
      <z:LRRepeatButton Grid.Column="1" Content="(">
        <z:LRRepeatButton.LeftTypeKeys>
          <z:TypeKeys TypeKey="LeftShift">
            <z:TypeKeys TypeKey="D8" />
          </z:TypeKeys>
        </z:LRRepeatButton.LeftTypeKeys>
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="OemOpenBrackets" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Column="2" Content=")">
        <z:LRRepeatButton.LeftTypeKeys>
          <z:TypeKeys TypeKey="LeftShift">
            <z:TypeKeys TypeKey="D9" />
          </z:TypeKeys>
        </z:LRRepeatButton.LeftTypeKeys>
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="OemCloseBrackets" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Column="3"
                        Content="⌦"
                        TypeKey="Delete">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="Backspace" />
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="1"
                        Content="↖"
                        TypeKey="Home" />
      <z:LRRepeatButton Grid.Row="1"
                        Grid.Column="1"
                        Content="↑"
                        TypeKey="Up" />
      <z:LRRepeatButton Grid.Row="1"
                        Grid.Column="2"
                        Content="⇞"
                        TypeKey="PageUp">
        <z:LRRepeatButton.RightTypeKeys>
          <z:TypeKeys TypeKey="LeftShift">
            <z:TypeKeys TypeKey="PageUp" />
          </z:TypeKeys>
        </z:LRRepeatButton.RightTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="1"
                        Grid.Column="3"
                        Content="\">
        <z:LRRepeatButton.LeftTypeKeys>
          <z:TypeKeys TypeKey="Oem5" />
        </z:LRRepeatButton.LeftTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="2"
                        Content="←"
                        TypeKey="Left" />
      <z:LRRepeatButton Grid.Row="2"
                        Grid.Column="2"
                        Content="→"
                        TypeKey="Right" />
      <z:LRRepeatButton Grid.Row="2"
                        Grid.Column="3"
                        Content="%">
        <z:LRRepeatButton.LeftTypeKeys>
          <z:TypeKeys TypeKey="LeftShift">
            <z:TypeKeys TypeKey="D5" />
          </z:TypeKeys>
        </z:LRRepeatButton.LeftTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="3"
                        Content="↘"
                        TypeKey="End" />
      <z:LRRepeatButton Grid.Row="3"
                        Grid.Column="1"
                        Content="↓"
                        TypeKey="Down" />
      <z:LRRepeatButton Grid.Row="3"
                        Grid.Column="2"
                        Content="⇟"
                        TypeKey="PageDown" />
      <z:LRRepeatButton Grid.Row="3"
                        Grid.RowSpan="2"
                        Grid.Column="3"
                        Content="=">
        <z:LRRepeatButton.LeftTypeKeys>
          <z:TypeKeys TypeKey="LeftShift">
            <z:TypeKeys TypeKey="OemMinus" />
          </z:TypeKeys>
        </z:LRRepeatButton.LeftTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="4"
                        Grid.ColumnSpan="2"
                        Content="␣">
        <z:LRRepeatButton.LeftTypeKeys>
          <z:TypeKeys TypeKey="Space" />
        </z:LRRepeatButton.LeftTypeKeys>
      </z:LRRepeatButton>
      <z:LRRepeatButton Grid.Row="4"
                        Grid.Column="2"
                        Content=",">
        <z:LRRepeatButton.LeftTypeKeys>
          <z:TypeKeys TypeKey="OemComma" />
        </z:LRRepeatButton.LeftTypeKeys>
      </z:LRRepeatButton>
    </Grid>
    <z:ResizeGrip>
      <z:ResizeGrip.Style>
        <Style TargetType="{x:Type z:ResizeGrip}">
          <Setter Property="Template">
            <Setter.Value>
              <ControlTemplate>
                <Grid Background="#01FFFFFF">
                  <Canvas Width="10"
                          Height="10"
                          Margin="4">
                    <Path Data="M 0,8L 2,8L 2,10L 0,10L 0,8 Z M 8,0L 10,0L 10,2L 8,2L 8,0 Z M 8,4L 10,4L 10,6L 8,6L 8,4 Z M 8,8L 10,8L 10,10L 8,10L 8,8 Z M 4,8L 6,8L 6,10L 4,10L 4,8 Z M 4,4L 6,4L 6,6L 4,6L 4,4 Z " Fill="#FFBFBFBF" />
                  </Canvas>
                </Grid>
              </ControlTemplate>
            </Setter.Value>
          </Setter>
        </Style>
      </z:ResizeGrip.Style>
    </z:ResizeGrip>
  </Grid>
</z:Keyboard>