Aggiungere riquadri secondari al menu Start

  • Articolo

Questo argomento illustra la procedura per creare un riquadro secondario per l'app di Windows e aggiungerlo al menu Start.

Screenshot of secondary tiles

Per altre informazioni sui riquadri secondari, vedere panoramica dei riquadri secondari.

Aggiunta dello spazo dei nomi

Lo spazio dei nomi Windows.UI.StartScreen include la classe SecondaryTile.

using Windows.UI.StartScreen;

Inizializzare il riquadro secondario

I riquadri secondari sono costituiti da alcuni componenti chiave...

  • TileId: identificatore univoco che consente di identificare il riquadro tra gli altri riquadri secondari.
  • DisplayName: nome che si desidera visualizzare nel riquadro.
  • Argomenti: gli argomenti da restituire all'app quando l'utente fa clic sul riquadro.
  • Square150x150Logo: logo obbligatorio, visualizzato nel riquadro di dimensioni medie (e ridimensionato in riquadro di piccole dimensioni se non viene fornito alcun logo piccolo).

È NECESSARIO specificare valori inizializzati per tutte le proprietà precedenti oppure si otterrà un'eccezione.

È possibile usare un'ampia gamma di costruttori, ma l'uso del costruttore che accetta tileId, displayName, argomenti, square150x150Logo e desiredSize consente di impostare tutte le proprietà necessarie.

// Construct a unique tile ID, which you will need to use later for updating the tile
string tileId = "City" + zipCode;

// Use a display name you like
string displayName = cityName;

// Provide all the required info in arguments so that when user
// clicks your tile, you can navigate them to the correct content
string arguments = "action=viewCity&zipCode=" + zipCode;

// Initialize the tile with required arguments
SecondaryTile tile = new SecondaryTile(
    tileId,
    displayName,
    arguments,
    new Uri("ms-appx:///Assets/CityTiles/Square150x150Logo.png"),
    TileSize.Default);

Facoltativo: aggiunta del supporto per dimensioni maggiori dei riquadri

Se visualizzerai notifiche di riquadri avanzate nel riquadro secondario, probabilmente vuoi consentire all'utente di ridimensionare il riquadro in modo che sia ampio o grande, in modo che possano visualizzare ancora di più il contenuto.

Per abilitare dimensioni di riquadri ampie e grandi, è necessario fornire Wide310x150Logo e Square310x310Logo. Inoltre, se possibile, è necessario specificare Square71x71Logo per le dimensioni ridotte del riquadro (in caso contrario verrà ridimensionato il quadrato richiesto 150x150Logo per il riquadro piccolo).

È anche possibile fornire un elemento Square44x44Logo univoco, che viene visualizzato facoltativamente nell'angolo in basso a destra quando è presente una notifica. Se non ne fornisci uno, verrà invece usato Square44x44Logo dal riquadro primario.

// Enable wide and large tile sizes
tile.VisualElements.Wide310x150Logo = new Uri("ms-appx:///Assets/CityTiles/Wide310x150Logo.png");
tile.VisualElements.Square310x310Logo = new Uri("ms-appx:///Assets/CityTiles/Square310x310Logo.png");

// Add a small size logo for better looking small tile
tile.VisualElements.Square71x71Logo = new Uri("ms-appx:///Assets/CityTiles/Square71x71Logo.png");

// Add a unique corner logo for the secondary tile
tile.VisualElements.Square44x44Logo = new Uri("ms-appx:///Assets/CityTiles/Square44x44Logo.png");

Facoltativo: abilitare la visualizzazione del nome visualizzato

Per impostazione predefinita, il nome visualizzato NON verrà visualizzato. Per visualizzare il nome visualizzato su media/wide/large, aggiungere il codice seguente.

// Show the display name on all sizes
tile.VisualElements.ShowNameOnSquare150x150Logo = true;
tile.VisualElements.ShowNameOnWide310x150Logo = true;
tile.VisualElements.ShowNameOnSquare310x310Logo = true;

Facoltativo: riquadri secondari 3D

Puoi migliorare il riquadro secondario per Windows Realtà mista aggiungendo asset 3D. Gli utenti possono posizionare i riquadri 3D direttamente nella home page di Windows Realtà mista anziché nella menu Start quando si usa l'app in un ambiente Realtà mista. Ad esempio, puoi creare fotosphere di 360° che collegano direttamente in un'app visualizzatore foto a 360° o consentire agli utenti di inserire un modello 3D di una sedia da un catalogo mobili che apre una pagina dei dettagli sulle opzioni relative ai prezzi e ai colori per quell'oggetto quando selezionato. Per iniziare, vedere la documentazione per sviluppatori Realtà mista.

Aggiunta del riquadro secondario

Infine, richiedi di aggiungere il riquadro. Osseerva che questa operazione deve essere chiamata da un thread dell'interfaccia utente. Sul desktop verrà visualizzata una finestra di dialogo che chiede all'utente di confermare se vuole aggiungere il riquadro.

Importante

Se sei un'applicazione desktop che usa Desktop Bridge, devi prima eseguire un passaggio aggiuntivo come descritto in Aggiungere dalle app desktop

// Pin the tile
bool isPinned = await tile.RequestCreateAsync();

// TODO: Update UI to reflect whether user can now either unpin or pin

Controllare se esiste un riquadro secondario

Se l'utente visita una pagina nella tua app che è già stata aggiunta a Start, vuoi invece visualizzare un pulsante "Rimuovi".

Pertanto, quando si sceglie il pulsante da visualizzare, è necessario prima verificare se il riquadro secondario è attualmente aggiunto.

// Check if the secondary tile is pinned
bool isPinned = SecondaryTile.Exists(tileId);

// TODO: Update UI to reflect whether user can either unpin or pin

Rimozione di un riquadro secondario

Se il riquadro è attualmente aggiunto e l'utente fa clic sul pulsante di rimozione, è necessario rimuovere (eliminare) il riquadro.

// Initialize a secondary tile with the same tile ID you want removed
SecondaryTile toBeDeleted = new SecondaryTile(tileId);

// And then unpin the tile
await toBeDeleted.RequestDeleteAsync();

Aggiornamento di un riquadro secondario

Se è necessario aggiornare i logo, il nome visualizzato o qualsiasi altro elemento nel riquadro secondario, è possibile usare RequestUpdateAsync.

// Initialize a secondary tile with the same tile ID you want to update
SecondaryTile tile = new SecondaryTile(tileId);

// Assign ALL properties, including ones you aren't changing

// And then update it
await tile.UpdateAsync();

Enumerazione di tutti i riquadri secondari aggiunti

Se è necessario individuare tutti i riquadri aggiunti dall'utente, anziché usare SecondaryTile.Exists, in alternativa, è possibile usare SecondaryTile.FindAllAsync().

// Get all secondary tiles
var tiles = await SecondaryTile.FindAllAsync();

Invio di una notifica di riquadro

Per informazioni su come visualizzare contenuti avanzati nel riquadro tramite notifiche di riquadri, vedere Inviare una notifica di riquadro locale.