概述

針對不同的App，平臺提供的App界面配置的區(qū)別如下。

• 云智能App（又稱為公版App）

  您可以選擇平臺提供的常見品類（如燈、開關(guān)、插座等）的標準面板，也可以通過拖拽功能控件的方式來自定義界面。

  云智能App的設(shè)備面板也支持上傳自定義面板，用戶可根據(jù)平臺提供的設(shè)備面板SDK進行開發(fā)，然后按照規(guī)范上傳到平臺中進行選擇使用。上傳自定義面板的詳細操作，請參見自定義面板上傳。

• 自有App

  您可以自行開發(fā)App面板，也可以集成生活物聯(lián)網(wǎng)平臺提供的配置化界面插件。當您選擇集成配置化界面插件時，您可以與云智能App一樣，選擇平臺提供的常見品類的標準面板與圖標，或通過拖拽功能控件的方式來自定義界面。

• 天貓精靈App

  您可以直接使用生活物聯(lián)網(wǎng)平臺提供的天貓精靈App宜控面板，也可以選擇平臺提供的官方模板新建一個面板，通過拖拽功能控件的方式來自定義界面。

配置自有品牌項目的App面板

配置云智能App面板與配置自有App面板（需完成自有App調(diào)用配置化面板，流程請查看自有App調(diào)用配置化面板）的操作相同，請您根據(jù)以下步驟操作。

1. 登錄生活物聯(lián)網(wǎng)控制臺。
2. 在產(chǎn)品的人機交互頁面，打開使用公版App控制產(chǎn)品的控制開關(guān)。
   

   說明 人機交互頁面的配置項默認使用適用于您創(chuàng)建的自有App。打開云智能App（公版App）開關(guān)后，配置項可同時用于自有App和云智能App。
3. 單擊面板選擇對應(yīng)的未設(shè)置，選擇App控制產(chǎn)品時的面板界面。

   以燈品類為例，下圖為平臺提供的標準面板。

   
4. （可選）如果沒有合適的面板，您可以選擇主題面板（部分主題面板可修改），并單擊編輯，基于現(xiàn)在面板修改（詳細參見相關(guān)品類的最佳實踐文檔）。
   說明 如果顯示的主題面板為空白，則可能是由于該品類未配置相關(guān)的主題面板，請聯(lián)系商務(wù)或技術(shù)支持添加該品類的主題面板。亦可根據(jù)需要參考其他品類下的主題面板，單擊空白面板選擇自定義面板。

   
5. （可選）如果沒有合適的面板，您還可以單擊空白面板對應(yīng)的創(chuàng)建面板，基于空白面板全新開發(fā)。

   自定義面板靈活性高，不限制設(shè)備的功能定義，且采用拖拽功能控件的方式，方便您自行開發(fā)。詳細請參見App面板開發(fā)教程。

   
6. （可選）如果還是無法選擇到合適的面板，您可以單擊上傳自定義面板上傳自主開發(fā)的個性化面板，自定義面板基于平臺提供的設(shè)備面板SDK開發(fā)。
   自定義開發(fā)的面板只需要符合平臺規(guī)范即可上傳，上傳后需要平臺審核通過方可使用，更多詳細操作，請參見自定義面板上傳。

   說明 僅支持云智能App上傳自定義面板并使用。

   
7. 設(shè)置好產(chǎn)品的面板后，您可以使用云智能App掃描產(chǎn)品面板預(yù)覽下方的二維碼，預(yù)先體驗產(chǎn)品界面。
8. 生活物聯(lián)網(wǎng)平臺為您的品類預(yù)置了默認圖標，您也可以單擊更換產(chǎn)品圖標修改圖標。

   修改后，可直接預(yù)覽新的產(chǎn)品圖標，如下圖所示。

   

自有App調(diào)用配置化面板

配置自有App的面板前，您需要根據(jù)以下步驟完成配置化面板的調(diào)用，即集成面板插件。

