[]
        
(Showing Draft Content)

セルの固定

行と列の固定

FlexGridは、グリッドの他の部分がスクロール可能なまま、指定する行と列を固定できるFrozenCells機能を提供します。

行と列を固定するには、グリッドの固定状態を取得または設定できるfrozenCellsプロパティを使用します。このプロパティは、グリッドの上下行、また左右列を固定するオプションを提供します。

現状、frozenCellsプロパティを使用して、上下行のいずれかと左右列のいずれかのみを固定することができます。上行と下行が同時に指定されている場合は上行が優先され、左列と右列が同時に指定されている場合は左列が優先されます。

以下の例では、frozenCellsプロパティにオブジェクトを割り当て、上部の2行、左側の1列を固定しています。

// 上部の2行、左側の1列を固定
grid.frozenCells = { top: 2, left: 1 };
  • frozenCellsプロパティはFlexGridでのみ利用できます。(他のGrid系のコントロールでは利用できません)

  • 右列と下行の固定はExcelのインポート/エクスポートに利用できません。

固定セルを管理するには、frozenCellsプロパティの使用が推奨されます。下位互換性のために、従来のfreezerRowsプロパティと freezerColumnsプロパティも引き続き使用できます。ただし、これらのプロパティでは、グリッドの上行と左列のみを固定できます。

  • Vue用モジュールのマークアップを利用する場合、frozenCellsプロパティはfrozenRows/Columnsプロパティより優先されます。

セルの固定の解除

frozenCellsを空のオブジェクトに設定することで、すべての行と列の固定を解除できます。

grid.frozenCells = {};

既存問題:

  1. 右列が固定されている場合、グリッドが左方向に水平スクロールします。

  2. 右列が固定されている場合、Firefox および Safari では固定された列と固定されていない列の間にスペースが表示されます。

  3. 右列が固定されている場合、Chromeで水平スクロールすると、レイアウトの崩れが発生します

  4. 下行/右列が固定されている場合、Safariのタッチパッドを使用してグリッドをスクロールすると、レイアウトの崩れが発生します。

  5. グリッドに1行しか含まれておらず、その行が先頭で固定されている場合、行の一部のみが表示されます。

技術制限:

  1. 下行と右列が固定されている場合、スクロールボタンが正しく無効にならない可能性があります。

  2. グリッドの高さが設定され、下行が固定されている場合、固定されていない行と固定されている行の間にスペースが表示される可能性があります。

  3. 下行がに固定され、列フッターが存在する場合、非固定の行を固定領域にドラッグすることはできません。

  4. 下行/右列が固定されている場合、Firefoxではスクロールバーが表示されない可能性があります。