ASP.NET MVC コントロールヘルプ
ColorPicker クラス
ファイル
wijmo.input.js
モジュール
wijmo.input
基本クラス
Control
Show
   

ColorPicker コントロールには色チャネル(色相、彩度、明度、アルファ)を調整するパネルが表示され、ユーザーはこのパネルをクリックして色を選択できます。

現在選択されている色を取得または設定するには、value プロパティを使用します。

このコントロールは、InputColor コントロールのドロップダウンとして使用されます。

{@sample Input/InputColor/Overview/purejs デモ}

コンストラクタ

プロパティ

メソッド

イベント

コンストラクタ

constructor

constructor(element: any, options?: any): ColorPicker

ColorPickerクラスの新しいインスタンスを初期化します。

パラメーター
戻り値
ColorPicker

プロパティ

Static controlTemplate

ColorPickerコントロールのインスタンス化に使用されるテンプレートを取得または設定します。

any

hostElement

コントロールをホストしているDOM要素を取得します。

継承元
Control
HTMLElement

isDisabled

コントロールが無効かどうかを判定する値を取得または設定します。

無効化されたコントロールは、マウスイベントやキーボードイベントを取得できません。

継承元
Control
boolean

isTouching

現在、コントロールがタッチイベントを処理しているかどうかを示す値を取得します。

継承元
Control
boolean

isUpdating

コントロールが現在更新中かどうかを示す値を取得します。

継承元
Control
boolean

palette

パレットの色を含む配列を取得または設定します。

このパレットは10色で構成され、10個の文字列の配列によって表されます。

パレットの色ごとに、メインの色の明るいバージョンから暗いバージョンまでの6つのボタンが生成します。 これらの色ボタンをクリックすることで、必要な色を選択できます。

パレットをカスタマイズするには、色文字列の配列を指定します。 パレットには10色で構成され、最初の2色は通常、白と黒です。

10色を超えるパレット配列は切り捨てられ、色を表さない値を持つ配列は無視されます。 この場合、例外は発生しません。

string[]

rightToLeft

要素内のコントロールを右から左のレイアウトでホストするかどうかを示す値を取得します。

継承元
Control
boolean

showAlphaChannel

ユーザーがColorPicker を使用して色のアルファチャネル(透明度)を編集できるかどうかを示す値を取得または設定します。

このプロパティのデフォルト値は**true**です。

boolean

showColorString

ColorPicker に現在の色の文字列表現を表示するかどうかを示す値を取得または設定します。

このプロパティのデフォルト値は **false**です。

boolean

tabOrder

コントロールに関連付けられた**tabindex**属性の値を取得または設定します。

**tabindex**属性値は、コントロールのホストHTML要素で指定することにより、Wijmoコントロールに対して静的に定義できます。 ただし、Wijmoコントロールは複雑な構造であり、コントロールが正しく機能するには、この属性値を内部要素に伝達する必要がある場合があるため、この値をアプリケーションのライフサイクルの後半で変更することはできません。

そのため、コントロールの**tabindex**を動的に読み取ったり変更したりするには、このプロパティを使用して行う必要があります。

継承元
Control
number

value

現在選択されている色を取得または設定します。

このプロパティのデフォルト値は**「#ffffff」**(白)です。

このプロパティが色として解釈できない文字列に設定する場合、割り当てた値が無視されます。 この場合、例外は発生しません。

string

メソッド

addEventListener

addEventListener(target: EventTarget, type: string, fn: any, capture?: boolean, passive?: boolean): void

このControl が所有する要素にイベントリスナーを追加します。

コントロールは、アタッチされているリスナーとそのハンドラのリストを保持し、コントロールが破棄されているときにそれらを簡単に削除すること ができます(disposeremoveEventListener メソッドを参照してください)。

イベントリスナーを削除しないと、メモリリークが発生する可能があります。

デフォルトでは passive パラメータはfalseに設定されています。これはイベントハンドラが event.preventDefault() を呼び出すことを意味します。タッチイベントまたはマウスホイールイベントにpassiveハンドラを追加する場合は、このパラメータをtrueに設定するとアプリケーションのパフォーマンスが向上します。

passive イベントリスナーの詳細については、「<a target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Improving_scrolling_performance_with_passive_listeners">Improving scrolling performance with passive listeners</a>」を参考してください。

