sábado, 4 de febrero de 2012

DIA 16: MASTER PAGES, PLANTILLAS Y TEMAS

Creación de páginas maestras (Master Pages)

Las páginas maestras (Master Pages) se agregan a la página utilizando el cuadro de diálogo Agregar elemento. Se pueden colocar en cualquier parte del sitio, incluyendo la carpeta raíz, pero desde un punto de vista organizativo, a menudo es más fácil guardarlas en una carpeta separada. Al igual que las páginas ASPX normales, que utilizan el modelo de código en línea, así como el código separado. Las páginas principales utilizadas en el proyecto Portal Web FCFYM utilizan exclusivamente el modelo de código separado. 

  
Creación de plantillas de páginas reutilizables
 
Visual Web Developer incluye una gran herramienta para exportar plantillas para un número de diferentes tipos de archivos, incluyendo las páginas ASPX, archivos de clase, e incluso los archivos CSS. Al crear una nueva plantilla, se define el código o marcado que usted necesita en cada archivo una sola vez y luego crear archivos nuevos basados ​​en esta plantilla, se da un gran salto con el archivo y se reduce al mínimo el código que necesita escribir.



Aplicación de temas
Para aplicar un tema a su sitio web, usted tiene tres opciones diferentes: a nivel de página en la directiva de página, a nivel de sitio mediante la modificación del archivo web.config, y programación. 

  • Establecer el tema a nivel de página: Configuración del Tema o propiedad StyleSheetTheme a nivel de página es muy sencillo: basta con establecer el atributo relevante en la directiva Page de la página:
<% @ Page Language = "VB" AutoEventWireup = "false" CodeFile = "Default.aspx.vb" Inherits = "_Default" Theme = "DarkGrey"%> 

Vuelva a colocar Theme con StyleSheetTheme para aplicar un tema cuya configuración puede ser anulado por las páginas individuales. La figura 6-13 muestra que tan pronto como se escribe Theme = " VWD aparece una lista con todos los temas que encuentra en la carpeta App_Themes.
  • Establecer el tema a nivel de sitio: Para aplicar un tema a lo largo de todo el sitio web, usted puede establecer el tema en el archivo web.config mediante la adición de un atributo de tema para el elemento <pages> en el interior del elemento <system.web>:
<pages theme="DarkGrey"> ... </ Pages> Asegúrese de escribir theme con todas las letras en minúsculas, porque el código XML en el archivo web.config distingue entre mayúsculas y minúsculas. 

  • Configuración de temas mediante programación: La tercera y última para definir un tema mediante programación a través de código. 
Crear un archivo de máscara (Skin)
 