1. 在產(chǎn)品的人機交互頁面，單擊前往查看。
   
2. （可選）如果您在當前項目中尚未創(chuàng)建自有App，可單擊創(chuàng)建自有APP。請參見創(chuàng)建自有App。
   
3. 在自有品牌App的關(guān)聯(lián)產(chǎn)品頁面中，打開該產(chǎn)品的開關(guān)。詳細請參見設(shè)置關(guān)聯(lián)產(chǎn)品。
   
4. 在自有品牌App的SDK和插件頁面中，選擇插件頁簽，單擊設(shè)備面板對應(yīng)的生成代碼。
   
5. 在彈出的對話框中，單擊復(fù)制，并將該代碼粘貼到自有App的工程中。
   
6. 更多集成面板插件的操作，請參見插件使用指南。

配置天貓精靈App設(shè)備面板

生活物聯(lián)網(wǎng)平臺為了方便開發(fā)，提供配置移動端和帶屏音箱的設(shè)備面板的控制臺。

1. 登錄生活物聯(lián)網(wǎng)控制臺。
2. 在天貓精靈生態(tài)項目下，從項目主頁面的產(chǎn)品管理進入人機交互頁面，選擇左側(cè)導(dǎo)航欄設(shè)備面板，單擊選擇面板。
3. 在右側(cè)彈出的選擇產(chǎn)品面板側(cè)彈框中可以選擇你需要的面板進行配置。

   在天貓精靈生態(tài)項目中，控制臺提供了三種不同的開發(fā)面板：

   • 宜控面板

     宜控面板是生活物聯(lián)網(wǎng)平臺提供的默認控制面板，該面板在創(chuàng)建產(chǎn)品并定義產(chǎn)品功能后，平臺會根據(jù)所定義的產(chǎn)品功能自動適配各種App面板尺寸，并將對應(yīng)產(chǎn)品功能的控件進行自動排版，方便開發(fā)者直接使用由天貓精靈IoT團隊開發(fā)好的默認控制面板。

     說明 選擇宜控面板可免去開發(fā)與配置面板的過程，如果當前產(chǎn)品沒有宜控面板，請聯(lián)系商務(wù)添加宜控面板。
   • 標準模板

     標準面板是生活物聯(lián)網(wǎng)平臺提供的模板控制面板，該面板與產(chǎn)品功能不完全匹配，直接使用標準面板可能會使得產(chǎn)品定義的功能控件缺少；可以在選擇從模板新建控制面板后，對照模板進行自定義面板控件，使用平臺的界面工作臺進行編輯控制面板，以確認面板控件與產(chǎn)品功能物模型一致。

   • 空白面板

     選擇空白面板，可以使用界面工作臺完全自定義控制面板的控件，自由搭建程度較高，可以隨意搭配控件。

4. （可選）選擇宜控面板后單擊保存完成設(shè)備面板配置。
   
5. （可選）選擇標準模板等官方模板，單擊從模板新建進入界面工作臺。操作步驟同上文配置標準面板。
   
6. （可選）選擇空白面板，單擊創(chuàng)建面板進入界面工作臺。操作步驟同上文配置空白面板。
   
7. （可選）如果需要使用自主開發(fā)的控制面板，可單擊上傳控制面板，然后單擊上傳測試包，詳細開發(fā)步驟請參見天貓精靈App面板開發(fā)指南。
   

   說明 在自主開發(fā)控制面板時，請仔細查看面板開發(fā)的規(guī)則，并按照規(guī)范上傳用于測試的控制面板zip包，待發(fā)布審核通過后可在天貓精靈App中使用，文件名（不含后綴名）長度不超過20個字，大小不能超過1M。
8. 設(shè)置好產(chǎn)品的面板后，您可以先單擊登錄淘寶賬號后，使用天貓精靈App掃描預(yù)覽界面專用處的二維碼預(yù)先體驗產(chǎn)品界面。