読者です 読者をやめる 読者になる 読者になる

かずきのBlog@hatena

日本マイクロソフトに勤めています。XAML + C#の組み合わせをメインに、たまにASP.NETやJavaなどの.NET系以外のことも書いています。掲載内容は個人の見解であり、所属する企業を代表するものではありません。

UWPで要素をソフトウェアキーボードに追従させる

UWP

雪猫さんのところでこんな感じのことをやってました。

[UWP] 要素をソフトウェアキーボードに追従させる | 雪猫ノート

こういう感じでUIに閉じた操作ならBehaviorのほうがいいかな?と思ったのでどんな感じなのかというのを。

using Microsoft.Xaml.Interactivity;
using Windows.UI.ViewManagement;
using Windows.UI.Xaml;

namespace App2
{
    public class InputPaneBehavior : DependencyObject, IBehavior
    {
        public DependencyObject AssociatedObject { get; private set; }

        private FrameworkElement AssociatedElement => this.AssociatedObject as FrameworkElement;

        public void Attach(DependencyObject associatedObject)
        {
            this.AssociatedObject = associatedObject;
            InputPane.GetForCurrentView().Showing += this.InputPaneBehavior_Showing;
            InputPane.GetForCurrentView().Hiding += this.InputPaneBehavior_Hiding;
        }

        public void Detach()
        {
            InputPane.GetForCurrentView().Showing -= this.InputPaneBehavior_Showing;
            InputPane.GetForCurrentView().Hiding -= this.InputPaneBehavior_Hiding;
        }

        private void InputPaneBehavior_Hiding(InputPane sender, InputPaneVisibilityEventArgs args)
        {
            this.AssociatedElement.Margin = new Thickness(0, 0, 0, sender.OccludedRect.Height);
        }

        private void InputPaneBehavior_Showing(InputPane sender, InputPaneVisibilityEventArgs args)
        {
            this.AssociatedElement.Margin = new Thickness(0, 0, 0, sender.OccludedRect.Height);
        }

    }
}

こんな感じのBehaviorを用意しておいて

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:local="using:App2"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
      xmlns:Core="using:Microsoft.Xaml.Interactions.Core"
      x:Class="App2.MainPage"
      mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <TextBox />
        <Grid Grid.Row="1">
            <Interactivity:Interaction.Behaviors>
                <local:InputPaneBehavior />
            </Interactivity:Interaction.Behaviors>
            <Button Content="OK" />
        </Grid>
    </Grid>
</Page>

こういう感じで使います。

因みに、CommandBarでいい気がするのですが、今のところCommandBarの上のボタンってソフトウェアキーボードが出てると押せなかったり押せたりと動作が不安定なんですよね…。