官網(wǎng)原文：Fuse

輸出

預(yù)覽時(shí)，F(xiàn)use會(huì)在手持設(shè)備上創(chuàng)建一個(gè)殼（shell）程序，與在運(yùn)行在桌面系統(tǒng)的Fuse后臺(tái)程序相連，從而快速顯示你對(duì)項(xiàng)目做的所有更改。但是，如果你去參加一個(gè)會(huì)議，或者給客戶去秀秀，手持設(shè)備要斷開與開發(fā)環(huán)境的連接時(shí)，你就需要將項(xiàng)目輸出到你要運(yùn)行的設(shè)備上。

輸出到iOS

首先，你需要有一臺(tái)運(yùn)行OS X系統(tǒng)并安裝了Xcode的Mac，其次，你還要有一個(gè)蘋果開發(fā)者賬號(hào)，都齊了，就在項(xiàng)目目錄里鍵入下面的命令：

fuse build --target=ios --run

該命令會(huì)在Xcode中打開建成的項(xiàng)目，在可用輸出目標(biāo)的下拉菜單里選擇你的設(shè)備型號(hào)，然后點(diǎn)擊“運(yùn)行”按鈕，App就會(huì)部署并運(yùn)行在你的設(shè)備上了。

輸出到安卓

首先確定Android SDK/NDK都安裝好了（在安卓上預(yù)覽也需要安裝這些，如沒有，在命令行輸入：fuse install android)，然后在命令行的項(xiàng)目目錄中鍵入：

fuse build --target=Andoid --run

你的項(xiàng)目就已部署在與系統(tǒng)相連的安卓設(shè)備上了。

UX標(biāo)記

Fuse主要被用來做這么兩類事兒：

• 一類是用來創(chuàng)建App或者原型，主要是編寫跨平臺(tái)的JavaScript邏輯，
• 另外就是為原生App創(chuàng)建組件、UI視圖和設(shè)計(jì)

這兩類事兒都是通過UX標(biāo)記來進(jìn)行主體表述的。

UX標(biāo)記實(shí)際上是基于XML的文件格式，有點(diǎn)XML經(jīng)驗(yàn)的用戶都能輕松上手。詳細(xì)的功能、深度的解讀，請(qǐng)參考UX標(biāo)記文檔。

用App標(biāo)簽新建應(yīng)用

單獨(dú)創(chuàng)建應(yīng)用或原型，使用<app>標(biāo)簽：

<App Background="#436EEE">
    <Text>Hello, world!</Text>
</App>

在<App>標(biāo)簽內(nèi)，可以嵌入任何Node、Behavior或Theme這些類型的標(biāo)簽。上面的例子簡單的用默認(rèn)的字體顯示了一段文字。

App標(biāo)簽自身負(fù)責(zé)引導(dǎo)整個(gè)App，并處理應(yīng)用程序的生命周期和主題事務(wù)。

使用Background屬性設(shè)置App根視圖的背景色。

UX 標(biāo)簽

UX文檔都是由若干XML標(biāo)簽組成，每個(gè)可用的UX標(biāo)簽都相當(dāng)于一個(gè)用Uno編碼的類，每個(gè)標(biāo)簽還對(duì)應(yīng)一個(gè)或多個(gè)runtime對(duì)象。

這些可用的標(biāo)簽（類）可分為如下類別：

• App類代表一個(gè)應(yīng)用的根（the root），有也只能有一個(gè)節(jié)點(diǎn)（Node）
• 相當(dāng)多的Node類型，主要都是些UI元素
• Behavior類的標(biāo)簽用來修改節(jié)點(diǎn)，主要有如下分類：
  • 手勢(shì)
  • 觸發(fā)器
  • 腳本
  • 視覺特效，應(yīng)用于各元素
• 樣式（Styling）使各組件保持統(tǒng)一的視覺表現(xiàn)，避免大量重復(fù)的數(shù)據(jù)

主題

App提供一個(gè)主題設(shè)置，Theme定義了各標(biāo)準(zhǔn)組件的外觀，如下列所示：

<App Theme="..name of theme..">

如不指定，App會(huì)默認(rèn)一個(gè)缺省設(shè)定叫做GraphicsTheme。

原生主題（NativeTheme）

當(dāng)使用NativeTheme時(shí)， Fuse會(huì)應(yīng)用目標(biāo)平臺(tái)的原生控制，如下所示：

<App Theme="Native">
    <StackPanel>
        <Button />
        <Switch />
        <Slider />
    </StackPanel>
</App>

此例中，所有顯示的控制器都采用iOS和安卓的原生樣式，而桌面預(yù)覽中并不會(huì)出現(xiàn)。

如果你既想使用Native原生控制，又想使用桌面預(yù)覽，那可以用NativeWithFallback主題，這樣就會(huì)在iOS和安卓上用原生控制，而在桌面預(yù)覽會(huì)退用Basic主題。

圖片主題（GraphicsTheme）

GraphicsTheme是App的缺省主題，它能讓你的App在所有平臺(tái)上都保持一致的外觀，除了這些：

• 狀態(tài)欄在不同平臺(tái)上會(huì)表現(xiàn)不同
• TextInput- 這是個(gè)高層級(jí)控件，由于依賴原生平臺(tái)的控制，這里缺省是不會(huì)被渲染的。所以要么你自定義它的樣式或者換用BasicTheme。

使用GrapicsTheme主題的好處是：

• 通過Fuse的實(shí)時(shí)預(yù)覽窗，你可以在PC或Mac上預(yù)覽你的App，用戶體驗(yàn)會(huì)比使用iOS和安卓模擬器要好很多。
• 在全平臺(tái)上，你的設(shè)計(jì)和動(dòng)畫效果，看起來、用起來均保持一致。

因?yàn)?code>GraphicsTheme是缺省值，所以無需特意寫上，但如果實(shí)在需要，那就看這兒：

<App Theme="Graphics">

或者這樣：

<App>
    <GraphicsTheme />
</App>

創(chuàng)建自己的GraphicsTheme

擴(kuò)展定制GraphicsTheme也是可行的，比如要給Slider滑動(dòng)條和Button按鈕定義特別的外觀。

自定義GraphicsTheme的方式是，把它當(dāng)成一個(gè)基礎(chǔ)類來使用, 象這樣:

<GraphicsTheme ux:Class="MyGraphicsTheme">
    <Button>
        <!-- how a button looks goes here -->
    </Button>
</GraphicsTheme>

這樣的話，在App標(biāo)簽里要這么寫：

<App>
    <MyGraphicsTheme />
</App>

也可以給它創(chuàng)建一個(gè)全局別名，像這樣：

<MyGraphicsTheme ux:Global="MyGraphics" />

那樣的話，在App標(biāo)簽里要這么寫：

<App Theme="MyGraphics">
    ...
</App>

基本主題（BasicTheme）

這個(gè)BasicTheme主題實(shí)際上就是以GraphicsTheme為基礎(chǔ)，加上一些缺省的Fuse頁面，并且在設(shè)計(jì)上采用了谷歌的material design設(shè)計(jì)理念。

如果你設(shè)計(jì)UI時(shí)需要一個(gè)起點(diǎn)，該主題會(huì)幫到你并在全平臺(tái)上保持一致的外觀。

<App Theme="Basic">