Subtitles of the Movie

þÿ [00:00:00.0] De lo último que vamos a hablar acerca de los controles pertinentes, es del diseño de página. Esta es una de esas cosas a las que [00:00:06.0] en realidad debe prestar atención, ya que algunas veces le van a causar algunos inconvenientes. [00:00:12.0] El diseño de la página o 'page layout' es un atributo de la etiqueta 'body', y también está en su formulario web. Es una propiedad que aparece aquí en [00:00:19.0] la ventana de propiedades en Visual Studio, y que usted puede escoger. [00:00:24.0] Page layout' determina la forma en que los controles que están en el texto quedan posicionados en la página web. Esto se remite al [00:00:31.0] preciso comienzo de la World Wide Web, cuando empezamos a usar navegadores. [00:00:35.0] Si usted tiene un grupo de desarrolladores en un cuarto y les pregunta acerca del diseño de página, [00:00:41.0] ellos van a arrojarse las sillas uno a otro en unos pocos minutos, [00:00:44.0] ya que muchas personas tienen fuertes opiniones acerca de cómo debería funcionar el diseño de página. [00:00:48.0] Básicamente usted tiene dos opciones. En primer lugar está 'flow layout'. Con 'flow layout', [00:00:54.0] el texto, las imágenes y los controles se agrupan a través del navegador web. [00:00:58.0] Ahora quiero que se imagine su navegador web. Digamos que este es su navegador web. [00:01:05.0] Con 'flow layout', éste empezará automáticamente. Si yo coloco botones aquí, este colocará uno aquí, [00:01:12.0] y si yo coloco otro botón, estará justo al lado de él. Usted ya ha visto esto. Luego, si yo coloco una caja de texto estará justo al lado de esta, [00:01:18.0] y luego si coloco una lista desplegable, estará justo al lado de ella, etc. [00:01:24.0] Después, para mover estas cosas yo tengo que insertar mi cursor aquí, e ir a la línea siguiente, [00:01:29.0] o colocar saltos de párrafo o cualquier otra cosa. Esto significa cada vez, que vamos a empezar en la parte superior, y vamos [00:01:37.0] a trabajar a través y hacia abajo en la página, todas las veces. [00:01:40.0] Esto significa que si redimensionamos esta página, entonces tal vez ésta baje hasta aquí, porque [00:01:47.0] nuevamente va a funcionar a través y hacia abajo, todas las veces. [00:01:50.0] Esto es bueno algunas veces. Otras veces es malo, como se podrá dar cuenta. La otra opción es 'grid layout'. [00:02:00.0] Esto es posicionamiento absoluto. 'Absolute' coordina el posicionamiento de control. Usted verá esto todo el tiempo. [00:02:09.0] Esta es la predeterminación por defecto. Pero lo que hacemos con esto es que, en una página web, si yo creo un botón y lo muevo hacia aquí abajo, [00:02:21.0] luego tendré algunas coordinadas (x,y) que indican que el botón siempre va a aparecer en esa coordinada específica. [00:02:27.0] Lo que va a suceder cuando alguien redimensione la ventana del navegador, y este botón esté en esta coordenada (x,y), [00:02:35.0] es que no aparecerá en la ventana. Básicamente está fuera de la escala, ya le mostraré esto. Vayamos a Visual Studio. [00:02:43.0] Voy a mostrarle las diferencias en estos tipos de diseño y cómo puede configurarlos. Vamos a ver esto en la función de seguimiento, dentro de poco. [00:02:51.0] Veamos las propiedades en este formulario web. Voy a desplazarme hacia abajo. Este diseño de página está en 'grid layout', [00:03:01.0] lo que significa que si miro en mi HTML, en estas cosas usted verá: "Z-INDEX: 101", 102. Este es el orden desde el frente hacia atrás. [00:03:11.0] Luego tenemos 'center top'. Esto le está ordenando que se percate de la parte superior e izquierda. Coloque siempre esta instrucción unos ciento diecisiete pixeles a la izquierda, [00:03:22.0] doscientos veinte pixeles a partir de la parte superior. Veamos que es lo que estamos mirando. Esto es 'button1'. [00:03:27.0] Recordemos que estamos en (117,221). Entonces si yo tomo este item y lo muevo, [00:03:33.0] luego vuelvo aquí afuera y miro el botón 1, vemos que hemos cambiado 'center 148', 'top 64', [00:03:41.0] y siempre va a aparecer justo allí. Esto es lo que sucede con el posicionamiento en malla, el 'grid layout'. Voy a traer esto, [00:03:49.0] y ya que todas estas cosas están en posicionamiento en malla, vea lo que sucede si yo redimensiono: [00:03:56.0] Van a quedarse justo allí, sin importar lo que suceda. [00:04:00.0] Yo puedo cambiar a 'flow layout', y este cambiará la forma en que van a actuar. Pero quiero que vea que si voy a 'flow layout', [00:04:11.0] este va a fluir. Pero en mi HTML, yo aún tengo el posicionamiento absoluto allí afuera. [00:04:22.0] Yo puedo retirar esto. Simplemente voy a retirarlo en un par de estos items, y le mostraré cómo se ve. [00:04:37.0] Ahora he anulado el posicionamiento absoluto en un par de estos items. Si no he cometido ningún error, usted verá [00:04:47.0] a medida que esta cosa se construye, que estas cosas ahora están fluyendo. Siempre van a estar justo aquí. [00:04:53.0] Entonces si yo cambio el tamaño de esto, vemos que fluye hacia abajo hasta la línea siguiente. Tan pronto como yo me retiro, fluye a lo largo. [00:05:02.0] Cuando este completo irá hacia abajo. [00:05:04.0] Esto es 'flow layout'. Usted deberá decidir cuál de estos tipos de diseño desea, cual de ellos se ajusta a sus necesidades. [00:05:10.0] Solamente quería que usted viera sus diferencias. [00:05:12.0] En la siguiente sección de videos vamos a dejar los controles y vamos a hablar acerca del seguimiento. [00:05:17.0] Le va a gustar la función de seguimiento. [00:05:20.0]