【Windowsストアアプリ】GridSplitter

Windowsストアアプリで画面を分割して分割幅を自由に移動させたいという要望があったのですが、WindowsストアアプリにはWPFのGridSplitterにあたるコントロールが標準で存在しないようでした。

Gridか何かでバーを作って、スワイプのイベントでサイズを制御するしかないかな~と思ってググっていたらCodePlexのWinRT XAML Toolkit内にCustomGridSplitterなるコントロールがありました。

WinRT XAML Toolkit(CodePlex)

NuGetパッケージマネージャコンソールなら利用対象のプロジェクトを開いて以下を叩けばOK。
PM> Install-Package winrtxamltoolkit

WinRT XAML Toolkitは以下のコントロールがあり、いろいろ役に立ちそうな雰囲気があります。

MITライセンスなので、商用利用も問題ナシ。

 

AlternativeFrame, AlternativePage
AnimatingContainer
CameraCaptureControl
CascadingTextBlock
Chart
CountdownControl
CustomAppBar
CustomGridSplitter
DelayedLoadControl
ImageButton
ImageToggleButton
InputDialog
ListItemButton
NumericUpDown
PieSlice
RingSlice
TreeView
ToolWindow
WatermarkTextBox
WebBrowser
WrapPanel

コントロール以外にもいろいろ便利機能がありそうなので、時間がある時にサンプルを動かしながら試してみたい感じです。

とりあえず今回の目的のCustomGridSplitterのサンプル。
といってもWPFと同じように置くだけ簡単。
分割バーをタッチして引っ張ればグリグリ動きます。

<Page
x:Class="SampleApp.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:cs="using:WinRTXamlToolkit.Controls"
xmlns:local="using:SampleApp"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

  <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="Auto"/>
      <ColumnDefinition Width="Auto"/>
      <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>

    <cs:CustomGridSplitter Grid.Column="1" />
  </Grid>
</Page>

 

今までほぼMicrosoft環境一本で来たので、Log4NETくらいは使ってきましたが、オープンソースのライブラリを利用するのにはまだ抵抗があります。
何かがあった時に自分で対処出来る技術力があれば良いのですけど。。