UIScrollView水平分页，如移动Safari标签 [英] UIScrollView horizontal paging like Mobile Safari tabs

问题描述

移动Safari允许您通过输入一个UIScrollView水平分页视图（页面控件位于底部）来切换页面。

我试图复制此特定行为其中水平滚动的UIScrollView显示了下一个视图的内容。

Apple提供的示例：PageControl显示如何使用UIScrollView进行水平分页，但所有视图都占用整个屏幕宽度。

如何获取UIScrollView显示下一个视图的一些内容，如移动Safari？

解决方案

启用分页的A UIScrollView 将在帧宽度（或高度）的倍数处停止。所以第一步是弄清楚你希望你的网页有多宽。确定 UIScrollView 的宽度。然后，设置你的子视图的大小，你需要他们是，并设置其中心基于 UIScrollView 的宽度的倍数。

然后，由于你想查看其他页面，当然，将 clipsToBounds 设置为 NO 正如mhjoy所说。现在的技巧部分是当用户在 UIScrollView 的框架范围之外开始拖动时滚动。我的解决方案（当我不得不这样做最近）如下：

创建一个 UIView 子类 ClipView ），它将包含 UIScrollView 和它的子视图。基本上，它应该具有你将假设 UIScrollView 在正常情况下将具有的框架。将 UIScrollView 放在 ClipView 的中心。确保 ClipView 的 clipsToBounds 设置为 YES 如果它的宽度小于其父视图的宽度。此外， ClipView 需要引用 UIScrollView 。

最后一步是覆盖 ClipView 内的 - （UIView *）hitTest：withEvent： >

   - （UIView *）hitTest：（CGPoint）point withEvent：（UIEvent *）event {
 return [self pointInside：point withEvent：event]？ scrollView：nil; 
} 
  

这基本上扩展了 UIScrollView 到其父视图的框架，正是你需要的。

另一个选项是子类 UIScrollView 并覆盖其 - （BOOL）pointInside：（CGPoint）point withEvent：（UIEvent *）event 方法，但是你仍然需要一个容器视图来做裁剪，并且可能难以仅基于 UIScrollView 的帧确定何时返回 YES 。

注意：您还应该查看Juri Pakaste的 hitTest：withEvent：modification 。如果您遇到子视图用户互动问题。

Mobile Safari allows you to switch pages by entering a sort of UIScrollView horizontal paging view with a page control at the bottom.

I am trying to replicate this particular behavior where a horizontally scrollable UIScrollView shows some of the next view's content.

The Apple provided example: PageControl shows how to use a UIScrollView for horizontal paging, but all views take up the whole screen width.

How do I get a UIScrollView to show some content of the next view like mobile Safari does?

解决方案

A UIScrollView with paging enabled will stop at multiples of its frame width (or height). So the first step is to figure out how wide you want your pages to be. Make that the width of the UIScrollView. Then, set your subview's sizes however big you need them to be, and set their centers based on multiples of the UIScrollView's width.

Then, since you want to see the other pages, of course, set clipsToBounds to NO as mhjoy stated. The trick part now is getting it to scroll when the user starts the drag outside the range of the UIScrollView's frame. My solution (when I had to do this very recently) was as follows:

Create a UIView subclass (i.e. ClipView) that will contain the UIScrollView and it's subviews. Essentially, it should have the frame of what you would assume the UIScrollView would have under normal circumstances. Place the UIScrollView in the center of the ClipView. Make sure the ClipView's clipsToBounds is set to YES if its width is less than that of its parent view. Also, the ClipView needs a reference to the UIScrollView.

The final step is to override - (UIView *)hitTest:withEvent: inside the ClipView.

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event {
  return [self pointInside:point withEvent:event] ? scrollView : nil;
}

This basically expands the touch area of the UIScrollView to the frame of its parent's view, exactly what you need.

Another option would be to subclass UIScrollView and override its - (BOOL)pointInside:(CGPoint) point withEvent:(UIEvent *) event method, however you will still need a container view to do the clipping, and it may be difficult to determine when to return YES based only on the UIScrollView's frame.

NOTE: You should also take a look at Juri Pakaste's hitTest:withEvent: modification if you are having issues with subview user interaction.

这篇关于UIScrollView水平分页，如移动Safari标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！