パラメーター
  • target: EventTarget

    Target element for the event.

  • type: string

    String that specifies the event.

  • fn: any

    Function to execute when the event occurs.

  • capture: boolean Optional

    Whether the listener should be handled by the control before it is handled by the target element.

  • passive: boolean Optional

    Indicates that the handler will never call preventDefault().

継承元
Control
戻り値
void

applyTemplate

applyTemplate(classNames: string, template: string, parts: Object, namePart?: string): HTMLElement

コントロールの新しいインスタンスにテンプレートを適用し、ルート要素を返します。

このメソッドはテンプレート化されたコントロールのコンストラクターによって呼び出される必要があります。テンプレートのパーツを対応するコントロールメンバにバインドする役割を持ちます。

以下のサンプルコードは、InputNumber コントロールのインスタンスにテンプレートを適用します。 このテンプレートには、'wj-part'属性が'input'、'btn-inc'、および'btn-dec'に設定された要素を含める必要があります。 コントロールのメンバである'_tbx'、'_btnUp'、'_btnDn'には、これらの要素への参照が割り当てられます。

```typescript this.applyTemplate('wj-control wj-inputnumber', templateString, { _tbx: 'input', _btnUp: 'btn-inc', _btnDn: 'btn-dec' }, 'input'); ``````

パラメーター
  • classNames: string

    Names of classes to add to the control's host element.

  • template: string

    An HTML string that defines the control template.

  • parts: Object

    A dictionary of part variables and their names.

  • namePart: string Optional

    Name of the part to be named after the host element. This determines how the control submits data when used in forms.

継承元
Control
戻り値
HTMLElement

beginUpdate

beginUpdate(): void

次に endUpdate が呼び出されるまで通知を中断します。

継承元
Control
戻り値
void

containsFocus

containsFocus(): boolean

このコントロールにフォーカスのある要素が含まれているかどうかをチェックします。

継承元
Control
戻り値
boolean

deferUpdate

deferUpdate(fn: Function): void

beginUpdate/endUpdateブロック内で関数を実行します。

この関数の実行が完了するまでコントロールは更新されません。 このメソッドは、関数が例外を生成した場合でもendUpdate が呼び出されるようにします。

パラメーター
継承元
Control
戻り値
void

dispose

dispose(): void

ホスト要素との関連付けを解除することによってコントロールを破棄します。

dispose メソッドは、addEventListener メソッドによって追加されたイベントリスナーを自動的に削除します。

コントロールを動的に作成および削除するアプリケーションでは、dispose メソッドを呼び出すことが重要です。コントロールを破棄しないと、メモリリークが発生する可能があります。

継承元
Control
戻り値
void

Static disposeAll

disposeAll(e?: HTMLElement): void

HTML要素に含まれるすべてのWijmoコントロールを破棄します。

パラメーター
継承元
Control
戻り値
void

endUpdate

endUpdate(): void

beginUpdate の呼び出しによって中断された通知を再開します。

継承元
Control
戻り値
void

focus

focus(): void

このコントロールにフォーカスを設定します。

継承元
Control
戻り値
void

Static getControl

getControl(element: any): Control

指定したDOM要素でホストされているコントロールを取得します。

パラメーター
  • element: any

    The DOM element that hosts the control, or a CSS selector for the host element (e.g. '#theCtrl').

継承元
Control
戻り値
Control

getTemplate

getTemplate(): string

コントロールのインスタンスの作成に使用されたHTMLテンプレートを取得します。

このメソッドは、クラス階層をさかのぼってコントロールのテンプレートを指定する最も近い祖先を探します。 たとえば、ComboBox コントロールのプロトタイプを指定した場合、 そのプロトタイプによってDropDown 基本クラスで定義されたテンプレートがオーバーライドされます。

継承元
Control
戻り値
string

initialize

initialize(options: any): void

指定したオブジェクトからプロパティをコピーしてコントロールを初期化します。

このメソッドを使用すると、各プロパティの値をコードで設定する代わりにプレーンなデータオブジェクトを使用してコントロールを初期化できます。

例:

```typescript grid.initialize({ itemsSource: myList, autoGenerateColumns: false, columns: [ { binding: 'id', header: 'Code', width: 130 }, { binding: 'name', header: 'Name', width: 60 } ] });

// 以下と同等です。 grid.itemsSource = myList; grid.autoGenerateColumns = false; // など ```

初期化データは適用時に型チェックされます。初期化オブジェクトに不明なプロパティ名または無効なデータ型が含まれている場合、このメソッドは例外をスローします。

パラメーター
  • options: any

    Object that contains the initialization data.

