ScrollViewer y SIP Edición (WP7.5 Mango)

Question

estoy trabajando en una aplicación que incluye un formulario de registro. El formulario contiene varios cuadros de entrada de texto, por lo que se utiliza un ScrollViewer para permitir que todos se muestren en una página.

El siguiente es un ejemplo simplificada del código XAML que estoy utilizando:

<Grid x:Name="LayoutRoot" Background="Transparent"> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto"/> 
     <RowDefinition Height="*"/> 
    </Grid.RowDefinitions> 

    <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> 
     <TextBlock x:Name="ApplicationTitle" Text="SCROLLVIEWER TEST" Style="{StaticResource PhoneTextNormalStyle}"/> 
     <TextBlock x:Name="PageTitle" Text="registration" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/> 
    </StackPanel> 

    <ScrollViewer Grid.Row="1"> 
     <StackPanel> 
      <TextBlock Text="Hello" Margin="12,0,0,0"/> 
      <TextBox /> 
      <TextBlock Text="Hello1" Margin="12,0,0,0"/> 
      <TextBox /> 
      <TextBlock Text="Hello2" Margin="12,0,0,0"/> 
      <TextBox /> 
      <TextBlock Text="Hello3" Margin="12,0,0,0"/> 
      <TextBox /> 
      <TextBlock Text="Hello4" Margin="12,0,0,0"/> 
      <TextBox /> 
      <TextBlock Text="Hello5" Margin="12,0,0,0"/> 
      <TextBox /> 
      <TextBlock Text="Hello6" Margin="12,0,0,0"/> 
      <TextBox /> 
      <TextBlock Text="Hello7" Margin="12,0,0,0"/> 
      <TextBox /> 
      <TextBlock Text="Hello8" Margin="12,0,0,0"/> 
      <TextBox /> 
      <TextBlock Text="END" Margin="12,0,0,0"/> 
      <TextBox /> 
     </StackPanel> 
    </ScrollViewer> 
</Grid> 

(Tenga en cuenta que la ScrollViewer está dentro de una celda de la cuadrícula, lo que significa que el panel de título debe permanecer en pantalla a todo momento)

El desplazamiento funciona perfectamente bien, así que no es un problema. Sin embargo, cuando el usuario selecciona un cuadro de texto para ingresar datos (es decir, se abre el teclado virtual), el sistema empuja el contenido de toda la página (incluido el panel de título de registro), lo que no es un comportamiento esperado. [Ver la aplicación People en Windows Phone e intente agregar un nuevo contacto. Este contiene una estructura similar, pero el ScrollViewer comporta correctamente sólo empujar el contenido en el ScrollViewer arriba]

casos de prueba

• Seleccionar un cuadro de texto que es visible en la parte superior de la pantalla, para abrir el teclado.
• Intenta desplazarte hasta la parte inferior de la página con el teclado abierto.
• No se puede acceder a los elementos en la parte inferior de la página.

o

• Seleccione un cuadro de texto que es visible en la parte inferior de la pantalla.
• Se empuja hacia arriba el contenido de la página completa.
• Intenta desplazarte hacia la parte superior de la página con el teclado abierto.
• los artículos en la parte superior de la página son inalcanzables, y el panel de título nunca regresa a la vista hasta que el teclado está cerrado.

Cualquier ayuda para resolver este problema sería apreciada. Gracias.

Answer 1

El problema es que la altura ScrollViwer no se modifica después de que aparezca el teclado para que quede cortada. Una solución sería modificar la altura del scrollviwer (de acuerdo con la altura del teclado) y luego reposicionarlo (esto podría ocasionar algunos dolores de cabeza).

Otro problema es saber cuando aparece el teclado - usted podría inscribirse en los eventos GotFocus/LostFocus de todos sus cuadros de texto, pero no es una gran solución. Esto podría ayudarle a: http://blogs.msdn.com/b/jaimer/archive/2010/11/05/guessing-if-the-sip-is-visible-in-a-windows-phone-application.aspx

Espero que esto ayude un poco :)

Answer 2

Creo que se puede resolver esto viene el problema desde otro ángulo. El teléfono se desplazará hacia arriba en la página para que el SIP (teclado de software) nunca cubra el TextBox que tiene foco.

Sin embargo, puede forzar el SIP para ocultar mediante la detección de eventos de toque en el elemento superior contenida en su ScrollViewer, por ejemplo,:

<ScrollViewer Grid.Row="1"> 
    <StackPanel ManipulationDelta="OnScrollViewerGridManipulationDelta">` 

Luego, dando el enfoque a un botón oculto (0x0 píxeles de tamaño) esto obligará a la SIP para cerrar. Entonces será posible para sus usuarios desplazarse arriba y abajo del ScrollViewer como se esperaba ...

private void OnScrollViewerGridManipulationDelta(object sender, System.Windows.Input.ManipulationDeltaEventArgs e) 
    { 
     // This will hide the SIP if it is currently showing. 
     // We can't do this directly, but we can force this by taking focus away from any of the TextBoxes that may have it. 
     this.hiddenButton.Focus(); 
    } 

Answer 3

que he tenido el mismo problema con una aplicación que he desarrollado y la forma en que se ocupó de que se descubra la altura automática del panel que contiene la entrada textbox sy luego configure manualmente la altura y agregue aproximadamente 400 - 500 px a la parte inferior para que se desplace correctamente. El efecto es bastante suave y no hará que su interfaz de usuario se vea "hackosa" en mi humilde opinión.

En su caso, tendrá que averiguar la altura automática del LayoutRootGrid y luego en RowDefinition de la fila 1 fijar la altura manualmente - recordando para añadir un extra de 400 píxeles (o lo que parece apropiado en su situación).

Para facilitar la entrada I a continuación maneja cada caso de cada OnKeyDownTextBox para cambiar el foco al siguiente TextBox al chocar contra Enter. En el último TextBox configuré el foco en this.focus() que establece el foco en la página y oculta el SIP.

Answer 4

Tenga una mirada en mi pequeña biblioteca favor - https://siphelper.codeplex.com/

Modifica altura de ScrollViewer y el contenido se puede desplazar hacia el punto más alto/más inferior.

Si tiene alguna sugerencia, no dude en ponerse en contacto conmigo.