MESCIUS InputMan for ASP.NET 10.0J > InputMan for ASP.NETの使い方 > 日付時刻コントロール > ドロップダウン機能 > ドロップダウン数値パッド |
日付時刻コントロールには、数値入力に特化した簡易キーパッドをドロップダウン表示することが可能です。この章では、ドロップダウン数値パッドについて説明します。
(図)ドロップダウン数値パッド
書式を設定していて自由入力が許可されていない場合は、ピリオドおよび正負切り替えキーは無効となります。 |
数値パッドをカスタマイズするには、日付時刻コントロールのDropDownNumericPadプロパティが参照するDropDownNumericPadオブジェクトを使用します。 数値パッドでは、以下の基本的な外観設定が可能です。
Imports GrapeCity.Web.Input.IMDate Imports GrapeCity.Web.Input.IMCalculator ' ドロップダウンに数値パッドを指定します。 GcDateTime1.DropDown.DropDownType = DateDropDownType.NumericPad GcDateTime1.DropDown.DropDownShadow = True ' 外観スタイルと背景色を設定します。 GcDateTime1.DropDownNumericPad.FlatStyle = FlatStyle.Flat GcDateTime1.DropDownNumericPad.BackColor = System.Drawing.Color.Azure
using GrapeCity.Web.Input.IMDate; using GrapeCity.Web.Input.IMCalculator; // ドロップダウンに数値パッドを指定します。 GcDateTime1.DropDown.DropDownType = DateDropDownType.NumericPad; GcDateTime1.DropDown.DropDownShadow = true; // 外観スタイルと背景色を設定します。 GcDateTime1.DropDownNumericPad.FlatStyle = FlatStyle.Flat; GcDateTime1.DropDownNumericPad.BackColor = System.Drawing.Color.Azure;
数値パッドでは、ボタンの種類ごとに背景色と文字色を設定できます。設定可能なボタンの種類は以下のとおりです。
プロパティ | ボタンの種類 | キー |
---|---|---|
EditButtons | 編集ボタン | <, >, |
NumericButtons | 数値ボタン | 0〜9, +/-, .(ピリオド) |
Imports GrapeCity.Web.Input.IMDate ' ドロップダウンに数値パッドを指定します。 GcDateTime1.DropDown.DropDownType = DateDropDownType.NumericPad ' 数値ボタンのスタイルを設定します。 GcDateTime1.DropDownNumericPad.NumericButtons.BackColor = System.Drawing.Color.LightBlue GcDateTime1.DropDownNumericPad.NumericButtons.ForeColor = System.Drawing.Color.Blue ' 編集ボタンのスタイルを設定します。 GcDateTime1.DropDownNumericPad.EditButtons.BackColor = System.Drawing.Color.Beige GcDateTime1.DropDownNumericPad.EditButtons.ForeColor = System.Drawing.Color.DarkRed
using GrapeCity.Web.Input.IMDate; // ドロップダウンに数値パッドを指定します。 GcDateTime1.DropDown.DropDownType = DateDropDownType.NumericPad; // 数値ボタンのスタイルを設定します。 GcDateTime1.DropDownNumericPad.NumericButtons.BackColor = System.Drawing.Color.LightBlue; GcDateTime1.DropDownNumericPad.NumericButtons.ForeColor = System.Drawing.Color.Blue; // 編集ボタンのスタイルを設定します。 GcDateTime1.DropDownNumericPad.EditButtons.BackColor = System.Drawing.Color.Beige; GcDateTime1.DropDownNumericPad.EditButtons.ForeColor = System.Drawing.Color.DarkRed;
Imports GrapeCity.Web.Input.IMDate Imports GrapeCity.Web.Input.IMCalculator ' ドロップダウンに数値パッドを指定します。 GcDateTime1.DropDown.DropDownType = DateDropDownType.NumericPad ' 数値ボタンのスタイルを設定します。 Dim nStyle As New CalculatorButtonStyle() nStyle.BackColor = System.Drawing.Color.LightBlue nStyle.ForeColor = System.Drawing.Color.Blue GcDateTime1.DropDownNumericPad.SetButtonStyle(KeyGroups.NumKeys, nStyle) ' 編集ボタンのスタイルを設定します。 Dim eStyle As New CalculatorButtonStyle() eStyle.BackColor = System.Drawing.Color.Beige eStyle.ForeColor = System.Drawing.Color.DarkRed GcDateTime1.DropDownNumericPad.SetButtonStyle(KeyGroups.EditKeys, eStyle)
using GrapeCity.Web.Input.IMDate; using GrapeCity.Web.Input.IMCalculator; // ドロップダウンに数値パッドを指定します。 GcDateTime1.DropDown.DropDownType = DateDropDownType.NumericPad; // 数値ボタンのスタイルを設定します。 CalculatorButtonStyle nStyle = new CalculatorButtonStyle(); nStyle.BackColor = System.Drawing.Color.LightBlue; nStyle.ForeColor = System.Drawing.Color.Blue; GcDateTime1.DropDownNumericPad.SetButtonStyle(KeyGroups.NumKeys, nStyle); // 編集ボタンのスタイルを設定します。 CalculatorButtonStyle eStyle = new CalculatorButtonStyle(); eStyle.BackColor = System.Drawing.Color.Beige; eStyle.ForeColor = System.Drawing.Color.DarkRed; GcDateTime1.DropDownNumericPad.SetButtonStyle(KeyGroups.EditKeys, eStyle);
window.onload = function() { var numPad = FindIMControl("GcDateTime1).GetDropDownNumericPad(); numPad.SetAlign("right"); numPad.SetBackColor("aliceblue"); };