1. Abra Visual Web Developer.

2. En el menú Archivo, elija Nuevo y, a continuación, elija Sitio Web.

   Aparece el cuadro de diálogo Nuevo sitio Web.

3. En Plantillas instaladas de Visual Studio, seleccione Sitio Web de ASP.NET.

4. Haga clic en Examinar.

   Aparecerá el cuadro de diálogo Seleccionar ubicación.

5. Haga clic en la ficha IIS local.

6. Seleccione Sitio Web predeterminado.

7. Haga clic en el botón Crear nueva aplicación Web.

   Se agrega una nueva aplicación debajo de Sitio Web predeterminado.

8. En el cuadro para el nuevo sitio Web, escriba DeviceWalkthrough y, a continuación, haga clic en Abrir.

   Volverá al cuadro de diálogo Nuevo sitio Web, en el que el cuadro Ubicación contiene http://localhost/DeviceWalkthrough.

9. En la lista Lenguaje, seleccione el lenguaje de programación con el que prefiera trabajar.

   El lenguaje de programación que ha elegido será el lenguaje predeterminado del sitio Web. Sin embargo, puede utilizar varios lenguajes en la misma aplicación Web creando páginas y componentes en lenguajes de programación diferentes.

10. Haga clic en Aceptar.

    Visual Web Developer crea el nuevo sitio Web y abre una nueva página con el nombre Default.aspx.

1. Haga clic con el botón secundario del mouse (ratón) en la página Default.aspx en el Explorador de soluciones y elija Eliminar.

2. Haga clic en Aceptar en el cuadro de diálogo.

3. En el Explorador de soluciones, haga clic con el botón secundario del mouse (ratón) en la aplicación y elija Agregar nuevo elemento.

4. Elija Formulario Mobile Web Forms, debajo de Plantillas instaladas de Visual Studio.

5. Asigne a la página Web móvil el nombre MobileCalculator.aspx y, a continuación, haga clic en Agregar.

   Se crea una página Web que hereda de la clase MobilePage y se agrega al sitio Web.

1. En la página MobileCalculator.aspx que ha creado en el último procedimiento, asegúrese de que está en la vista Diseño.

   Verá un control Form con el nombre predeterminado form1.

2. Arrastre controles desde la carpeta Formularios Mobile Web Forms del Cuadro de herramientas hasta form1 y establezca sus propiedades como se indica en la tabla siguiente.

   Control	Valores de propiedades
   Label	ID = HeadingLabel Text = Calculadora de préstamos
   TextBox	ID = PrincipalText Text = Principal
   TextBox	ID = TermText Text = Plazo en años
   TextBox	ID = RateText Text = Tasa anual
   Command	ID = Calcular Text = Calcular

1. Desde la carpeta Formularios Mobile Web Forms del Cuadro de herramientas, arrastre un control Form hasta la superficie de diseño.

   Se asigna al control Form el id. predeterminado de Form2.

2. Arrastre controles desde la carpeta Formularios Mobile Web Forms del Cuadro de herramientas hasta Form2 y establezca sus propiedades como se indica en la tabla siguiente.

   Control	Valores de propiedades
   Label	ID = LoanDetailsLabel Text = Detalles del préstamo
   Label	ID = PaymentLabel Text = Cuota
   Command	ID = ReturnToCalculator Text = Volver a la calculadora

1. Si utiliza C#, agregue una referencia al espacio de nombres Microsoft.VisualBasic para poder utilizar el método Pmt con el fin de calcular la información de las cuotas. Siga estos pasos:

   1. En el Explorador de soluciones, haga clic en con el botón secundario del mouse (ratón) en el nombre del proyecto y elija Páginas de propiedades.

   2. Haga clic en Agregar referencia.

   3. En la ficha .NET, seleccione Microsoft.VisualBasic.dll y, a continuación, haga clic en Aceptar.

   4. En el cuadro de diálogo Páginas de propiedades, haga clic en Aceptar.

