快速入門:新增啟動顯示畫面 (HTML)

[ 本文的目標對象是撰寫 Windows 執行階段 App 的 Windows 8.x 和 Windows Phone 8.x 開發人員。如果您正在開發適用於 Windows 10 的 App,請參閱 最新文件 ]

使用 Microsoft Visual Studio 2013 設定應用程式的啟動顯示畫面影像與背景色彩。

如需了解此功能的運作情形,請參閱應用程式功能,從開始到完成系列: Windows 市集應用程式 UI,從開始到完成 (HTML)

先決條件

此快速入門使用 Visual Studio 2013。若要下載,請參閱取得工具

在 Visual Studio 2013 中設定啟動顯示畫面影像與背景色彩

當您使用 Visual Studio 2013 範本建立應用程式時,會將預設影像新增到您的專案,並設定為啟動顯示畫面影像。啟動顯示畫面的背景色彩預設為淺灰。如果您想變更應用程式啟動顯示畫面的預設影像或色彩,請遵循以下步驟:

  1. 開啟 Visual Studio 2013 中的現有 Windows 執行階段應用程式專案。

  2. 在 [方案總管] 中,開啟 "Package.appxmanifest" 檔案。您也可以依序選擇 [專案]、[市集] 和 [編輯應用程式資訊清單],從功能表列開啟這個檔案。

  3. 開啟 [視覺資產] 索引標籤,然後從 "Package.appxmanifest" 視窗左側的 [所有影像資產]**** 窗格選取 [啟動顯示畫面]。 如果您是第一次變更啟動顯示畫面,會在 [啟動顯示畫面]**** 欄位看到 "Assets\SplashScreen.png" 路徑。

    以下螢幕擷取畫面顯示 Visual Studio 2013 中的 "Package.appxmanifest" 視窗。依據專案是針對 Windows 市集應用程式,還是針對 Windows Phone 市集應用程式而定,您會看到一組略為不同的視覺資產。

    Visual Studio 2013 中的 "Package.appxmanifest" 視窗的螢幕擷取畫面

    如果您以文字編輯器開啟 "Package.appxmanifest",SplashScreen element 會顯示為 VisualElements element 的子項目。資訊清單檔案中的預設啟動顯示畫面標記在文字編輯器中看起來像這樣:

    <m2:SplashScreen Image="Assets\splashscreen.png" />
    
  4. 若要為 Windows 市集應用程式選取新的啟動顯示畫面影像,請按 [縮放的資產] 下方顯示在 [620 x 300 px]**** 標籤旁具有省略符號的按鈕。選擇要當作啟動顯示畫面影像的 620 x 300 像素影像 (.png、.jpg 或 .jpeg)。

    重要  您選擇的啟動顯示畫面影像必須使用 1x 縮放比例的 620 x 300 像素。此外,設計您的啟動顯示畫面時,請注意它將小於螢幕,並且置中對齊。它並不像 Windows Phone 市集應用程式的啟動顯示畫面會填滿螢幕。

     

  5. 若要為 Windows Phone 市集應用程式選取新的啟動顯示畫面影像,請按 [縮放的資產] 下方顯示在 [1152 x 1920 px]**** 標籤旁具有省略符號的按鈕。選擇要當作啟動顯示畫面影像的 1152 x 1920 像素影像 (.png、.jpg 或 .jpeg)。

    重要  您所選擇的啟動顯示畫面影像必須是 1152 x 1920 像素,這是 2.4x 縮放比例的正確大小。如果這是您所提供的唯一資產,它將會針對 1.4x 和 1x 的縮放比例縮小。

     

  6. 在 [啟動顯示畫面] 區段的 [背景色彩]**** 欄位中,設定與您的啟動顯示畫面影像一起顯示的背景色彩。您可以輸入色彩名稱,或是輸入 '#' 與色彩的十六進位值。如需可用色彩的名稱清單,請參閱 SplashScreen element

    您不一定要設定啟動顯示畫面的背景色彩。如果您沒有為 Windows 市集應用程式指定色彩,啟動顯示畫面背景色彩預設會是淺灰色 (十六進位值 #464646)。這個色彩與預設的 [磚] 背景色彩相同 (請參閱 [視覺資產]**** 索引標籤中 [磚影像和標誌] 區段的 [背景色彩]**** 欄位)。如果您沒有為 Windows Phone 市集應用程式指定色彩,或是將它設定成「透明」,啟動顯示畫面背景色彩就會是透明的。

摘要與後續步驟

如果您的應用程式需要一些時間載入,可考慮加入延長式啟動顯示畫面。如需逐步指引,請參閱如何延長啟動顯示畫面。在啟動顯示畫面的指導方針和檢查清單中,深入了解如何建立良好的載入體驗。

想更深入了解 Windows 市集應用程式的其他影像需求嗎?請參閱選擇應用程式影像

相關主題

啟動顯示畫面範例

啟動顯示畫面的指導方針和檢查清單

如何延長啟動顯示畫面

選擇應用程式影像

參考

Package manifest schema SplashScreen element

Windows.ApplicationModel.Activation.SplashScreen class