Simulador iOS e Emulador Android

Dispositivos virtuais oferecem iteração rápida no macOS e em qualquer desktop - sem cabos USB, reinícios instantâneos e screenshots repetíveis para QA de layout. Combine-os com atalhos do Expo CLI para que os projetos do SDK 57 abram no simulador ou AVD correto a cada vez.

Receita

Cartão de receita de referência rápida - pronto para copiar e colar.

# Inicia o Metro, depois abre o dispositivo virtual padrão
npx expo start
# Pressione i → Simulador iOS (somente macOS)
# Pressione a → Emulador Android (ANDROID_HOME + um AVD necessário)
 
# Seleciona um dispositivo específico interativamente
# Shift+I → Lista de simuladores iOS
# Shift+A → Lista de emuladores/dispositivos Android
 
# Inicia diretamente sem o menu interativo
npx expo start --ios
npx expo start --android
 
# Captura um screenshot do simulador/emulador iniciado
xcrun simctl io booted screenshot ./snapshots/ios-$(date +%Y%m%d-%H%M%S).png
adb exec-out screencap -p > ./snapshots/android-$(date +%Y%m%d-%H%M%S).png

Quando usar isso:

• Trabalho diário em recursos quando um dispositivo físico é inconveniente ou indisponível.
• Verificação de layouts em múltiplos tamanhos de tela (iPhone SE, Pro Max, Pixel Fold, tablet).
• Captura de screenshots de linha de base antes de um refatoramento de estilo.
• Reprodução de bugs específicos do SO em um nível de API iOS ou Android fixo.
• Testes de fumaça em CI que iniciam um emulador e carregam uma build de desenvolvimento.

Exemplo de Trabalho

#!/usr/bin/env bash
# scripts/device-matrix.sh - inicia simuladores chave, captura snapshots, registra dimensões
set -euo pipefail
 
OUT_DIR="${1:-./snapshots/matrix-$(date +%Y%m%d)}"
mkdir -p "$OUT_DIR"
 
echo "▶ Iniciando Metro em segundo plano (dev-client assumido)…"
npx expo start --dev-client --non-interactive &
METRO_PID=$!
sleep 8
 
capture_ios() {
  local UDID="$1"
  local LABEL="$2"
  xcrun simctl boot "$UDID" 2>/dev/null || true
  xcrun simctl bootstatus "$UDID" -b
  # O Expo CLI tem como alvo o simulador aberto mais recentemente
  open -a Simulator --args -CurrentDeviceUDID "$UDID"
  sleep 4
  xcrun simctl io "$UDID" screenshot "$OUT_DIR/ios-${LABEL}.png"
  xcrun simctl list devices booted | grep "$UDID" || true
}
 
capture_android() {
  local AVD="$1"
  local LABEL="$2"
  emulator -avd "$AVD" -no-snapshot-load -no-boot-anim &
  adb wait-for-device
  while [ "$(adb shell getprop sys.boot_completed | tr -d '\r')" != "1" ]; do sleep 2; done
  adb exec-out screencap -p > "$OUT_DIR/android-${LABEL}.png"
  adb emu kill
}
 
# Matriz iOS - lista primeiro os runtimes disponíveis: xcrun simctl list devices available
capture_ios "iPhone-16-Pro" "iphone-16-pro" || echo "⚠️  Crie o iPhone 16 Pro em Xcode > Settings > Components"
capture_ios "iPad-mini-A17-Pro" "ipad-mini" || echo "⚠️  Crie o iPad mini em Xcode Components"
 
# Matriz Android - lista os AVDs: emulator -list-avds
capture_android "Pixel_8_API_36" "pixel-8" || echo "⚠️  Crie o Pixel 8 API 36 AVD no Android Studio"
 
kill "$METRO_PID" 2>/dev/null || true
echo "✅ Snapshots escritos em $OUT_DIR"

// App.tsx - rótulo de tamanho na tela para revisão de snapshot
import { StyleSheet, Text, useWindowDimensions, View } from "react-native";
import { useSafeAreaInsets } from "react-native-safe-area-context";
 
export default function App() {
  const { width, height, fontScale } = useWindowDimensions();
  const insets = useSafeAreaInsets();
 
  return (
    <View style={[styles.screen, { paddingTop: insets.top, paddingBottom: insets.bottom }]}>
      <Text style={styles.title}>Sonda de matriz de dispositivos</Text>
      <Text style={styles.row}>Janela: {Math.round(width)} × {Math.round(height)}</Text>
      <Text style={styles.row}>Escala da fonte: {fontScale.toFixed(2)}</Text>
      <Text style={styles.row}>Safe top: {insets.top}px · bottom: {insets.bottom}px</Text>
      <View style={styles.card}>
        <Text>O cartão deve permanecer dentro da área segura em telefones com entalhe e tablets.</Text>
      </View>
    </View>
  );
}
 
const styles = StyleSheet.create({
  screen: { flex: 1, paddingHorizontal: 16, backgroundColor: "#f8fafc" },
  title: { fontSize: 22, fontWeight: "700", marginBottom: 12 },
  row: { fontSize: 14, color: "#475569", marginBottom: 4 },
  card: { marginTop: 24, padding: 16, borderRadius: 12, backgroundColor: "#e0e7ff" },
});

