¿Qué es 'Variar por rasgos' en Xcode 8?

Estoy usando las clases AutoLayout y Size, pero con el lanzamiento de iOS 10 y el nuevo Xcode 8.0, hay una nueva opción Vary for Traits. Es este reemplazo de Size Classe para diferentes anchos y altos de dispositivos.

Al seleccionar la widthcasilla de verificación, se muestra varying 14 compact width devices.

Al seleccionar la heightcasilla de verificación, se muestra varying 18 compact height devices.

Al seleccionar ambas casillas de verificación, se muestra varying 11 compact width regular height devices.

¿Cómo hacer uso de estas opciones? ¿Podemos usar AutoLayout con clases de tamaño como Xcode7.0? Si alguien tiene un conocimiento profundo, explíquelo.

Esta es solo una extensión de cómo usar "Vary Traits" rápidamente en su proyecto para agregar diferentes diseños para iPad y iPhones.

Lea esto para comprender más sobre las clases de tamaño.

https://developer.apple.com/reference/uikit/uitraitcollection

Si se saltea el ejemplo que sigue a continuación, lea el Resumen al final.

• OBJETIVO:

Necesita un botón que tenga diferentes anchos en iPhone y iPad. El primero tiene un ancho de 80 y el último tiene un ancho de 300.

• MÉTODO 1 :

Varíe para los rasgos con múltiples restricciones instalados.

• PASOS:

  1. Agregue primero las restricciones comunes como Centrar el botón horizontal y verticalmente.

2. Elija VaryForTraits y para las pantallas de iPhone según las pautas de clase de tamaño, una clase de tamaño C * R se ajusta al modelo y esto verificamos las marcas de ancho y alto en PopUp. Descarte la ventana emergente haciendo clic en cualquier lugar de la pantalla.

3. Agregue la constante de ancho y verifique si la restricción se agrega para la clase de tamaño C * R. Después de agregar restricciones, elija el botón Done Varying.

4. Para las pantallas de iPad, seleccione nuevamente cualquier dispositivo iPad y elija VaryForTraits y esta vez al hacer clic en altura-ancho, debería mostrar la variación R * R.

5. Nuevamente agregue una restricción de ancho, la última restricción de ancho de iPhone agregada debe estar sin resaltar como en la captura de pantalla. El valor agregado será para la clase de tamaño R * R esta vez.

6. Cambie de nuevo al diseño de iPhone y toma 80 como ancho y iPad tomará 300.

CONCLUSION:

Tenga en cuenta que hay un total de dos restricciones agregadas y en ambas restricciones, los valores difieren según la clase de tamaño elegida.

• MÉTODO 2:

Varíe por características con restricción única, clase de tamaño múltiple instalada

• PASOS:
  1. Agregue la restricción de ancho normal. Luego, seleccione esa restricción y elija el botón + además del valor constante.

2. Agregue variación de rasgos, y para iPhone elegimos C * R y establecemos el valor constante en 100.

3. Nuevamente para iPad que sigue una variación de rasgo como R * R, agregamos otra variación haciendo clic nuevamente en el botón + y establecemos el valor en 300.

4. Seleccione un iPad y el ancho se tomará automáticamente como 300 y, volviendo al iPhone, se tomará 100 como valor.

CONCLUSION:

Esta parece ser una mejor opción en lugar de agregar dos restricciones cuando solo se requiere una restricción y el valor constante es diferente.

CUÁNDO USAR, QUÉ USAR:

Ambos enfoques básicamente hacen lo mismo, estableciendo valores en clases de tamaño.

Pero, # Method1 se usa cuando desea agregar una restricción específicamente para un dispositivo o decir clase de tamaño. Por ejemplo, en iPhone, el botón debe ser de los 50 puntos principales y en iPad debe estar centrado horizontal y verticalmente. En tales situaciones, debe usar VaryForTraits, ya que abre puertas para agregar restricciones para una clase de tamaño específico.

# Method2 se usa cuando desea diferentes valores constantes para un mismo tipo de restricción.

PD: A TODOS LOS QUE NO PUEDEN OBTENER EL EJEMPLO FUNCIONANDO

Asegúrese de que está agregando solo las restricciones requeridas como Instaladas. La casilla de verificación junto a Instalado solo debería aparecer para la restricción que necesita para una clase de tamaño. ¡Esa es la clave!

