2012-05-02 31 views
10

Tôi đang làm việc trên một ứng dụng bao gồm một mẫu đăng ký. Biểu mẫu chứa nhiều hộp nhập văn bản và vì vậy một ScrollViewer được sử dụng để cho phép tất cả chúng được hiển thị trên một trang.Scrollviewer & SIP Issue (WP7.5 Mango)

Sau đây là một tước xuống ví dụ về mã XAML Tôi đang sử dụng:

<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> 

(Lưu ý rằng ScrollViewer là bên trong một tế bào lưới, có nghĩa là bảng tiêu đề nên ở lại trên màn hình bất cứ lúc nào)

Việc cuộn hoạt động hoàn toàn tốt, vì vậy đó không phải là vấn đề. Tuy nhiên, khi người dùng chọn một TextBox để nhập dữ liệu (tức là bàn phím mềm mở), hệ thống sẽ đẩy nội dung của toàn bộ trang xung quanh (bao gồm cả bảng tiêu đề đăng ký), hành vi này không được mong đợi. [Xem ứng dụng Liên hệ trên Windows Phone và thử thêm liên hệ mới. Này chứa một cấu trúc tương tự, nhưng ScrollViewer cư xử một cách chính xác bằng cách chỉ đẩy nội dung trong ScrollViewer lên]

Test Cases

  • Chọn một TextBox đó là có thể nhìn thấy gần phía trên cùng của màn hình, để mở bàn phím.
  • Cố gắng cuộn xuống cuối trang bằng bàn phím mở.
  • Các mục ở cuối trang không thể truy cập được.

hoặc

  • Chọn một TextBox đó là có thể nhìn thấy gần dưới cùng của màn hình.
  • Nội dung của toàn bộ trang được đẩy lên.
  • Cố gắng cuộn lên đầu trang bằng bàn phím mở.
  • Các mục ở đầu trang không thể truy cập được và bảng điều khiển tiêu đề không bao giờ trở lại chế độ xem cho đến khi bàn phím bị đóng.

Bất kỳ trợ giúp nào về giải quyết vấn đề này sẽ được đánh giá cao. Cảm ơn.

+0

Bài đăng trên blog sau đây có thể là điểm khởi đầu tốt để giải quyết vấn đề này: http://sorokoletov.com/2011/08/windows-phone-70-handling-text-entry-screens/ –

+0

@PaulDiston Cảm ơn bạn. Tôi đã đọc blog này trước đây. Tôi đã thử các ứng dụng demo và nó không phải là những gì tôi đang tìm kiếm. Quá trình chuyển đổi rất đột ngột (tức là bảng điều khiển tiêu đề vừa xuất hiện lại khi hoạt ảnh SIP hoàn tất), chưa kể rằng việc triển khai quá mức cho một thứ đơn giản như vậy. Triển khai dự định của tôi là khớp với biểu mẫu chi tiết liên hệ mà bạn tìm thấy trong ứng dụng "Mọi người" được bao gồm trong Windows Phone 7 để quản lý danh bạ và địa chỉ. Đây không phải là một ví dụ phức tạp, và người ta sẽ mong đợi điều này để làm việc ra khỏi hộp và không bao gồm các mục trong biểu mẫu. –

+0

Hãy thử điều này quá nếu nó có thể giúp với vấn đề di chuyển. http://www.luisleo.net/2012/06/24/how-to-use-listbox-properly-with-windows-phone-7/ –

Trả lời

0

Vấn đề là chiều cao ScrollViwer không được sửa đổi sau khi bàn phím xuất hiện để nó bị cắt bớt. Một giải pháp sẽ là sửa đổi chiều cao của scrollviwer (theo chiều cao bàn phím) và sau đó định vị lại nó (điều này có thể cung cấp cho bạn một số nhức đầu).

Một vấn đề khác là khi bàn phím xuất hiện - bạn có thể đăng ký các sự kiện GotFocus/LostFocus trên tất cả các TextBox của bạn nhưng nó không phải là một giải pháp tuyệt vời. Điều này có thể giúp bạn: http://blogs.msdn.com/b/jaimer/archive/2010/11/05/guessing-if-the-sip-is-visible-in-a-windows-phone-application.aspx

Hy vọng điều này sẽ giúp một chút :)

+0

Âm thanh như hack hợp lý. Tuy nhiên, điều này chỉ hoạt động nếu bạn chọn một hộp ở phía trên cùng của màn hình (khi nội dung ở dưới cùng của trình xem ảnh sẽ bị che khuất). Các hộp văn bản vị trí vật lý trên màn hình ảnh hưởng đến bao nhiêu trang được đẩy lên. Vì vậy, nếu nó ở trên cùng, nội dung chỉ được đẩy lên một cách nhẹ nhàng. Nếu nó ở dưới cùng, nội dung được đẩy lên rất xa. Theo như tôi biết, không thể xác định được bao nhiêu trang được điều chỉnh, có nghĩa là rất khó để bù đắp cho điều này. Ngoài ra, ngăn tiêu đề sẽ tiếp tục bị đẩy ra khỏi màn hình, điều này không lý tưởng. –

+0

Thankyou cho đề xuất của bạn mặc dù. :) –

0

Tôi nghĩ rằng bạn có thể giải quyết điều này bằng cách đến lúc vấn đề từ một góc độ khác. Điện thoại sẽ di chuyển lên trang để các SIP (bàn phím phần mềm) không bao giờ bao trùm lên các TextBox đã tập trung.

Tuy nhiên, bạn có thể buộc SIP ẩn bằng cách phát hiện các sự kiện chạm trên phần tử trên cùng có trong ScrollViewer của bạn, ví dụ::

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

Sau đó, bằng cách đặt trọng tâm vào nút ẩn (kích thước 0x0 pixel) điều này sẽ buộc SIP đóng. Sau đó, người dùng của bạn có thể cuộn lên và xuống trình cuộn scrollviewer như mong đợi ...

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(); 
    } 
+0

Bạn chỉ có thể gọi hàm này.Focus() trong mã phía sau để đặt tiêu điểm cho Trang để ẩn SIP. Không cần phải tạo thêm một đối tượng ẩn. – Styff

0

Tôi đã gặp vấn đề tương tự với ứng dụng tôi đã phát triển và cách tôi xử lý nó tìm chiều cao tự động của bảng điều khiển chứa đầu vào textbox s và sau đó đặt chiều cao theo cách thủ công và thêm khoảng 400 - 500 px vào dưới cùng để làm cho nó cuộn độc đáo. Hiệu ứng này khá trơn tru và sẽ không làm cho giao diện người dùng của bạn trông "hackish" IMHO.

Trong trường hợp của bạn, bạn sẽ phải tìm ra chiều cao tự động của LayoutRootGrid và sau đó trên RowDefinition của Row 1 thiết lập chiều cao bằng tay - nhớ để thêm một 400px thêm (hoặc bất kỳ trông phù hợp trong tình huống của bạn).

Để dễ nhập, tôi xử lý từng sự kiện OnKeyDown của mỗi TextBox để thay đổi tiêu điểm sang TextBox tiếp theo sau khi nhấn Enter. Trên TextBox vừa qua, tôi đặt trọng tâm cho this.focus(), tập trung vào Trang và ẩn SIP.

0

Có một cái nhìn tại thư viện nhỏ của tôi xin vui lòng - https://siphelper.codeplex.com/

Nó sẽ thay đổi chiều cao của ScrollViewer và nội dung có thể được cuộn vào/điểm dưới cùng trên cùng.

Nếu bạn có bất kỳ đề xuất nào - hãy liên hệ với tôi.