Flex外部樣式表公約

Question

我知道有關於同一主題的問題，但對於HTML。關於在Flex應用程序中使用外部樣式表有什麼好的約定？你會如何分解樣式表（樣式表的名稱及其包含的內容）？

Answer 1

Flex並不是我處理過的東西，但我做了一些研究。它看起來像代碼調用一個遠程樣式表是這樣的：

<mx:Style source="com/example/assets/stylesheet.css" /> 

Flex Quick Start: Building a simple user interface: Styling your components這樣說：

注意：你應該儘量限制 數量在 應用程序中使用的樣式表，並僅在 應用程序（ 包含該標籤的文檔）中的頂級文檔中設置樣式表 。如果 您在子文件 文檔中設置樣式表，則可能發生意外的結果 。

這似乎意味着多個樣式表是不可能的。這聽起來像你想要做的是組織你的樣式表，檢查出Organizing Your Stylesheets和Architecting CSS的方法的一些想法。它看起來像有類和基本標籤，但W3C stylesheet specifications與Flex樣式表規範不同。

作爲非Flex開發人員，命名空間看起來很有趣的方式來組織命名空間：How to use the new CSS syntax in Flex 4。

Answer 2

Flex在您發佈項目時編譯外部CSS文件。

有一種方法可以在運行時使用Flex加載CSS;可以通過將CSS文件編譯爲SWF文件並在運行時使用StyleManager.loadStyleDeclarations加載它們來完成。

查看LiveDocs on Stylesheets at Run Time瞭解更多信息。

Answer 3

我們在組織樣式表使用的一些約定：

• 有一個main.css樣式表保存所有數據的剝皮的基本應用程序。
• 有一個fonts.css樣式表來存儲主應用程序中的所有字體，因爲這些可能會相當混亂。

main.css樣式表通過<mx:Style source="main.css"/>標籤包含在主SWF中。我們儘可能少加載我們的應用程序，一旦所有內容都加載完畢，如果我們需要立即顯示一些文本（有時我們只是播放視頻，如果它是廣告網站的話），我們會淡入/補間主要元素並加載fonts.css通過StyleManager.loadStyleDeclarations在運行時。

• 如果我們有一個管理面板，我們有一個admin.css樣式表，我們在運行時加載，因爲主應用程序不需要它。

我們並不需要比再瓜分CSS，因爲我們通常會創建一個Theme一整套皮膚，所以樣式表僅僅是應用這些外觀組件和是相當瘦（使用Flex 4 ）。我傾向於將樣式表分成任何更小的樣式（比如「pages.css」，「comments.css」，「popups.css」，甚至是「controls.css」等），因爲它會過度管理和管理太多很少有回報。這在HTML中很常見，但是這是因爲HTML需要CSS才能表現出色; Flex可以完全沒有CSS。

在開發，我們的一個通常發展大部分皮膚馬上（具有默認線框的設置，像那些ScaleNine發現，因爲他們做的Photoshop /閃光燈/後遺症。有沒有辦法不用重新編譯如果你修改了css swf，但是如果它是在運行時加載的，你只需要重新編譯css文件而不是主要的swf，這在覈心皮膚開發過程中很有用，但並不是真正有用的。

我試着保留主要樣式表在開發過程中（在一個自定義主題中）是分開的，並且它使得開發變得非常困難，因爲每次我進行更改時都必須單獨重新編譯css，有時我必須重新編譯主應用程序，難以追蹤的錯誤等，然後我是comp在兩個不同的應用程序。所以我建議保留主應用程序的主要CSS文件的一部分。

如果您想要運行時css而無需重新編譯任何東西，請嘗試Ruben's CSS Loader並查看the source。但是，這將會導致運行時性能成本。