Compartir a través de

Directrices para destinos táctiles

  • Artículo

Todos los elementos interactivos de la interfaz de usuario de la aplicación de Windows deben ser lo suficientemente grandes como para que los usuarios accedan y usen con precisión, independientemente del tipo de dispositivo o del método de entrada.

La compatibilidad con la entrada táctil (y la naturaleza relativamente imprecisa del área de contacto táctil) requiere una mayor optimización con respecto al tamaño de destino y el diseño del control, ya que el conjunto más grande y complejo de datos de entrada notificados por el digitalizador táctil se usa para determinar el destino previsto (o más probable) del usuario.

Todos los controles para UWP se han diseñado con diseños y tamaños de destino táctiles predeterminados que te permiten crear aplicaciones visualmente equilibradas y atractivas que son cómodas, fáciles de usar e inspiran confianza.

En este tema, se describen estos comportamientos predeterminados para que puedas diseñar la aplicación para una facilidad de uso máxima mediante controles de plataforma y controles personalizados (si la aplicación las necesita).

API importantes: Windows.UI.Core, Windows.UI.Input, Windows.UI.Xaml.Input

Tamaño Fluent Standard

El tamaño Fluent Standard se ha creado para proporcionar un equilibrio entre la densidad de la información y la comodidad del usuario. De hecho, todos los elementos de la pantalla se alinean con un destino de 40 x 40 píxeles efectivos (epx), que permite que los elementos de la interfaz de usuario se alineen con una cuadrícula y se escalen de forma adecuada en función del escalado de nivel de sistema.

Nota:

Para obtener más información sobre los píxeles efectivos y el escalado, consulta Tamaños de pantalla y puntos de interrupción

Para obtener más información sobre el escalado de nivel de sistema, consulta Alineación, margen, espaciado interno.

Tamaño Fluent Compact

Las aplicaciones pueden mostrar un mayor nivel de densidad de información con el ajuste de tamaño de Fluent Compact. El ajuste de tamaño compacto alinea los elementos de la interfaz de usuario con un destino epx de 32x32, lo que permite que los elementos de la interfaz de usuario se alineen con una cuadrícula más estrecha y se escalen adecuadamente en función del escalado del nivel del sistema.

Ejemplos

El ajuste de tamaño compacto se puede aplicar en el nivel de página o cuadrícula.

De página

<Page.Resources>
    <ResourceDictionary Source="ms-appx:///Microsoft.UI.Xaml/DensityStyles/Compact.xaml" />
</Page.Resources>

Nivel de cuadrícula

<Grid>
    <Grid.Resources>
        <ResourceDictionary Source="ms-appx:///Microsoft.UI.Xaml/DensityStyles/Compact.xaml" />
    </Grid.Resources>
</Grid>

Tamaño de destino

En general, establezca el tamaño del destino táctil en un rango cuadrado de 7,5 mm (40 x 40 píxeles en una pantalla de 135 PPI en una meseta de escala de 1,0x). Normalmente, los controles de UWP se alinean con el destino táctil de 7,5 mm (esto puede variar en función del control específico y de cualquier patrón de uso común). Consulte Tamaño y densidad del control para obtener más detalles.

Estas recomendaciones de tamaño de destino se pueden ajustar según sea necesario en su escenario concreto. Estos son algunos aspectos que hay que tener en cuenta:

  • Frecuencia de toques: considere la posibilidad de hacer destinos que se presionan repetidamente o con frecuencia más grandes que el tamaño mínimo.
  • Consecuencia del error: los destinos que tienen consecuencias graves si se tocan en error deben tener un relleno mayor y colocarse más lejos del borde del área de contenido. Esto es especialmente cierto para los destinos que se tocan con frecuencia.
  • Posición en el área de contenido.
  • Factor de forma y tamaño de pantalla.
  • Posición del dedo.
  • Visualizaciones táctiles.

Ejemplos

Ejemplos de archivo