2. En el control form1, haga doble clic en el botón Calcular para crear un controlador de eventos Click y, a continuación, agregue el código siguiente.

   Visual Basic

   Protected Sub Calculate_Click(ByVal sender As Object, _
       ByVal e As EventArgs)
       
       ' Get values from the form
       Dim principal As Double = Convert.ToDouble(PrincipalText.Text)
       Dim apr As Double = Convert.ToDouble(RateText.Text)
       Dim monthlyInterest As Double = apr / (12 * 100)
       Dim termInMonths As Double = Convert.ToDouble(TermText.Text) * 12
       Dim monthlyPayment As Double
   
       ' Calculate the monthly payment
       monthlyPayment = Microsoft.VisualBasic.Financial.Pmt( _
          monthlyInterest, termInMonths, -principal, 0, _
          DueDate.BegOfPeriod)
   
       ' Change to the other form
       Me.ActiveForm = Me.form2
   
       ' Display the resulting details
       Dim detailsSpec As String = "{0} @ {1}% for {2} years"
       LoanDetailsLabel.Text = String.Format(detailsSpec, _
           principal.ToString("C0"), apr.ToString(), TermText.Text)
       PaymentLabel.Text = "Payment: " & monthlyPayment.ToString("C")
   End Sub
   

   C#

   protected void Calculate_Click(object sender, EventArgs e)
   {
       // Get values from the form
       Double principal = Convert.ToDouble(PrincipalText.Text);
       Double apr = Convert.ToDouble(RateText.Text);
       Double monthlyInterest = (Double)(apr / (12 * 100));
       Double termInMonths = Convert.ToDouble(TermText.Text) * 12;
       Double monthlyPayment;
   
       // Calculate the monthly payment
       monthlyPayment = Microsoft.VisualBasic.Financial.Pmt(
          monthlyInterest, termInMonths, -principal, 0,
          Microsoft.VisualBasic.DueDate.BegOfPeriod);
   
       // Change to the other form
       this.ActiveForm = this.form2;
   
       // Display the resulting details
       string detailsSpec = "{0} @ {1}% for {2} years";
       LoanDetailsLabel.Text = String.Format(detailsSpec,
           principal.ToString("C0"), apr.ToString(), TermText.Text);
       PaymentLabel.Text = "Payment: " + monthlyPayment.ToString("C");
   }
   

   El código recopila los valores de los cuadros de texto, los convierte a tipos de datos apropiados y después los utiliza como parámetros para la función Pmt de Visual Basic para calcular el costo mensual de la hipoteca. (Puede utilizar la función de Visual Basic en cualquier lenguaje siempre y cuando especifique completamente la llamada a la función con el espacio de nombres). Después de calcular el importe mensual, el código cambia al segundo control Form y muestra los resultados en los controles Label respectivos.

3. En el control Form2, haga doble clic en el control Command para crear un controlador de eventos Click y, a continuación, agregue el código resaltado que se muestra a continuación.

   Visual Basic

   Protected Sub ReturnToCalculator_Click(ByVal sender As Object, _
       ByVal e As EventArgs)
       
       Me.ActiveForm = Me.form1
   End Sub
   

   C#

   protected void ReturnToCalculator_Click(object sender, EventArgs e)
   {
       this.ActiveForm = this.form1;
   }
   

Ahora está preparado para probar la calculadora. Puede probar la calculadora en un explorador de escritorio. Sin embargo, puede resultar de mayor interés realizar la prueba con un emulador de dispositivos.

Para probar la calculadora

1. Haga clic con el botón secundario del mouse (ratón) en la aplicación en el Explorador de soluciones y elija Agregar nuevo elemento.

2. Elija Formulario Mobile Web Forms, debajo de Plantillas instaladas de Visual Studio.

3. Asigne a la página el nombre MobilePaging.aspx y, a continuación, haga clic en Agregar.

   Se crea una página Web que hereda de la clase MobilePage y se agrega al proyecto. La página contiene un control Form denominado form1. Sólo se pueden utilizar controles en el espacio de nombres System.Web.Mobile en una página que herede de la clase MobilePage.

4. Desde la carpeta Formularios Mobile Web Forms del Cuadro de herramientas, arrastre un control ObjectList hasta la superficie de diseño y colóquelo en form1.

   Se agrega un control ObjectList a la página. Muestra un conjunto genérico de datos que da una idea de la apariencia que tendrá el control cuando se represente en el cliente.

1. En la página MobilePaging.aspx, cambie a la vista Diseño y haga doble clic en la superficie de diseño vacía para crear un controlador de eventos vacío para el evento Load de la página.

2. En el controlador vacío, agregue el siguiente código:

   Visual Basic

   Protected Sub Page_Load(ByVal sender As Object, _
       ByVal e As EventArgs)
   
       ' Create and fill an array of strings
       Dim listItems(25) As String
       
       Dim i As Integer
       For i = 0 To 24
           listItems(i) = _
               String.Format("This is item {0}.", i)
       Next
   
       ' Bind the ObjectList to the Items
       Me.ObjectList1.DataSource = listItems
       Me.ObjectList1.DataBind()
   End Sub
   

   C#

   protected void Page_Load(object sender, EventArgs e)
   {
       // Create and fill an array of strings
       string[] listItems = new string[25];
       for (int i = 0; i < 25; i++)
           listItems[i] = 
               String.Format("This is item {0}.", i);
   
       // Bind the ObjectList to the Items
       this.ObjectList1.DataSource = listItems;
       this.ObjectList1.DataBind();
   }
   

   El código crea una matriz de objetos de cadena y la rellena con cadenas. A continuación enlaza la matriz al control ObjectList.

1. Presione CTRL+F5 para ejecutar la página.

   La página se muestra con una larga lista de elementos numerados.

2. Inicie su emulador de dispositivos y escriba la dirección URL de la página (http://localhost/DeviceWalkthrough/paging.aspx).

   Observe que los datos se muestran en una larga lista.

Ahora que tiene una página en la que se muestran datos, puede agregar opciones de paginación para que el tamaño de la presentación se ajuste a la pantalla del dispositivo.

Para agregar paginación

Ya puede probar la paginación.

Para probar la paginación