2012-10-08 34 views
6

Tengo una aplicación de metro en la que estoy tratando de diseñar la pantalla de inicio de sesión para mi aplicación. Aquí quiero diseñar mi pantalla de inicio de sesión como una pantalla de inicio de sesión de Microsoft. Encontré el control emergente en XAML pero no encontré en html 5 ¿Existe algún control especial en las aplicaciones metropolitanas? Quiero diseñar una página de inicio de sesión como esta.Control de ventanas emergentes en las aplicaciones Metro de Windows8?

enter image description here Gracias.

<body style="background-color:#1d3665;"> 
<div class="loginPage fragment"> 
    <header aria-label="Header content" role="banner"> 
     <button class="win-backbutton" aria-label="Back" disabled></button> 
     <h1 class="titlearea win-type-ellipsis"> 
      <span class="pagetitle">Welcome to loginPage</span> 
     </h1> 
    </header> 
    <section aria-label="Main content" role="main"> 
     <table style="position: absolute;background-color:skyblue;"> 
      <tr> 
       <td><input type="text"><br/></td> 
      </tr> 
      <tr> 
      <td> 
       <input type="password"/> 
       </td> 
      </tr> 
     </table> 
    </section> 
</div> 

Respuesta

1

Si se autentica en Cuentas de Microsoft (Microsoft que proporciona por defecto Cuenta Login Box), es posible que desee probar Live SDK, que se acceda a su cuenta Microsoft. Y si desea crear su propio mecanismo de inicio de sesión con una interfaz de usuario que parezca algo similar a la cuenta de Microsoft, puede probar el complemento de la interfaz de usuario de JQuery y personalizarlo. Hay un control emergente incorporado en él.

2

JavaScript Windows Store Las aplicaciones no tienen acceso a una ventana emergente incorporada que se ve/se comporta como el cuadro de diálogo de inicio de sesión de cuenta de Microsoft.

No es un simple cuadro de mensaje experiencia en Windows.UI.Popups.MessageBox, pero no tiene la capacidad de agregar controles adicionales etc.

Por su experiencia, usted está buscando un modal UI - para construir que puedes construirlo relativamente solo para ti (simplemente agrega un elemento position: absolute al cuerpo, y haz que llene la pantalla - el resto de los elementos hijos/posición están bajo tu control total), o como Mayur sugirió, usa uno de las muchas bibliotecas de ayudantes que hay por ahí.

+0

Dominic Hopton, estoy tratando con el código de seguridad u puede ayudar. –

3

Utilice el control WinJS.UI.Flyout. Se puede usar para los cuadros de diálogo de confirmación, inicio de sesión, ventanas emergentes y otros. Además, puede establecer la posición en la que se muestra.

Puede leer la documentación here. Aquí tienes el Guidelines and checklist. Y uno example.

Cuestiones relacionadas