Simplemente agregue una restricción superior y una guía a un uiButton en una vista. Seleccione la restricción superior y desmarque la opción básica instalada con el signo más. Ahora, al hacer clic en el signo más, agregue una variación a C R y marque esa opción. Ahora, cambie el dispositivo de iPhone a iPad con varias combinaciones de orientación. Esta restricción se aplicará solo para la clase de tamaño C R que es iPhone en orientación vertical. Si se marcó la casilla de verificación junto a la instalación básica (la que tiene el símbolo más), significa que la restricción debe aplicarse a todas las clases de tamaño.

RESUMEN :

La variación de características es un cambio en la presentación de su interfaz de usuario que se basa en la configuración de un dispositivo. Las variaciones de características de la interfaz de usuario no se limitan solo a las restricciones, sino que se pueden aplicar a muchas más. Como cambiar el color del fondo y otros elementos cuando el dispositivo está configurado en un estilo oscuro. Una variación se puede aplicar a un elemento de la interfaz de usuario, como la eliminación de una restricción, o a una propiedad de una clase de vista o restricción, como la fuente de una etiqueta. Puede variar:

• Tamaño o posición de una vista

• Instalación de una vista

• Instalación de una restricción

• Constante de restricción

• Fuente

• Color para la fuente, el tinte o el fondo

• Márgenes de diseño

• Archivo de imagen

El conjunto específico de propiedades que puede variar depende de la clase del elemento. En el ejemplo, hemos demostrado el uso de- Instalación de una restricción y - Constante de restricción. Otros, son bastante simples y se pueden inferir fácilmente.

Variar por rasgos es la opción de evolución de clases de tamaño que estaba presente en la versión anterior de Xcode. Permite una variación mucho más ingeniosa y precisa basada en rasgos. Por supuesto, no se limita solo a las variaciones de iPad / iPhone, sino que también puede especificar variaciones según la orientación y el dispositivo diferente.

Otras respuestas en este hilo tienen algunas deficiencias e inexactitudes, quizás la forma más eficiente de dar una respuesta es dar un ejemplo. En aras de la claridad, limitaremos nuestro ejemplo a solo un botón y dos diseños. Sin embargo, como se explica a continuación, puede ampliar el siguiente ejemplo como desee. Nuestro objetivo es ajustar la posición de un botón entre dos diseños diferentes: horizontal y vertical en todos los dispositivos.

Nota: Si no está habilitada la opción "variar según los rasgos", todos los ajustes de diseño e interfaz de interfaz de usuario se refieren a todos los rasgos (es decir, todas las clases de tamaño).

Comencemos poniendo un botón en nuestro guión gráfico. Dado que "variar por rasgos" no está habilitado, el botón estará presente en todos los diseños diferentes. Si, en cambio, hubiéramos habilitado variar para los rasgos, el botón se referiría solo al rasgo particular seleccionado.

Ahora, habilitemos "variar según el rasgo" y elija una variación según la altura. Debería ver que la pantalla inferior se volverá azul y de acuerdo con la selección verá todo el dispositivo afectado. Hasta ahora tan bueno.

Seleccione de nuevo el botón y agregue las restricciones ad habituales. En nuestro ejemplo, agregaremos espacio inicial superior e izquierdo, así como ancho y alto. Después de eso, haga clic en "Done Varying". Verá que la parte inferior de la pantalla se volverá gris nuevamente. Lo que está sucediendo es que le hemos dicho al Interface Builder que agregue las restricciones anteriores solo para las clases (w: C h: R).

Ahora seleccione el modo horizontal en la parte inferior de la pantalla. Verá que el botón está en rojo, porque carece de las restricciones que ha agregado solo para algunos rasgos. Seleccione de nuevo variar para los rasgos y seleccione de nuevo la variación de altura. Agregue las siguientes restricciones:

y presione listo variando. Ahora el botón está bien identificado en la pantalla tanto para paisaje como para retrato.

Construye y ejecuta. Verás que el botón cambiará según la orientación de la pantalla.

Puede crear diseños más avanzados siguiendo este patrón. Por ejemplo, puede seleccionar al principio una variación para los rasgos y soltar objetos UIKit solo para un rasgo específico. Este objeto estará presente solo en la variante especificada y estará atenuado en el otro, lo que le permitirá crear interfaces de usuario completamente diferentes basadas en rasgos.

No es nada más que size classesél mismo, pero con una representación diferente. hasta xcode 7que usamos clases de tamaño y lo consideramos height-widthde regular,compact and anymanera, el vary for traitsconcepto es el mismo, pero xcode lo explica específicamente exact device. En la versión anterior, sabemos ese for every iphone in portrainttipo de información, etc., ¡donde podemos saber el dispositivo exacto!

Compruebe las capturas de pantalla a continuación,

¡Debe consultar el video wwdc2016 para obtener más información!

Referencia: This So Post