Grid Column Resizing (グリッド列サイズ変更)

    Grid 列サイズ変更は、グリッド列のサイズ変更が可能なできることを示します。ユーザーがハンドルとしてヘッダーの右端をグラブすると、列の幅を調整できます。Grid 列サイズ変更は、Ignite UI for Angular Grid 列サイズ変更機能と視覚的に同じものです。

    Grid 列サイズ変更のデモ

    Header Cell (ヘッダー セル)

    列がサイズが変更可能であることを示するには、デフォルト値を Not Resizable から Resizable に変更すると、Sketch で列の Grid Header Cell の Column Resizing のオーバーライドを設定します。Figma でこれを行うには、レイヤー パネルに移動し、グリッド ヘッダー セル レイヤーを開き、Column Resizing コンポーネントのプロパティを Resizable から Not Resizable に変更する必要があります。Adobe XD では、Column Resizing レイヤーは Component States パラダイムを使用して、状態を簡単に切り替えることができます。コード生成には、これにより列をサイズ変更可能としてマークします。

    Column Resizing Indicator Feature (列サイズ変更インジケーター機能)

    グリッドの Features の下には、サイズ変更が発生する列全体の強調表示境界線を表す Column Resizing Indicator シンボル / コンポーネントがあります。このシンボル / コンポーネントを追加すると、デザインに視覚的な効果があるのみで、よりリアルになります。Column Resizing 機能を切り替えたい場合は、Header Cell を構成します。

    その他のリソース

    関連トピック:

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