Condividi tramite

Uso di controlli segmentati tvOS in Xamarin

  • Articolo

Un controllo segmentato fornisce un set di elementi lineari, ognuno dei quali può contenere un'icona o un testo e viene usato per fornire un set di scelte correlate all'utente.

Controlli di segmento di esempio

Apple offre i suggerimenti seguenti per l'uso dei controlli segmentati:

  • Fornire spazio ampio: prestare attenzione a fornire ampio spazio tra gli altri elementi attivabili e un controllo segmentato. Un singolo segmento viene selezionato quando è attivo (non quando si fa clic) e l'utente può modificare accidentalmente i segmenti quando desidera effettivamente selezionare un altro elemento attivabile nel segmento corrente.
  • Usare le visualizzazioni suddivise per il filtro del contenuto: i controlli segmentati non fanno scelte valide per il filtro del contenuto perché le visualizzazioni suddivise sono state progettate per facilitare lo spostamento tra il contenuto e i filtri.
  • Limite massimo di sette segmenti : è consigliabile provare a mantenere il numero massimo di segmenti al di sotto di otto (8) perché è più facile da analizzare dall'altra parte della stanza sul divano e spostarsi più facilmente.
  • Usa dimensioni contenuto segmento coerente: tutti i segmenti hanno la stessa larghezza e, se possibile, è consigliabile provare a mantenere il contenuto in ogni segmento con le stesse dimensioni. Questo non solo rende i controlli segmento più visivamente piacevoli, ma semplifica la lettura a colpo d'occhio.
  • Evitare di combinare icone e testo : ogni singolo segmento può contenere un'icona o un testo, ma non entrambi. Sebbene sia possibile combinare icone e testo nello stesso controllo segmentato, è consigliabile evitare questa operazione.

Informazioni sulle icone dei segmenti

Apple suggerisce l'uso di immagini semplici e riconoscibili per le icone segmento, ad esempio una lente di ingrandimento per la ricerca. Icone eccessivamente complesse sono difficili da riconoscere su uno schermo TV nella stanza, quindi è consigliabile limitare le icone a rappresentazioni semplici.

Non è possibile combinare testo e icone in un determinato segmento ed evitare di combinare icone e testo in un singolo controllo segmentato. Deve essere tutte le icone o tutto il testo.

Testo segmento

Apple offre i suggerimenti seguenti per l'uso del testo segmento:

  • Usare sostantivi brevi e significativi: il titolo segmento deve indicare chiaramente il tipo di contenuto che l'utente deve aspettarsi quando si seleziona il segmento specificato. Ad esempio: Musica o video.
  • Usa maiuscole maiuscole/minuscole titolo: ogni parola del titolo Segmenti deve essere maiuscola ad eccezione di articoli, congiunzioni e preposizioni di meno di quattro (4).
  • Usa Titoli brevi e mirati: mantieni i titoli, brevi e concentrati sul tipo di contenuto previsto quando viene selezionato segmento.

Anche in questo caso, non è possibile combinare testo e icone in un determinato segmento ed evitare di combinare icone e testo in un singolo controllo segmentato.

Controlli segmento e storyboard

Il modo più semplice per usare i controlli segmento in un'app Xamarin.tvOS consiste nell'aggiungerli all'interfaccia utente dell'app usando iOS Designer.

  1. Nel riquadro della soluzione fare doppio clic sul Main.storyboard file e aprirlo per la modifica.

  2. Trascinare un controllo segmento dalla casella degli strumenti e rilasciarlo nella visualizzazione:

    Controllo segmento

  3. Nella scheda Widget del riquadro proprietà è possibile modificare diverse proprietà del controllo segmento, ad esempio stile e stato:

    Scheda Widget

  4. Usare il campo Segmenti per controllare il numero di segmenti nel controller.

  5. Selezionare un determinato segmento dall'elenco a discesa Segmento per regolare le singole proprietà, ad esempio Titolo o Immagine , e controllare se un determinato segmento è Abilitato o Selezionato quando viene visualizzato il controllo.

  6. Assegnare infine Nomi ai controlli in modo che sia possibile rispondere nel codice C#. Ad esempio:

    Assegnare un nome

  7. Salva le modifiche.

Per altre informazioni sull'uso degli storyboard, vedere la guida introduttiva hello, tvOS.

