Infragistics Ignite UI for Angular UI Layout and Design Controls

InfragisticsUI 版面配置與設計控制JavaScript

為回應式應用程式提供靈活的 Angular 版面與設計控制。

  • 提供用於控制版面方向與子元素流程的指示詞。
  • 支援水平與垂直版面，以及換行與對齊。
  • 可自訂元素順序、間距與對齊軸。
Infragistics logo

起價:

載入中...
包含在以下產品
Infragistics Ignite UI for Angular載入中
Infragistics Ignite UI載入中
Infragistics Professional載入中
Infragistics Ultimate載入中
需要幫助選擇嗎？ 請查看 如何購買 和 規格
Infragistics Ignite UI for Angular UI Layout and Design Controls 產品圖片
Ignite UI for Angular Layout and Design Controls 提供一套完整的 Angular 指示詞，協助開發人員有效率地排列 UI 元件。它支援列或欄版面配置、元素換行、沿主軸與交叉軸的對齊，以及自訂排序，讓您能建立具回應能力且結構良好的 Angular 應用程式。

版面方向控制

使用 igxLayout 指示詞來指定容器內直接子元素的水平（列）或垂直（欄）流程，讓 UI 元件能以彈性方式結構化。

反轉元素順序

套用 igxLayoutReverse 屬性以反轉元素的渲染順序，方便建立由右至左或其他替代版面配置。

自訂元素排序

對個別元素使用 igxFlexOrder 以調整其在版面中的顯示順序，覆寫預設的 DOM 順序。

元素間距與分配

igxLayoutJustify 指示詞提供 space-between、space-around、flex-start、center 和 flex-end 等選項，可控制元素沿主軸的分布與位置。

交叉軸對齊

使用 igxLayoutItemAlign 可在列版面中垂直對齊元素，或在欄版面中水平對齊元素，並可選擇 flex-start、center 和 flex-end 等選項，以提升版面精準度。

內容換行

啟用帶有 wrap 設定的 igxLayoutWrap，讓元素在超出容器寬度時可流向多行，支援回應式設計。

巢狀版面

將 igxLayout 容器與子元素上的 igxFlex 指示詞結合，可建立複雜的巢狀 flexbox 版面，在多個階層層級上管理大小、對齊與順序。

Material Design 整合

這些指示詞依據 Angular Material 設計原則建構，確保在遵循 Material 指南的 Angular 應用程式中具備順暢一致的樣式與佈景主題。

產品相容性

請查看以下詳細資訊，以確保此產品在您的環境中受支援。

元件類型

  • JavaScript

JavaScript 平台

  • Angular
  • Vanilla JavaScript