From f5d367f54ed2e5f24acb500b43719024c4ab1e3d Mon Sep 17 00:00:00 2001 From: mkamiishi Date: Wed, 22 Jul 2026 13:38:04 +0900 Subject: [PATCH] docs: update Japanese cell merging topics --- .../jp/grids_templates/cell-merging.mdx | 54 +++++------ .../components/grids/_shared/cell-merging.mdx | 95 ++++++++++--------- 2 files changed, 78 insertions(+), 71 deletions(-) diff --git a/docs/angular/src/content/jp/grids_templates/cell-merging.mdx b/docs/angular/src/content/jp/grids_templates/cell-merging.mdx index 96532806a6..4b6a02ae1b 100644 --- a/docs/angular/src/content/jp/grids_templates/cell-merging.mdx +++ b/docs/angular/src/content/jp/grids_templates/cell-merging.mdx @@ -1,13 +1,12 @@ --- title: Angular Grid のセル結合 - Ignite UI for Angular -description: Ignite UI for Angular Data Grid の複数行レイアウト機能を使用して、列をより強力な方法で配置およびサイズ設定します。デモと例をお試しください。 -keywords: angular cell merging, cell merging, ignite ui for angular, セルの結合, セルの結合 +description: Ignite UI for Angular Data Grid のセル結合機能を使用して、同じ値を持つ隣接セルを結合します。構成方法や結合モードを学び、実際の例をご覧ください。 +keywords: angular cell merging, cell merging, ignite ui for angular, セルの結合 license: commercial _language: ja llms: description: "Ignite UI for Angular の {ComponentTitle} には、同じ値を持つ隣接セルを 1 つの大きなセルに結合するセル結合機能があります。" --- - import DocsAside from 'igniteui-astro-components/components/mdx/DocsAside.astro'; import Sample from 'igniteui-astro-components/components/mdx/Sample.astro'; import ApiLink from 'igniteui-astro-components/components/mdx/ApiLink.astro'; @@ -21,35 +20,32 @@ Ignite UI for Angular の {ComponentTitle} には、同じ値を持つ隣接セ - + - + - + + ## セル結合の有効化と使用 グリッドでのセル結合は、以下の 2 つのレベルで制御されます: + - グリッド レベルの結合モード - 結合がいつ適用されるかを決定 - 列レベルの結合トグル - どの列でセルを結合できるかを決定 -- Grid-level merge mode – determines when merging is applied. -- Column-level merge toggle – determines which columns can merge cells. - ### グリッド結合モード グリッドは、`GridCellMergeMode` 列挙型の値を受け入れる `cellMergeMode` プロパティを公開します。 + - `always` - ソート状態に関係なく、結合条件を満たすすべての隣接セルを結合。 - `onSort` - 列がソートされているときのみ隣接セルを結合 **(デフォルト値)**。 -- `always` - Merges any adjacent cells that meet the merging condition, regardless of sort state. -- `onSort` - Merges adjacent cells only when the column is sorted **(default value)**. - ```html <{ComponentSelector} [data]="data" [cellMergeMode]="cellMergeMode"> ... @@ -70,12 +66,10 @@ protected cellMergeMode: GridCellMergeMode = 'always'; ``` 上記の例では: + - **OrderID** 列は、隣接する重複値を結合します。 - **ShipperName** 列は、結合を行わず通常通りに描画されます。 -- The **OrderID** column will merge adjacent duplicate values. -- The **ShipperName** column will render normally without merging. - ### 組み合わせた例 ```html @@ -120,6 +114,7 @@ export interface IGridMergeStrategy { + ### デフォルトのストラテジを拡張 一部の動作 (例: comparer ロジック) のみをカスタマイズしたい場合は、組み込みの `DefaultMergeStrategy` を拡張し、必要なメソッドのみをオーバーライドできます。 @@ -140,7 +135,8 @@ export class MyCustomStrategy extends DefaultMergeStrategy { -The `IgxTreeGrid` provides two built-in strategies that implement the `IGridMergeStrategy` interface: `DefaultTreeGridMergeStrategy` and `ByLevelTreeGridMergeStrategy`. `DefaultTreeGridMergeStrategy` merges all cells with the same value, regardless of their hierarchical level. In contrast, `ByLevelTreeGridMergeStrategy` only merges cells if they have the same value and are located at the same level, making level a required condition for merging. + +`IgxTreeGrid` は、`IGridMergeStrategy` インターフェイスを実装する 2 つの組み込みストラテジ `DefaultTreeGridMergeStrategy` と `ByLevelTreeGridMergeStrategy` を提供します。`DefaultTreeGridMergeStrategy` は、階層レベルに関係なく同じ値を持つすべてのセルを結合します。一方、`ByLevelTreeGridMergeStrategy` は、同じ値を持ち、かつ同じレベルに存在するセルのみを結合するため、レベルが結合の必須条件になります。 ### デフォルトのストラテジを拡張 @@ -178,22 +174,34 @@ protected customStrategy = new MyCustomStrategy(); + ### デモ + ### デモ - + ### デモ - ## 機能の統合 +結合されたセルには特有の動作があるため、グリッドの他の機能と具体的にどのように連携するかに注意が必要です: + + + +- **展開/折りたたみ**: マスター/詳細やグループ化などの機能によってデータを含まない行が生成されると、セルの結合が中断され、グループが分割されます。 + +- **Excel エクスポート**: 結合されたセルは、Excel にエクスポートしても結合された状態を維持します。 +- **列のピン固定**: 列がピン固定されている場合でも、セルは結合された状態を維持し、ピン固定領域に表示されます。 +- **行のピン固定**: セルは、それぞれが属する領域内でのみ結合されます。つまり、ピン固定された行のセルは他のピン固定された行のセルとのみ結合され、ピン固定されていない行のセルはピン固定されていない行のセルとのみ結合されます。 +- **ナビゲーション/アクティブ化**: セルがアクティブになると、同じ行内の結合されたセルはすべて単一のセルになります。つまり、結合シーケンスが解除されます。これには、キーボード ナビゲーションによるアクティブ化も含まれます。 + 結合セルをクリックすると、結合シーケンス内でもっとも近いセルがアクティブになります。 @@ -201,15 +209,9 @@ protected customStrategy = new MyCustomStrategy(); - **更新/編集**: アクティブ化によって結合シーケンスが分解されるため、編集モードになるのは単一セルのみです。 - **行の選択**: 選択された行が結合セルと交差する場合、関連するすべての結合セルが選択対象としてマークされます。 - -If a merged cell is clicked, the closest cell from the merge sequence will become active. - - -- **Updating/Editing**: since activation breaks the merge sequence, only a single cell will be in edit mode. -- **Row selection**: if selected rows intersect merged cells, all related merged cells should be marked as part of the selection. - + ## 制限 |既知の制限| 説明| @@ -219,10 +221,8 @@ If a merged cell is clicked, the closest cell from the merge sequence will becom ## API リファレンス - - - - ## その他のリソース diff --git a/docs/xplat/src/content/jp/components/grids/_shared/cell-merging.mdx b/docs/xplat/src/content/jp/components/grids/_shared/cell-merging.mdx index a6805639e0..1a4d8dd7d5 100644 --- a/docs/xplat/src/content/jp/components/grids/_shared/cell-merging.mdx +++ b/docs/xplat/src/content/jp/components/grids/_shared/cell-merging.mdx @@ -1,6 +1,6 @@ --- title: "{Platform} {ComponentTitle} セル結合 - {ProductName}" -description: "{ProductName} for {Platform} {ComponentTitle} の複数行レイアウト機能を使用して、列をより強力な方法で配置およびサイズ設定します。デモと例をお試しください。" +description: "{ProductName} {ComponentTitle} で、セル結合機能を使用して同じ値を持つ隣接セルを結合します。構成方法や結合モードを学び、実際の例をご覧ください。" keywords: cell merging, {Platform}, {ComponentKeywords}, {ProductName}, Infragistics, セル結合, インフラジスティックス license: commercial mentionedTypes: [{ComponentApiMembers}] @@ -17,7 +17,6 @@ import PlatformBlock from 'igniteui-astro-components/components/mdx/PlatformBloc import ApiLink from 'igniteui-astro-components/components/mdx/ApiLink.astro'; - # {Platform} {ComponentTitle} セル結合 @@ -202,10 +201,13 @@ export declare class IgcGridMergeStrategy { ``` +- `merge` - 結合されたセルをどのように生成するかを定義。 +- `comparer` - 隣接するレコードを結合すべきかを判定する条件を定義。 + -### Extending the Default Strategy +### デフォルトのストラテジを拡張 -If you only want to customize part of the behavior (for example, the comparer logic), you can extend the built-in and override the relevant methods. +一部の動作 (例: comparer ロジック) のみをカスタマイズしたい場合は、組み込みの を拡張し、必要なメソッドのみをオーバーライドできます。 ```ts @@ -238,11 +240,11 @@ export class MyCustomStrategy extends IgcDefaultMergeStrategy { -The `IgxTreeGrid` provides two built-in strategies that implement the `IGridMergeStrategy` interface: and . merges all cells with the same value, regardless of their hierarchical level. In contrast, only merges cells if they have the same value and are located at the same level, making level a required condition for merging. +`IgxTreeGrid` は、`IGridMergeStrategy` インターフェイスを実装する 2 つの組み込みストラテジ と を提供します。 は、階層レベルに関係なく同じ値を持つすべてのセルを結合します。一方、 は、同じ値を持ち、かつ同じレベルに存在するセルのみを結合するため、レベルが結合の必須条件になります。 -### Extending the Default Strategy +### デフォルトのストラテジを拡張 -If you only want to customize part of the behavior (for example, the comparer logic), you can extend one of the built-in strategies, either or , and override the relevant methods. +一部の動作 (例: comparer ロジック) のみをカスタマイズしたい場合は、組み込みの または のいずれかを拡張し、必要なメソッドのみをオーバーライドできます。 ```ts @@ -275,8 +277,8 @@ export class MyCustomStrategy extends IgcDefaultTreeGridMergeStrategy { -### デフォルトのストラテジを拡張 -一部の動作 (例: comparer ロジック) のみをカスタマイズしたい場合は、組み込みの を拡張し、必要なメソッドのみをオーバーライドできます。 +### カスタム ストラテジの適用 +定義したカスタム ストラテジは、 プロパティを通じてグリッドに割り当てます: ```tsx @@ -304,58 +306,63 @@ constructor() { ``` -### Demo +### デモ - + - + - + -## デフォルトのストラテジを拡張 -一部の動作 (例: comparer ロジック) のみをカスタマイズしたい場合は、組み込みの または のいずれかを拡張し、必要なメソッドのみをオーバーライドできます。 +## 機能の統合 +結合されたセルには特有の動作があるため、グリッドの他の機能と具体的にどのように連携するかに注意が必要です: -- **Expand/Collapse**: if a feature (such as master-detail, grouping, etc.) generates a non-data row, then the cell merging is interrupted and the group will be split. +- **展開/折りたたみ**: マスター/詳細やグループ化などの機能によってデータを含まない行が生成されると、セルの結合が中断され、グループが分割されます。 -- **Excel export**: merged cells remain merged when exported to Excel. -- **Column pinning**: cells remain merged when a column is pinned and are displayed in the pinned area. -- **Row pinning**: cells merge only withing their containing area, i.e. cells of pinned rows merge only with cells of other pinned rows, while cells of unpinned rows merge only with cells of unpinned rows. -- **Updating/Editing**: since activation breaks the merge sequence, only a single cell will be in edit mode. -- **Row selection**: if selected rows intersect merged cells, all related merged cells should be marked as part of the selection. -- **Navigation/Activation**: when a cell is active, all merged cells in the same row become single cells, i.e. their merge sequence is broken. This also includes activation via keyboard navigation. +- **Excel エクスポート**: 結合されたセルは、Excel にエクスポートしても結合された状態を維持します。 +- **列のピン固定**: 列がピン固定されている場合でも、セルは結合された状態を維持し、ピン固定領域に表示されます。 +- **行のピン固定**: セルは、それぞれが属する領域内でのみ結合されます。つまり、ピン固定された行のセルは他のピン固定された行のセルとのみ結合され、ピン固定されていない行のセルはピン固定されていない行のセルとのみ結合されます。 +- **更新/編集**: アクティブ化によって結合シーケンスが分解されるため、編集モードになるのは単一セルのみです。 +- **行の選択**: 選択された行が結合セルと交差する場合、関連するすべての結合セルが選択対象としてマークされます。 +- **ナビゲーション/アクティブ化**: セルがアクティブになると、同じ行内の結合されたセルはすべて単一のセルになります。つまり、結合シーケンスが解除されます。これには、キーボード ナビゲーションによるアクティブ化も含まれます。 -If a merged cell is clicked, the closest cell from the merge sequence will become active. +結合セルをクリックすると、結合シーケンス内でもっとも近いセルがアクティブになります。 -## カスタム ストラテジの適用 +## 制限 -定義したカスタム ストラテジは、 プロパティを通じてグリッドに割り当てます。 +|既知の制限| 説明| +| --- | --- | +| セルの結合は、複数行レイアウトとの組み合わせではサポートされません。 | 両方とも複雑なレイアウトを使用するため、同時に使用することはできません。このような無効な構成が検出された場合は警告が表示されます。 | ## API リファレンス - -
-
-
-
-
- -## 機能の統合 - -セル結合の特性上、他の機能との連携動作について以下の点に注意が必要です: - -- **展開と縮小**: マスター詳細、グループ化など、データ以外の行を生成する機能がある場合、その位置でセル結合が中断され、グループが分割されます。 - -- **Excel エクスポート**: 結合されたセルは、Excel にエクスポートしても結合状態が維持されます。 -- **列のピン固定**: 列がピン固定されてもセルの結合は維持され、ピン固定領域内に表示されます。 -- **行のピン固定**: セルは自身が属する領域内でのみ結合されます。つまり、ピン固定された行のセルはピン固定行のセル同士で、ピン固定されていない行のセルはその中でのみ結合されます。 -- **ナビゲーション/アクティベーション**: セルがアクティブになると、その行内の結合セルはすべて単一セルに分解されます。これはキーボード ナビゲーションによるアクティベーションも含みます。 -- **更新/編集**: アクティブ化によって結合シーケンスが分解されるため、編集モードになるのは単一セルのみです。 -- **行の選択**: 選択された行が結合セルと交差する場合、関連するすべての結合セルが選択対象としてマークされます。 + + + + + +## その他のリソース + +- [フィルタリング](filtering.mdx) +- [Excel スタイル フィルタリング](excel-style-filtering.mdx) +- [仮想化とパフォーマンス](virtualization.mdx) +- [ページング](paging.mdx) +- [ソート](sorting.mdx) +- [集計](summaries.mdx) +- [列の移動](column-moving.mdx) +- [列のピン固定](column-pinning.mdx) +- [列のサイズ変更](column-resizing.mdx) +- [選択](selection.mdx) + +コミュニティに参加して新しいアイデアをご提案ください。 + +- [{ProductName} **フォーラム**]({ForumsLink}) +- [{ProductName} **GitHub**]({GithubLink})