継承元
Control
戻り値
void

invalidate

invalidate(fullUpdate?: boolean): void

非同期更新を発生させるため、コントロールを無効にします。

パラメーター
  • fullUpdate: boolean Optional

    Whether to update the control layout as well as the content.

継承元
Control
戻り値
void

Static invalidateAll

invalidateAll(e?: HTMLElement): void

指定したHTML要素に含まれるすべてのWijmoコントロールを無効化します。

このメソッドは、コントロールの表示状態やサイズを変更する動的なパネルをアプリケーションで使用している場合に使用します。たとえば、スプリッタ、アコーディオン、およびタブコントロールは通常、その中の要素の表示状態を変更します。この場合、その要素に含まれるコントロールに通知しないと、それらのコントロールが適切に機能しなくなる可能性があります。

これが起こる場合は、動的コンテナーで適切なイベントを処理し、invalidateAllメソッドを呼び出してコンテナー内のWijmoコントロールのレイアウト情報が適切に更新されるようにする必要があります。

パラメーター
  • e: HTMLElement Optional

    Container element. If set to null, all Wijmo controls on the page will be invalidated.

継承元
Control
戻り値
void

onGotFocus

onGotFocus(e?: EventArgs): void

gotFocus イベントを発生させます。

パラメーター
継承元
Control
戻り値
void

onInvalidInput

onInvalidInput(e: CancelEventArgs): void

invalidInput イベントを発生させます。

イベントハンドラがイベントをキャンセルした場合、コントロールは無効な入力とフォーカスを保持します。

パラメーター
継承元
Control
戻り値
void

onLostFocus

onLostFocus(e?: EventArgs): void

lostFocus イベントを発生させます。

パラメーター
継承元
Control
戻り値
void

onRefreshed

onRefreshed(e?: EventArgs): void

refreshedイベントを発生させます。

パラメーター
継承元
Control
戻り値
void

onRefreshing

onRefreshing(e?: EventArgs): void

refreshingイベントを発生させます。

パラメーター
継承元
Control
戻り値
void

onValueChanged

onValueChanged(e?: EventArgs): void

valueChangedイベントを発生させます。

パラメーター
戻り値
void

refresh

refresh(fullUpdate?: boolean): void

コントロールを更新します。

パラメーター
  • fullUpdate: boolean Optional

    Whether to update the control layout as well as the content.

継承元
Control
戻り値
void

Static refreshAll

refreshAll(e?: HTMLElement): void

HTML要素で存在するすべてのWijmoコントロールを更新する。

コントロールが時間おいて更新される代わりに直ちに更新されること以外はinvalidateAll メソッドと同様です。

パラメーター
  • e: HTMLElement Optional

    Container element. If set to null, all Wijmo controls on the page will be invalidated.

継承元
Control
戻り値
void

removeEventListener

removeEventListener(target?: EventTarget, type?: string, fn?: any, capture?: boolean): number

このControl が所有する要素にアタッチされている1つまたは複数のイベントリスナーを解除します。

パラメーター
  • target: EventTarget Optional

    Target element for the event. If null, removes listeners attached to all targets.

  • type: string Optional

    String that specifies the event. If null, removes listeners attached to all events.

  • fn: any Optional

    Handler to remove. If null, removes all handlers.

  • capture: boolean Optional

    Whether the listener is capturing. If null, removes capturing and non-capturing listeners.

継承元
Control
戻り値
number

イベント

gotFocus

コントロールがフォーカスを取得したときに発生します。

継承元
Control
引数
EventArgs

invalidInput

無効な入力値が検出された場合に発生します。

ユーザーが適切な型に変換できない値、または有効な範囲外の値を入力または貼り付けると、無効な入力が発生する可能性があります。

イベントハンドラがイベントをキャンセルした場合、コントロールは無効なコンテンツとフォーカスを保持するため、ユーザーはエラーを修正できます。

イベントがキャンセルされない場合、コントロールは無効な入力を無視し、元のコンテンツを保持します。

継承元
Control
引数
CancelEventArgs

lostFocus

コントロールがフォーカスを失ったときに発生します。

継承元
Control
引数
EventArgs

refreshed

コントロールが内容を更新した後で発生します。

継承元
Control
引数
EventArgs

refreshing

コントロールが内容を更新する直前に発生します。

継承元
Control
引数
EventArgs

valueChanged

ユーザーアクションの結果として、またはコードでの割り当てにより、value プロパティの値が変化すると発生します。

引数
EventArgs