Utilizzo di controlli segmentati

Come indicato in precedenza, s Segmented Control fornisce un set di elementi lineari, ognuno dei quali può contenere un'icona o un testo e viene usato per fornire un set di scelte correlate all'utente.

Esistono diversi modi per usare i controlli segmentati nell'app Xamarin.tvOS.

Esposto come nomi ed eventi

Se è stato creato il controllo segmento in Progettazione interfaccia ed è stato esposto come controllo denominato e un evento, è possibile usare il codice seguente per rispondere alla modifica del segmento:

partial void PlayerCountChanged (Foundation.NSObject sender) {

    // Take action based on the number of players selected
    switch(PlayerCount.SelectedSegment) {
    case 0:
        // Do something if the segment is selected
        ...
        break;
    case 1:
        // Do something if the segment is selected
        ...
        break;
    case 2:
        // Do something if the segment is selected
        ...
        break;
    }
}

Nel caso dell'esempio precedente, il controllo segmento è stato esposto come PlayerCount nome e PlayerCountChanged azione evento. Per ulteriori informazioni sull'uso di azioni e outlet, vedere la sezione Scrittura del codice con punti di vendita e azioni della guida introduttiva hello, tvOS.

La SelectedSegment proprietà ottiene o imposta il segmento attualmente selezionato come indice in base zero (0). Pertanto, se si hanno cinque (5) segmenti, il primo segmento avrà un indice pari a zero (0) e l'ultimo indice di quattro (4).

Modifica dei segmenti

In qualsiasi momento è possibile modificare sia il numero che il contenuto dei controlli segmentati. Usare il codice seguente per inserire una nuova icona Segmento:

// Icon Segment
SegmentedControl.InsertSegment(UIImage.FromFile("icon.png"), 0, true);

// Text Segment
SegmentedControl.InsertSegment("New Segment", 0, true);

Il secondo parametro definisce dove verrà inserito segmento utilizzando un indice in base zero (0). Se l'ultimo parametro è true l'inserimento verrà animato.

Per rimuovere un determinato segmento, usare quanto segue:

SegmentedControl.RemoveSegmentAtIndex(0, true);

In alternativa, rimuovere tutti i segmenti:

SegmentedControl.RemoveAllSegments();

Anche in questo caso, se l'ultimo parametro è true, la rimozione verrà animata. Utilizzare la NumberOfSegments proprietà per restituire il numero corrente di Segmenti.

Per ottenere il titolo o l'icona per un determinato segmento, usare quanto segue:

// Get title
var title = SegmentedControl.TitleAt(0);

// Get icon
var icon = SegmentedControl.ImageAt(0);

Per modificare il titolo o l'icona, usare quanto segue:

// Set title
SegmentedControl.SetTitle("New Title", 0);

// Set icon
SegmentedControl.SetImage(UIImage.FromFile("icon.png"), 0);

Per verificare se un determinato segmento è abilitato, usare quanto segue:

if (SegmentedControl.IsEnabled(0)) {
    // Do something
    ...
}

Per abilitare/disabilitare un determinato segmento, usare quanto segue:

SegmentedControl.SetEnabled(false, 0);

Modifica dell'aspetto del controllo segmentato

È possibile usare il codice seguente per modificare lo sfondo di un determinato segmento in un'immagine:

SegmentedControl.SetBackgroundImage (UIImage.FromFile("background.png"), UIControlState.Normal, UIBarMetrics.Default);

Dove UIControlState specifica lo stato del controllo per cui si imposta l'immagine come segue:

  • Normale
  • Evidenziato
  • Disabilitata
  • Selected
  • Focused

E UIBarMetrics specifica le metriche da usare come:

  • Default
  • Compact
  • DefaultPrompt
  • CompactPrompt

Inoltre, è possibile impostare il divisore tra i segmenti usando:

SegmentedControl.SetDividerImage (UIImage.FromFile("divider.png"), UIControlState.Normal, UIControlState.Normal, UIBarMetrics.Default);

Dove il primo UIControlState specifica lo stato del segmento a sinistra del divisore e il secondo UIControlState specifica lo stato del segmento a destra.

Riepilogo

Questo articolo ha illustrato la progettazione e l'uso del controllo segmentato all'interno di un'app Xamarin.tvOS.