Ottimizza le app per ChromeOS

Le app Android svolgono un ruolo importante nel ridefinire l'aspetto dell'informatica moderna su schermi grandi. Ma il semplice esecuzione di un'app mobile su Chromebook non ti offre la migliore esperienza utente possibile.

In questa pagina vengono descritti alcuni modi per personalizzare la tua esperienza per laptop e fattori di forma convertibili. Consulta le nostre elenco completo dei test per scoprire di più sui test dell'app per compatibilità con questi dispositivi.

Sfrutta il supporto per il multi-finestra in formato libero

L'implementazione delle app per Android su ChromeOS include la modalità multi-finestra di base assistenza in tempo reale. Invece di occupare sempre lo schermo intero, Android esegue il rendering su ChromeOS in contenitori di finestre in formato libero, opzione più appropriata per questi dispositivi.

Gli utenti possono ridimensionare la finestra che contiene l'app per Android, come mostrato nella Figura 1. Per assicurarti che le finestre in formato libero vengano ridimensionate correttamente e vengano visualizzate tutti i contenuti all'utente, leggi le linee guida in Gestione delle finestre.

Figura 1. Una finestra dell'app ridimensionabile.

Puoi migliorare l'esperienza utente quando la tua app viene eseguita su ChromeOS seguendo queste best practice pratiche:

  • Gestisci correttamente il ciclo di vita dell'attività in modalità multi-finestra e assicurarsi di continuare ad aggiornare l'UI, anche quando l'app non è finestra con lo stato attivo più in alto.
  • Assicurati che il layout dell'app venga adattato in modo appropriato ogni volta che l'utente ridimensiona la finestra.
  • Personalizza le dimensioni iniziali della finestra dell'app specificandone dimensioni del lancio.
  • Tieni presente che orientamento dell'attività principale dell'app influisce su tutte le relative finestre.

Personalizza il colore della barra superiore

ChromeOS utilizza il tema delle app per colorare la barra superiore visualizzata nella parte superiore dell'app. che indica quando gli utenti hanno premuto i controlli della finestra e il pulsante Indietro. Per rendere che l'app abbia un aspetto raffinato e personalizzato per ChromeOS, colorPrimary e, se possibile, colorPrimaryDark nel tema della tua app.

colorPrimaryDark viene utilizzato per colorare la barra superiore. Se solo colorPrimary è definito, ChromeOS ne utilizza una versione più scura in nella barra superiore. Per ulteriori informazioni, visita la pagina Stili e temi.

Supporta tastiera, trackpad e mouse

Tutti i Chromebook sono dotati di tastiera fisica e trackpad e alcuni hanno anche touchscreen. Alcuni dispositivi possono convertire il formato laptop in tablet.

Nelle tue app per ChromeOS, supporta l'input da mouse, trackpad e tastiera quindi l'app è utilizzabile senza touchscreen. Molte app supportano già il mouse e trackpad senza la necessità di ulteriori interventi. Tuttavia, è meglio personalizzare il database comportamento corretto del mouse e per supportare e distinguere tra input del mouse e del tocco.

Assicurati che:

  • Tutti i target sono cliccabili con il mouse.
  • Tutte le superfici scorrevoli al tocco scorrono sugli eventi della rotellina del mouse, come mostrato in figura 2.
  • Gli stati di passaggio vengono implementati con un attento giudizio per migliorare Rilevamento dell'interfaccia utente senza sovraccaricare l'utente, come mostrato nella figura 3.

Figura 2. Scorrimento con la rotellina del mouse.

Figura 3. Stati al passaggio del mouse del pulsante.

Se necessario, differenzia tra input del mouse e input tocco. Per ad esempio, tocca & su un elemento potrebbe attivare una UI a selezione multipla, fare clic con il tasto destro del mouse sullo stesso elemento potrebbe invece attivare un menu opzioni.

Cursori personalizzati

Personalizza la tua app cursori del mouse per indicare a quale elemento dell'interfaccia utente con cui possono interagire e come. Puoi impostare PointerIcon in modo che utilizzi Quando gli utenti interagiscono con una vista chiamando il metodo setPointerIcon().

Nelle app, mostra quanto segue:

  • Puntatori I-beam per il testo
  • Punti di manipolazione di ridimensionamento ai bordi dei livelli ridimensionabili
  • Puntatori a mano aperta e chiusa per contenuti che possono essere spostati e trascinati con un gesto clic e trascina
  • Rotelline di elaborazione

La classe PointerIcon fornisce le costanti che per implementare cursori personalizzati.

Scorciatoie da tastiera e navigazione

Poiché ogni Chromebook ha una tastiera fisica, fornisci tasti di scelta rapida per consentono agli utenti di essere più produttivi. Ad esempio, se la tua app supporta stampa, puoi premere Ctrl+P per aprire una finestra di dialogo di stampa.

Allo stesso modo, puoi gestire tutti gli elementi importanti dell'interfaccia utente utilizzando la navigazione tramite schede. Questo è particolarmente importante per l'accessibilità. Per soddisfare gli standard di accessibilità, tutte le piattaforme UI devono essere incentrate su elementi ovvi e conformi all'accessibilità stati, come illustrato nelle figure seguenti:

Figura 4. Schede trasversali.

Figura 5. Sostituzione di un gesto di scorrimento con un controllo visualizzato al passaggio del mouse.

Assicurati di implementare alternative di tastiera o mouse per le applicazioni principali funzionalità nascoste nelle interazioni specifiche del tocco, ad esempio tocco e azioni di sospensione, scorrimenti o altri gesti multi-touch. Una soluzione di esempio è fornire che appaiono in una superficie al passaggio del mouse.

Per ulteriori informazioni sul supporto di tastiera, trackpad e mouse, vedi Compatibilità degli input su schermi di grandi dimensioni.