Los archivos de máscara (skin) se debe crear en la carpeta de temas directamente. No se pueden almacenar en una subcarpeta como se hace con las imágenes de los temas.
Cuando empieza a escribir en un archivo skin, te darás cuenta de que el IntelliSense familiar no se produce. Esto hace que sea un poco difícil de definir sus controles y sus atributos. Sin embargo, existe una solución sencilla:
1. Abra el cuadro de diálogo Opciones de VWD eligiendo Herramientas ➪ Opciones.
2. Expanda la categoría Editor de texto y haga clic en la extensión del archivo. Si usted no ve estas categorías,
asegúrese de que Mostrar todas las configuraciones en la parte inferior de la pantalla se selecciona.



    Vista del Portal Web al 04 de Febrero de 2012, utilizando una Página Maestra:


      

     Vista del Portal Web al 05 de Febrero de 2012, utilizando el tema Monochrome de PlanetVrox:




    sábado, 28 de enero de 2012

    DIA 9: ALGUNOS TIPS

    METODOS GET Y POST

    Si usamos el método GET el datos son enviados mediante la URL y pueden ser vistos en esta.

    El método POST, a diferencia del método GET con el método POST los datos enviados no se ven en la barra del navegador.

    viernes, 27 de enero de 2012

    DIA 8: CONTROLES DE SERVIDOR (II Parte)

    Listas: 
    Propiedad AutoPostBack del control. Con esta opción activada, la pagina se actualiza tan pronto como el usuario elige un nuevo elemento de la lista.


    jueves, 26 de enero de 2012

    DIA 7: CONTROLES DE SERVIDOR

    Haciendo un minitutorial de como crear y programar un controlador de servidor.

    List controls:

    Cuando trabajamos con CheckBoxList se puede especificar un valor ListItem como en el siguiente ejemplo:

    <asp:ListItem Value=”C#”>C#</asp:ListItem>
    <asp:ListItem Value=”Visual Basic”>Visual Basic</asp:ListItem>
    <asp:ListItem Value=”CSS”>CSS</asp:ListItem>

    Sin embargo se puede obviar colocar un valor y ListItem tomara como valor por defecto el texto que se coloque, como en el siguinete ejemplo:

    <asp:ListItem>C#</asp:ListItem>
    <asp:ListItem>Visual Basic</asp:ListItem>
    <asp:ListItem>CSS</asp:ListItem>

    miércoles, 25 de enero de 2012

    DIA 6: CSS (II parte)

    Cuando se trabaja con CSS, es posible aplicar estilos al codigo en tres niveles: INLINE, EMBEBIDO Y EXTERNO.

    martes, 24 de enero de 2012

    DIA 5: HOJAS DE ESTILO EN CASCADA (CSS)

    Muy importantes para mejorar la presentacion de un sitio web.

    Algunos problemas que presenta HTML al dar formato a las paginas:
    To summarize, formatting with HTML suffers from the following problems:
    ➤➤ Its feature set severely limits the formatting possibilities that your pages require.
    ➤➤ Data and presentation are mixed within the same file.
    ➤➤ HTML doesn’t allow you to easily switch formatting at runtime in the browser.
    ➤➤ The required formatting tags and attributes make your pages larger and thus slower to load
    and display.

    Float y Clear.

    Float

    El estilo "float" sirve para alinear un elemento, haciendo que el texto de alrededor del mismo se agrupe entorno a dicho elemento. Sus posibles valores son "left" (para alinear el elemento a la izquierda) y "right" (para alinearlo a la derecha).Un elemento con “float” debe tener definida su anchura. De no ser así, no será tratado como tal y el estilo no se aplicará.

    Clear
    El estilo "clear" se utiliza conjuntamente con float. Utilizamos este estilo cuándo queremos que elementos que tienen cerca un elemento flotante (mediante "float") dejen de alinearse junto a él.

    Sus posibles valores son left (el elemento no permite flotantes a su izquierda ), right (el elemento no permite flotantes a su derecha ) o both (el elemento no permite flotantes a ningún lado).

    Aplicando CSS primera vista del portal web al 24 de Enero. (Notese que tanto a la parte del contenido como a el Sidebar se le aplico el estilo float : left)


    Go, go!!!

    domingo, 22 de enero de 2012

    DIA 3: EMPEZANDO DESDE CERO

    Primero a aprender lo mas elemental de ASP.NET. Luego de revisar algunos tutoriales simples en español, empezare a utilizar un libro en ingles: Beginning ASP.NE T 4 in C# and VB de Imar Spaanjaars, hasta ahora esta muy bueno. Espero seguir aprendiendo...

    Algunos tips:
    1. Web Form: Presenta la interfaz de usuario de tu sitio web al cliente.
    2. Las Web Forms pueden ser creadas con codigo adyacente o con codigo en linea. Si creamos con codigo adyacente se creará un archivo .cs en C# o .vb en VB adjunto.
    3. Se conoce como "markup" a todo aquel documento con marcas o etiquetas, los lenguajes de marcado son aquellos que utilizan etiquetas o marcas, el mas conocido es HTML.
     Hoy dia si que avance mas rapido que los días anteriores, le voy cojiendo ritmo al asunto.