スピンボタンの最適化

ここでは、タッチデバイスで操作しやすいようにサイドボタンやシンボルボタンにスピン機能を割り当て、タッチ操作に最適化したスピン機能を実装する方法について解説します。

この機能はタッチ操作だけでなく、マウスやキーボードによる操作でも利用できます。

コントロールのスピン機能

マスク、日付時刻、日付、時刻、タイムスパン、数値、コンボコントロールで使用可能なスピン機能は、サイドボタンにSpinButton （スピンボタン）を追加することで実現可能ですが、スピンボタンはマウスによる操作を前提としたボタンの大きさや配置となっており、タッチ操作には適していません。

（図）スピンボタン

InputMan では、SideButton （サイドボタン）やSymbolButton （シンボルボタン）を使用して、タッチ操作しやすいボタンをカスタマイズする機能を提供します。サイドボタンやシンボルボタンを使用すると、タッチしやすいボタンの大きさを提供でき、またボタンを水平に隣接したり、コントロールの両端に配置することも可能です。

これらのボタンにスピン機能を設定する手順は以下のとおりです。

コントロールにサイドボタンあるいはシンボルボタンを2つ追加します。
各ボタンにスピン機能を割り当てます。一つのボタンにはスピンアップ機能を、もう一つにはスピンダウン機能を設定します。
必要に応じて、Position プロパティによりボタンの配置を設定します。
必要に応じて、ボタンに表示するテキストやシンボル、あるいは画像などを設定します。

各ボタンの詳細な設定については、次項以降を参照してください。

（図）スピン機能を割り当てたサイドボタンの例

（図）スピン機能を割り当てたシンボルボタンの例

各コントロールのスピン機能やサイドボタンの詳細については、それぞれ下記のページを参照してください。

マスクコントロール - サイドボタンの設定
日付時刻（日付、時刻）コントロール - サイドボタンの設定
タイムスパンコントロール - サイドボタンの設定
数値コントロール - サイドボタンの設定
コンボ（マスクコンボ）コントロール - サイドボタンの設定

サイドボタンを利用

ボタンに「＋」「－」といった任意のテキストや画像を設定したい場合は、SideButton（サイドボタン）を使用します。サイドボタンにスピン機能を割り当てるには、Behavior プロパティを使用します。また、Behavior プロパティに設定した値により、Interval プロパティとText プロパティの初期値が自動的に変更されます。

Behavior プロパティに設定可能な値は以下の通りです。

Behaviorの値	説明	Interval プロパティの初期値	Text プロパティの初期値
None	スピン動作を割り当てません。	0	なし
SpinUp	スピンアップ（値を増加）の動作を割り当てます。	60	"+"
SpinDown	スピンダウン（値を減少）の動作を割り当てます。	60	"-"

以下のサンプルコードは、数値コントロールにスピン機能を割り当てたサイドボタンを追加する例です。コントロールの左端にスピンダウン機能を持つボタン、右端にスピンアップ機能を持つボタンを設定します。

Visual Basic
C#

Imports GrapeCity.Win.Editors

Private Sub Form1_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
    ' 数値コントロールのサイドボタンをクリアします。
    GcNumber1.SideButtons.Clear()
    
    ' スピンダウン機能を持つサイドボタンを設定します。
    Dim DownButton As New SideButton()
    DownButton.Behavior = SideButtonBehavior.SpinDown
    DownButton.Position = ButtonPosition.LeftInside
    
    ' 数値コントロールにサイドボタンを追加します。
    GcNumber1.SideButtons.Add(DownButton)

    ' スピンアップ機能を持つサイドボタンを設定します。
    Dim UpButton As New SideButton()
    UpButton.Behavior = SideButtonBehavior.SpinUp
    
    ' 数値コントロールにサイドボタンを追加します。
    GcNumber1.SideButtons.Add(UpButton)
End Sub

using GrapeCity.Win.Editors;

private void Form1_Load(object sender, EventArgs e)
{
    // 数値コントロールのサイドボタンをクリアします。
    gcNumber1.SideButtons.Clear();
    
    // スピンダウン機能を持つサイドボタンを設定します。
    SideButton DownButton = new SideButton();
    DownButton.Behavior = SideButtonBehavior.SpinDown;
    DownButton.Position = ButtonPosition.LeftInside;
    
    // 数値コントロールにサイドボタンを追加します。
    gcNumber1.SideButtons.Add(DownButton);

    // スピンアップ機能を持つサイドボタンを設定します。
    SideButton UpButton = new SideButton();
    UpButton.Behavior = SideButtonBehavior.SpinUp;
    
    // 数値コントロールにサイドボタンを追加します。
    gcNumber1.SideButtons.Add(UpButton);
}

シンボルボタンを利用

ボタンに提供されたイメージを設定したい場合は、SymbolButton（シンボルボタン）を使用します。シンボルボタンにスピン機能を割り当てるには、Behavior プロパティを使用します。また、Behavior プロパティに設定した値により、Interval プロパティ、Symbol プロパティおよびSymbolDirection プロパティの初期値が自動的に変更されます。

Behavior プロパティに設定可能な値は以下の通りです。

Behaviorの値	説明	Interval プロパティの初期値	Symbol プロパティの初期値	SymbolDirection プロパティの初期値
None	スピン動作を割り当てません。	0	None	Left
SpinUp	スピンアップ（値を増加）の動作を割り当てます。	60	Arrow	Up
SpinDown	スピンダウン（値を減少）の動作を割り当てます。	60	Arrow	Down

以下のサンプルコードは、日付コントロールにスピン機能を割り当てたシンボルボタンで実装する例です。コントロールの左端にスピンダウン機能を持つボタン、右端にスピンアップ機能を持つボタンを設定します。

Visual Basic
C#

Imports GrapeCity.Win.Editors

Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
    ' 日付コントロールのサイドボタンをクリアします。
    GcDate1.SideButtons.Clear()
    
    ' スピンダウン機能を持つシンボルボタンを設定します。
    Dim DownButton As New SymbolButton()
    DownButton.Behavior = SideButtonBehavior.SpinDown
    DownButton.Position = ButtonPosition.LeftInside
    
    ' 日付コントロールにシンボルボタンを追加します。
    GcDate1.SideButtons.Add(DownButton)

    ' スピンアップ機能を持つシンボルボタンを設定します。
    Dim UpButton As New SymbolButton()
    UpButton.Behavior = SideButtonBehavior.SpinUp
    
    ' 日付コントロールにシンボルボタンを追加します。
    GcDate1.SideButtons.Add(UpButton)
End Sub

using GrapeCity.Win.Editors;

private void Form1_Load(object sender, EventArgs e)
{
    // 日付コントロールのサイドボタンをクリアします。
    gcDate1.SideButtons.Clear();

    // スピンダウン機能を持つシンボルボタンを設定します。
    SymbolButton DownButton = new SymbolButton();
    DownButton.Behavior = SideButtonBehavior.SpinDown;
    DownButton.Position = ButtonPosition.LeftInside;

    // 日付コントロールにシンボルボタンを追加します。
    gcDate1.SideButtons.Add(DownButton);

    // スピンアップ機能を持つシンボルボタンを設定します。
    SymbolButton UpButton = new SymbolButton();
    UpButton.Behavior = SideButtonBehavior.SpinUp;

    // 日付コントロールにシンボルボタンを追加します。
    gcDate1.SideButtons.Add(UpButton);
}

参照