Algunas soluciones de MobileTogether tienen un aspecto distinto en cada sistema operativo (plataformas) porque estos administran las propiedades de estilo de forma diferente. (Las distintas plataformas en las que se pueden ejecutar las soluciones de MobileTogether son: Android, iOS, Windows y Web.)
En este apartado:
•Aquí explicamos cómo puede crear un aspecto uniforme en todas las plataformas y
•qué propiedades de estilo no funcionan igual en todas las plataformas.
Crear un aspecto uniforme en todas las plataformas
La forma más eficaz de establecer un aspecto uniforme es identificar las propiedades de estilo que se manejan de forma diferente en las distintas plataformas y, a continuación, establecer el valor de cada una de esas propiedades mediante una expresión XPath que establezca valores diferentes para las distintas plataformas. Puede generar ramas condicionales en la expresión XPath utilizando las variables globales estáticas que contienen la información de la plataforma.
Por ejemplo, la siguiente expresión XPath puede establecerse en la propiedad de estilo Relleno de los componentes del proyecto:
if ($MT_Android=true()) then "0dp" else "1dp"
La expresión XPath anterior establece un valor de relleno para los dispositivos Android y otro para el resto de plataformas.
Puede establecer estas definiciones de propiedades de estilo en una o más de las siguientes ubicaciones:
•Con la distribución del diseño: En controles individuales; en la página; en la configuración del proyecto
•Con hojas de estilos: En todos los controles; en un tipo concreto de control; en las tablas de una página; en una página
En las opciones de las propiedades del proyecto puede establecer el modo de compatibilidad de la interfaz gráfica en true para que los valores predeterminados de las propiedades sean iguales en todas las plataformas.
Cómo administrar ciertos estilos en función de la plataforma
A continuación puede ver una lista de propiedades de estilo que se administran de formas muy distintas en al menos una plataforma.
Generales
Los colores, las fuentes y los tamaños predeterminados varían según la plataforma y también según el dispositivo en una misma plataforma. Además, los controles tienen un aspecto distinto en dispositivos distintos y en versiones diferentes del mismo sistema operativo.
Márgenes de los controles de nivel superior
Los controles de nivel superior están situados directamente en el contenedor de la página. O, dicho de otra manera, estos controles no se encuentran dentro de una tabla. Los dispositivos Android establecen un margen predeterminado de 9px para todos los controles de nivel superior (aunque el control Etiqueta tiene un margen inferior de 0px). Otras plataformas tienen otros valores predeterminados. Puede usar la propiedad Márgenes de nivel superior del cuadro de diálogo Más opciones de configuración del proyecto para definir los márgenes de los controles de nivel superior en todas las plataformas.
Controles de etiqueta
En Android, el control Etiqueta tiene un margen predeterminado de 9px en todos los lados excepto en el margen inferior, que tiene un valor predeterminado de 0px.
Relleno
•En Windows todos los controles (excepto el control Etiqueta) tienen un relleno de 1px. Esta configuración se sobrescribe al establecer relleno en un control (por ejemplo, 0px).
•En iOS se aplica un relleno estándar de tabla de 0px: 9Px a la derecha y a la izquierda, y 5px en los márgenes superior e inferior. Si define valores para cualquiera de las propiedades Relleno de tablas individuales, el valor Relleno (superior, derecho, inferior, izquierdo) se añade al valor de relleno respectivo en la tabla iOS. Si quiere eliminar el relleno de tabla estándar de iOS cambie el valor de la propiedad Relleno de tabla iOS (en un cuadro de diálogo Más opciones de configuración del proyecto) a false.
Botones
•Los botones Android tienen un relleno “natural", incluso aunque se defina como 0px.
•En iOS los botones no tienen relleno de fondo. En su lugar tienen una tonalidad.
•Los botones del modo oscuro de Windows son transparentes.
Botón Atrás
En iOS los dispositivos no siempre tienen un botón Atrás. Por tanto, deberá añadir explícitamente una opción (un botón o una alternativa) que permita a los usuarios salir de la solución.
Controles de cuadro combinado
La plataforma iOS no admite cuadros combinados multilínea.
Controles Conmutador
En iOS los controles Conmutador no tienen texto.
Controles FechaHora
El control FechaHora solo está disponible en iOS.
Control Texto enriquecido
En los clientes Windows el control de texto enriquecido se puede editar en un PC (en un cliente web) pero no en Windows Phone.
Ancho máximo del explorador, Clase CSS del explorador
Estas propiedades de página se aplican solamente al aspecto del explorador web.
Configuración del explorador del proyecto
La configuración del explorador del proyecto solo afectan al explorador web.
