Grid Row Filter (グリッド行フィルター)

    Grid 行フィルターを使用して、フィルタリング条件を持つ Chip を含む特別なタイプの Header Cell を介して Grid 列のフィルタリング基準を指定します。Grid 行フィルターは、Ignite UI for Angular Grid フィルタリング機能と視覚的に同じものです。

    Grid 行フィルターのデモ

    Row Filter Header (行フィルター ヘッダー)

    Grid が Row Filter でフィルタリング可能であることを示すために、Header グループ内の Grid の各列に Row Filter Header Cell を持つ 2 番目の Header 行を追加します。

    Filter State (フィルター状態)

    Row Filter Header Cells には、Sketch の Filter State オーバーライドが付属しており、特定の列にフィルター条件が適用されているかどうかを構成できます。デフォルトでは Empty と表示されますが、Filtered に設定し、含まれている Chip で条件を指定できます。Figma では、行フィルタリングは Grid Header Cell タイプの 1 つであり、プロパティ パネルから切り替えることができます。フィルター状態には、Row Filter EmptyRow Filter Filtered という 2 つの異なるタイプがあります。Type プロパティを調整することで、それらを簡単に切り替えることができます。Adobe XD では、Component States パラダイムを使用して状態を簡単に切り替えることができる Filter State レイヤーを介して、同じような方法で編成されます。

    その他のリソース

    関連トピック:

    コミュニティに参加して新しいアイデアをご提案ください。