Trabajar con tamaños de pantalla de watchOS en Xamarin
Apple Watch está disponible en dos tamaños de pantalla:
38 mm
- 136 x 170 píxeles lógicos (272 x 340 píxeles físicos)
42 mm
- 156 x 195 píxeles lógicos (312 x 390 píxeles físicos).
Debe tener en cuenta el tamaño de pantalla al diseñar y probar las aplicaciones.
Diseñador de la interfaz de watchOS
De forma predeterminada, el diseñador de Visual Studio para Mac mostrará controladores de interfaz de inspección en Cualquier Apple Watch.
Use el menú de tamaño para editar y obtener una vista previa del guion gráfico en cualquiera de los tamaños de pantalla disponibles: 38 mm o 42 mm:
El tamaño de pantalla mayor a veces representará contenido que se truncaría u ocultaría en la pantalla más pequeña. Asegúrese de probar ambos tamaños.
Diseño de interfaces
La aplicación debe mostrar el mismo contenido en la pantalla, independientemente del tamaño, y debe expandir o contraer elementos según corresponda. En el diseñador de Visual Studio para Mac, en el Inspector de atributos, debe usar Relativo al contenedor o Tamaño para ajustar contenido en lugar de tamaños fijos.
Dado que la pantalla de inspección está rodeada de un bisel negro, no se recomienda proporcionar relleno alrededor de la interfaz. Deje que los elementos permanezcan en el borde de la pantalla y permita al bisel formar un borde natural alrededor de la aplicación.
Simulador de watchOS
Al realizar pruebas en el simulador, puede cambiar fácilmente entre los dos tamaños de pantalla con el menú Hardware > Dispositivo.
Recursos de imagen
Debe usar varios recursos de imagen si un solo recurso no se ve bien en diferentes tamaños. Los catálogos de recursos de imagen permiten especificar mapas de bits independientes para cada tamaño:
// specify the asset name, the correct size will automatically be loaded
staticImage.SetImage(UIImage.FromBundle("Walkway"));
Como alternativa, use código para determinar el tamaño de pantalla y cargar imágenes diferentes por completo:
bool large = WKInterfaceDevice.CurrentDevice.ScreenBounds.Size.Width > 136.0;
// Load image depending on screen size
using (var image = UIImage.FromBundle (large ? "42mm-Walkway" : "38mm-Walkway"))
{
myImage.SetImage (image);
}
Obtenga más información sobre el uso del control de imagen.