O que isso demonstra:

• Atalhos de teclado do Expo CLI (i, a, Shift+I, Shift+A) como o caminho principal de inicialização.
• xcrun simctl e adb exec-out screencap para snapshots visuais reproduzíveis fora do aplicativo.
• Um script mínimo de matriz de dispositivos que inicia múltiplos fatores de forma e grava PNGs em uma pasta com data.
• useWindowDimensions + insets de área segura para que os screenshots codifiquem o contexto de layout que os revisores precisam.

Mergulho Profundo

Como Funciona

• npx expo start inicia o Metro; pressionar i ou a instrui o Expo CLI a encontrar ou iniciar um simulador/AVD e instalar o Expo Go (fluxo de trabalho gerenciado) ou abrir sua build de desenvolvimento se uma estiver instalada.
• O Expo CLI tem como alvo o Simulador iOS aberto mais recentemente - se múltiplos simuladores estiverem iniciados, o último focado vence. Use Shift+I para escolher explicitamente.
• O Android requer ANDROID_HOME no seu PATH e pelo menos um AVD criado no Gerenciador de Dispositivos Virtuais do Android Studio. O Expo CLI invoca emulator e adb internamente.
• Snapshots aqui significam capturas PNG da tela virtual - úteis para comparação visual, QA de design e relatórios de bugs. Eles não são snapshots de componentes Jest (veja Configuração do Jest para Expo).
• RN 0.86 / SDK 57 compila contra Android 16 (API 36) - instale essa plataforma no Android Studio antes que npx expo run:android ou builds de emulador sejam bem-sucedidas.

Lista de Verificação de Configuração da Plataforma

# Ambiente Android macOS (adicione a ~/.zshrc)
export ANDROID_HOME=$HOME/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/emulator:$ANDROID_HOME/platform-tools
 
# Abre o Simulador manualmente quando o Expo CLI parecer travado
open -a Simulator

Matriz de Dispositivos Recomendada

Execute suas telas mais pesadas em pelo menos um dispositivo iOS + um Android por nível antes de um candidato a lançamento.

Limitações do Simulador (APIs Expo)

Valide a câmera, sensores e push em um dispositivo físico antes de enviar.

Comandos de Dispositivo Expo CLI

Notas TypeScript

import * as Device from "expo-device";
 
// expo-device é a verificação confiável - simuladores/emuladores retornam isDevice === false
if (__DEV__ && !Device.isDevice) {
  console.log("Dispositivo virtual - valide câmera, push e desempenho em hardware.");
}

Instale com npx expo install expo-device.

Armadilhas

• Expo CLI travado em "Opening simulator" - O aplicativo Simulador às vezes ignora o comando de abertura. Correção: Execute open -a Simulator, escolha File > Open Simulator, selecione um dispositivo e pressione i novamente.
• O simulador iOS errado recebe o bundle - Múltiplos simuladores iniciados confundem o direcionamento. Correção: Feche simuladores extras ou use Shift+I para selecionar um; o Expo CLI sempre tem como alvo o mais recentemente aberto.
• Conflito de versão adb Android - O adb do sistema entra em conflito com as platform-tools do SDK. Correção: Coloque $ANDROID_HOME/platform-tools primeiro no PATH; verifique com which adb.
• SDK Platform 36 Android ausente - O Gradle falha com erros de SDK não encontrado no RN 0.86. Correção: Android Studio → SDK Platforms → instale Android 16 (API 36).
• Mismatch de SDK do Expo Go no simulador - Um novo projeto SDK 57 pode não carregar em uma instalação mais antiga do Expo Go. Correção: Execute npx expo-go download ios 57 ou crie uma build de desenvolvimento.
• Assumir que o simulador é igual ao desempenho do dispositivo - Simuladores usam CPU/GPU de desktop; perfis de lentidão enganam. Correção: Perfilar em hardware para SLOs de rolagem e animação.
• Screenshots com tema ou local incorretos - Capturas de matriz tiradas antes que o aplicativo defina a aparência parecem inconsistentes. Correção: Defina o tema/local no código do aplicativo antes da captura; armazene metadados junto com os PNGs.

Alternativas

FAQs

xcrun simctl io booted screenshot screenshot.png

adb exec-out screencap -p > screenshot.png

emulator -list-avds

Relacionado

• Noções Básicas de Desenvolvimento Local - expo start, túnel vs LAN e fluxos de trabalho de QR
• Teste em Dispositivo Físico - USB, depuração sem fio e validação de hardware
• expo-dev-client - builds de desenvolvimento personalizadas em simuladores com módulos nativos
• Expo Go vs Builds de Desenvolvimento - quando o Expo Go em emuladores é suficiente
• Ferramentas de Desenvolvimento React Native - inspecione elementos e desempenho em dispositivos virtuais
• create-expo-app Quickstart - crie um scaffold do SDK 57 antes de abrir simuladores

Versões da Stack: Esta página foi escrita para React 19.2.3, React Native 0.86.0 e Expo SDK 57 (expo ~57.0.4).