Herramientas de usuario

Herramientas del sitio


propiedades:awidth

Diferencias

Muestra las diferencias entre dos versiones de la página.

Enlace a la vista de comparación

Próxima revisión
Revisión previa
propiedades:awidth [04/12/2019 20:49]
pedro creado
propiedades:awidth [21/07/2020 10:50] (actual)
Línea 1: Línea 1:
-==== aWidth ====+====== aWidth ​======
  
-Estas propiedades ​nos permite ​"​ubicar" ​los controles dentro de la página web. +Esta propiedad ​nos permite ​definir el ancho que ocupan ​los controles dentro de la página web, o dentro de un control contenedor ([[controles:​wBevel]],​ [[controles:​wPanel]],​ [[controles:​wItemParallax]],​ etc..)
-Materialize ​utiliza un contenedor de 12 columnas para distribuir los elementos, nosotros +Materialize ​divide los contenedores en 12 columnas para distribuir los elementos, nosotros podemos indicar ​partir de qué columna lo colocamos ​(ver [[propiedades:​aOffset]]) ​y la cantidad de columnas ​que va ha ocupar, de esta manera el navegador irá renderizando ​la página y si hay espacio colocará juntos en la misma fila varios controles y si no los pasará a la siguiente.
-podemos indicar partir de qué columna lo colocamos y la cantidad de columnas va ha ocupar, +
-de esta manera el navegador irá renderizado ​la página y si hay espacio colocará juntos en la +
-misma fila varios controles y su no los pasará a la siguiente.+
  
-También hay que saber que materialize ​distingue 4 tamaños de pantalla S, M, L y XLpudiendo +También hay que saber que Materialize ​distingue 4 tamaños de pantalla S, M, L y XL (https://​materializecss.com/​grid.html#​grid-responsive) ​pudiendo decirle como queremos que se vea cada control en cada uno de los tamaños de pantalla, incluso si queremos que no se vea.
-decirle como queremos que se vea cada control en casa uno de los tamaños de pantalla, +
-incluso si queremos que no se vea.+
  
-Los valores son en cascada de S a XL de manera que si no damos valor a M, L o XL el control +Los valores son en cascada de S a XL de manera que si no damos valor a M, L o XL el control aplicará el valor de S en cada una de las pedidas de pantalla, si le damos valor a M, en tamaño S tendrá su valor y en el resto el de M.
-aplicará el valor de S en cada una de las pedidas de pantalla, si le damos valor a M, en tamaño +
-S tendrá su valor y en el resto el de Mi.+
  
-Si un control estuviera dentro de un contenedor (wBevel, wPanel, wItemParallax,​ etc...), +Si un control estuviera dentro de un contenedor ([[controles:​wBevel]][[controles:​wPanel]][[controles:​wItemParallax]], etc...), ​tendríamos ​también 12 columnas dentro del contenedor, pero lógicamente serían
-Tendríamos ​también 12 columnas dentro del contenedor, pero lógicamente serían+
 proporcionales en tamaño al tamaño de contenedor. proporcionales en tamaño al tamaño de contenedor.
  
-Para poder lidiar con esta manera de distribuir los controles hemos creado las propiedades +Para poder lidiar con esta manera de distribuir los controles hemos creado las propiedades aWidth y [[propiedades:​aOffset]] y las [[nefele:constantes#Indices de aWidth y aOffset|constantes]] ​xc_S, xc_M, xc_L y xc_XL . Para hacer el uso más "​amigable"​ también se han creado las [[nefele:​constantes#​Indices de aWidth y aOffset|constantes]] _movil, _tablet, _monitor y _grande.
-aWidth y aOffset y las constantes xc_S, xc_M, xc_L y xc_XL.+
  
-Es un array de 4 elementos que corresponden a las 4 medidas de pantalla {S,M,L,XL}, para +aWidth es un array de 4 elementos que corresponden a las 4 medidas de pantalla {S,M,L,XL}, para facilitar su uso tenemos las constantes indicadas anteriormente,​ de forma que podemos hacer aWidth[xc_M] := 4 para definir qué a tamaño de pantalla M y superior ( si no definimos nada el L y XL ) queremos que nuestro control ocupe 4 columnas. Pero también podemos acceder directamente a las 4 medidas, aWidth := {12,10,8,6}
-facilitar su uso tenemos las constantes indicadas anteriormente,​ de forma que podemos hacer +
-aWidth[xc_M] := 4 para definir qué a tamaño de pantalla M y superior ( si no definimos nada el +
-L y XL ) queremos que nuestro control ocupe 4 columnas.+
  
-  ​Por defecto todos los controles vienen con el valor S a 12.+Por defecto ​casi todos los controles vienen con el valor S a 12 y el resto sin definir, algunos controles tienen por defecto S a 11 para que queden bien ajustados.
  
-Si ponemos a 0 algúno ​de los elementos del array querrá decir que no queremos que se vea en +Si ponemos a 0 alguno ​de los elementos del array querrá decir que no queremos que se vea en esa medida de pantalla, si no asignamos valor para las medidas superiores tampoco aparecerá, recuerden que se asignan en cascada S, M, L y XL. 
-esa medida de pantalla ​( esto está sin implementar aún ).+ 
 +~~DISCUSSION|Comentarios aWidth~~
propiedades/awidth.1575492589.txt.gz · Última modificación: 21/07/2020 10:50 (editor externo)