Migliora ulteriormente l'input dell'utente

Per ottenere una funzionalità di livello desktop per la tua app, considera quanto segue: di input orientati alla produttività.

Menu contestuali

Menu contestuali di Android, che sono un ulteriore acceleratore per indirizzare gli utenti a funzionalità dell'app, possono essere attivate con un clic del mouse o il tasto pulsante secondario o tramite tocco e Tieni premuto su un touchscreen:

Figura 6. Un menu contestuale visualizzato facendo clic con il tasto destro del mouse.

Trascina

Creando interazioni di trascinamento, come quella nella figura seguente, può portare a una produttività efficiente e intuitiva funzionalità per la tua app. Per maggiori informazioni, vedi Trascinare.

Figura 7. Trascinamento in un'interfaccia ad albero di file.

Supporto per stilo

Il supporto dello stilo è fondamentale per le app di disegno e appunti. Fornisci dati avanzati supporto per Chromebook e tablet dotati di stilo implementando le interazioni su misura per l'uso dell'input dello stilo.

Tieni in considerazione le potenziali variazioni in diversi hardware dello stilo durante la progettazione delle interazioni con lo stilo. Per una panoramica delle per le API per stilo, vedi Compatibilità degli input su schermi di grandi dimensioni.

Rendi adattabili i tuoi layout

Sfruttare in modo appropriato lo spazio sullo schermo disponibile per l'app, indipendentemente dal fatto che il suo stato visivo (a schermo intero, verticale, orizzontale o a finestre). Alcuni esempi di un buon utilizzo dello spazio include:

  • Mostra l'architettura dell'app.
  • Limita la lunghezza del testo e le dimensioni delle immagini a una larghezza massima.
  • Sfrutta meglio le proprietà immobiliari nella barra degli strumenti dell'app.
  • Migliora il posizionamento delle caratteristiche dell'interfaccia utente adattando l'app all'utilizzo del mouse dell'uso delle pollici.
  • Ottimizza le dimensioni di video e immagini e stabilisci un insieme di larghezza massima e altezza per tutti i contenuti multimediali e massimizza la leggibilità e la leggibilità.
  • Implementa un sistema di colonne adattabile. Per ulteriori informazioni, consulta la sezione Adattatori griglia di layout.
  • Ridimensiona e modifica l'interfaccia utente quando necessario utilizzando il sistema a colonne. Se possibile, evita di aprire nuove finestre.
  • Rimuovi o riduci l'importanza dei componenti di scorrimento orizzontale.
  • Evita l'interfaccia utente modale a schermo intero. Usa UI in linea, come indicatori di avanzamento e per tutte le azioni non critiche.
  • Utilizzare componenti dell'interfaccia utente migliorati, ad esempio selettori di data e ora, campi di testo e menu progettati per mouse, tastiera e schermi più grandi.
  • Utilizza modifiche in linea, colonne aggiuntive o UI modale invece di una nuova attività per un elemento di modifica medio-piccolo.
  • Rimuovi o modifica i pulsanti di azione mobile (FAB) per migliorare la tastiera per la navigazione. Per impostazione predefinita, una posizione FAB è l'ultima nel passaggio tra tabulazioni ordine. Deve essere la prima, perché è l'azione principale, oppure sostituirlo con un'altra attrattiva di livello superiore.

Figura 8. Simulazioni di un layout adattabile su uno schermo di dimensioni pari a un telefono e a un computer.

Un pulsante Indietro a livello di sistema è uno schema portato dalle radici portatili di Android, che non si adattano bene a un contesto desktop.

Poiché la tua app diventa sempre più personalizzata per un ambiente laptop, ti consigliamo di prendere in considerazione verso uno schema di navigazione che rende meno il pulsante Indietro. Lascia che gestisce il proprio stack di cronologia fornendo i dati in-app pulsanti, breadcrumb o altri percorsi di fuga, come i pulsanti di chiusura o annullamento all'interno dell'interfaccia utente su schermo grande.

Puoi controllare se la tua app visualizza un pulsante Indietro nella finestra utilizzando impostare una preferenza all'interno <activity> del tag. Un'impostazione di true nasconde pulsante Indietro:

<meta-data android:name="WindowManagerPreference:SuppressWindowControlNavigationButton" android:value="true" />

Risolvere i problemi relativi alle immagini di anteprima della fotocamera

Potrebbero verificarsi problemi con la fotocamera se l'app può essere eseguita solo con orientamento verticale ma l'utente lo esegue su uno schermo orizzontale. In questo caso, l'anteprima o il risultato acquisito potrebbe essere ruotato in modo errato.

La modalità di compatibilità cambia il modo in cui il sistema gestisce gli eventi, ad esempio le modifiche dell'orientamento, ChromeOS In questo modo si evitano problemi quando la videocamera viene usata modalità di orientamento. Per attivare la modalità di compatibilità, devi soddisfare i seguenti criteri:

  • Scegli come target almeno Android 7.0 (livello API 24). La livello minimo di SDK può essere inferiore.
  • Rendi la tua app ridimensionabile.

Gestire le impostazioni del dispositivo

Considera le seguenti impostazioni del dispositivo per le app eseguite su ChromeOS.

Regolare il volume

I dispositivi ChromeOS sono dispositivi a volume fisso: le app che riproducono l'audio hanno una propria controlli del volume. Segui le linee guida per Operazione in corso con dispositivi a volume fisso.

Modificare la luminosità dello schermo

Non puoi regolare la luminosità del dispositivo su ChromeOS. Le chiamate al system settings e WindowManager.LayoutParams vengono ignorati.

Materiali didattici aggiuntivi

Per ulteriori informazioni sull'ottimizzazione delle app Android per i Chromebook, consulta le seguenti risorse: