解决点击状态栏时ScrollView自动滚动到初始位置失效办法

作者:维尼的小熊 授权本站转载。

相信细心的开发者都会发现scrollView自带一个功能,当用户点击顶部的状态栏时,scrollView的ContentOffset.y轴会自动滚动到初始位置,效果如图所示:

1.gif

单个scrollView单击顶部状态栏系统自带功能展示

这个功能对用户来说非常实用,尤其是在scrollView(TableView, WebView, CollectionView一切继承scrollView的控件)展示的内容很多,当用户翻看很久以后,想回到最顶部时,只需单击一下顶部的状态栏位置就可以轻松返回到顶部(这里吐槽下.貌似很多用户都不知道有这个功能),而不用使劲用手滑动到顶部.

可是功能在当前控制器有多个scrollView(TableView, WebView, CollectionView一切继承scrollView的控件)的时候就会失效,效果如下图所示:

2.gif

当控制器内有多个scrollView时,系统自带的滚动到顶的功能就会失效

如图所示,一旦有多个scrollView时,系统自带的方法就失效了

实际开发中,我们的产品在同一个控制器经常会有多个scrollView组合在一起的情况,这就意味着系统的方法已经失效了,需要开发人员自己来实现这个效果,下面我们就来搞定这个需求

我们分析下原生的方法为什么会失效,当一个控制器内只有一个scrollView时,点击状态栏,系统会遍历当前keyWindow的子控件,发现子控件中只有一个scrollView会调用这个scrollView的setContentOffset: animated:的这个方法,将scrollView的contentOffset.y值修改为初始值,但是当子控件中又多个scrollView时,系统会不知道掉用哪一个scrollView而失效,知道这点我们就知道该如何搞定这个问题了

这里就直接将解决思路一一写出来不将代码分段展示了,在代码中我加了详细的注释objective-c的套路和swift基本一样,在最后会将Swift和objective-c的代码一起放上,如果需要直接解决问题的童鞋可以直接将代码拷贝到工程里即可

  • 首先创建一个topWindow继承至NSObject,这里我们考虑将这个功能完全封装起来,所以所有的方法都用的类方法,所以用最基本的类就可以

  • 在initialize方法中初始化topWIndow,将topWIndow的级别改成最高的UIWindowLevelAlert级别,设置topWindow位置,并且添加点击手势

  • 在topWIndow被点击调用的方法中,我们拿出UIApplication的keyWindow,遍历keyWindow的所有子控件,如果满足是scrollView同时又显示在当前keyWindow条件时,将subView的contentOffset的y值回复到原始

  • 然后采用递归的套路在遍历subView内时候有满足条件的子控件,直到没有满足条件时会停止

Swift的代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
import UIKit
class TopWindow: UIWindow {
     private static let window_: UIWindow = UIWindow()
     ///  类初始化方法,保证window_只被创建一次
     override class func initialize() {
         window_.frame = CGRectMake(0, 0, global.appWidth, 20)
         window_.windowLevel = UIWindowLevelAlert
         window_.addGestureRecognizer(UITapGestureRecognizer(target: self, action:  "topWindowClick" ))
     }
     class func topWindowClick() {
         // 遍历当前主窗口所有view,将满足条件的scrollView滚动回原位
         searchAllowScrollViewInView(UIApplication.sharedApplication().keyWindow!)
     }
     private class func searchAllowScrollViewInView(superView: UIView) {
         for  subview: UIView  in  superView.subviews as! [UIView] {
             if  subview.isKindOfClass(UIScrollView.self) && superView.viewIsInKeyWindow() {
                 // 拿到scrollView的contentOffset
                 var  offest = (subview as! UIScrollView).contentOffset
                 // 将offest的y轴还原成最开始的值
                 offest.y = -(subview as! UIScrollView).contentInset.top
                 // 重新设置scrollView的内容
                 (subview as! UIScrollView).setContentOffset(offest, animated:  true )
             }
             // 递归,让子控件再次调用这个方法判断时候还有满足条件的view
             searchAllowScrollViewInView(subview)
         }
     }
     ///  添加topWindow,使手势生效
     class func showTopWindow() {
         window_.hidden =  false
     }
     ///  隐藏topWindow,移除手势
     class func hiddenTopWindow() {
         window_.hidden =  true
     }
}
///  对UIView的一个扩展
extension UIView {
     ///  判断调用方法的view是否在keyWindow中
     func viewIsInKeyWindow() -> Bool {
         let keyWindow = UIApplication.sharedApplication().keyWindow!
         // 将当前view的坐标系转换到window.bounds
         let viewNewFrame = keyWindow.convertRect(self.frame, fromView: self.superview)
         let keyWindowBounds = keyWindow.bounds
         // 判断当前view是否在keyWindow的范围内
         let isIntersects = CGRectIntersectsRect(viewNewFrame, keyWindowBounds)
         // 判断是否满足所有条件
         return  !self.hidden && self.alpha > 0.01 && self.window == keyWindow && isIntersects
     }   
}

在AppDelegate里,程序启动完成方法时添加就OK了

1
2
3
4
5
   func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
       // 添加顶部的window
       TopWindow.showTopWindow()
       return  true
   }

需要注意添加了自定义的window后,控制器的改变状态栏状态方法会失效,可以在info.plist中将改变状态栏的管理权交给UIApplication解决,或者在需要改变状态栏的控制器中调用TopWindow.hiddenTopWindow()即可,或者直接改info.plist,用UIApplication.sharedApplication().setStatusBarStyle来管理

objective-c代码

.h文件只暴露显示和隐藏方法

1
2
3
4
#import @interface WNXTopWindow : NSObject
+ (void)show;
+ (void)hide;
@end

.m文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
#import "WNXTopWindow.h"
@implementation WNXTopWindow
static UIWindow *window_;
//初始化window
+ (void)initialize {
   window_ = [[UIWindow alloc] init];
   window_.frame = CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 20);
   window_.windowLevel = UIWindowLevelAlert;
   [window_ addGestureRecognizer:[[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(windowClick)]];
}  
+ (void)show {
   window_.hidden = NO;
}
+ (void)hide {
   window_.hidden = YES;
}
// 监听窗口点击
+ (void)windowClick {
   UIWindow *window = [UIApplication sharedApplication].keyWindow;
   [self searchScrollViewInView:window];
}
+ (void)searchScrollViewInView:(UIView *)superview {
   for  (UIScrollView *subview  in  superview.subviews) {
       // 如果是scrollview, 滚动最顶部
       if  ([subview isKindOfClass:[UIScrollView class]] && [subview isShowingOnKeyWindow]) {
           CGPoint offset = subview.contentOffset;
           offset.y = - subview.contentInset.top;
           [subview setContentOffset:offset animated:YES];
       }
       // 递归继续查找子控件
       [self searchScrollViewInView:subview];
   }
}
+ (BOOL)isShowingOnKeyWindow:(UIView *)view {
   // 主窗口
   UIWindow *keyWindow = [UIApplication sharedApplication].keyWindow;
   // 以主窗口左上角为坐标原点, 计算self的矩形框
   CGRect newFrame = [keyWindow convertRect:view.frame fromView:view.superview];
   CGRect winBounds = keyWindow.bounds;
   // 主窗口的bounds 和 self的矩形框 是否有重叠
   BOOL intersects = CGRectIntersectsRect(newFrame, winBounds);
   return  !view.isHidden && view.alpha > 0.01 && view.window == keyWindow && intersects;
}
@end

同样,也是在程序初始化完成AppDelegate文件中显示topWindow,整个工程这个问题就统统解决了

1
2
3
4
5
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
   // 添加一个window, 点击这个window, 可以让屏幕上的scrollView滚到最顶部
   [WNXTopWindow show];
   return  YES;
}

完成的效果

3.gif

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: Unity ScrollView可以通过编写代码实现自动滚动。可以使用以下代码: ```csharp public class AutoScrollView : MonoBehaviour { public float scrollSpeed = 1.f; public RectTransform content; private bool isScrolling = false; void Start() { StartCoroutine(ScrollContent()); } IEnumerator ScrollContent() { while (true) { if (isScrolling) { content.anchoredPosition += Vector2.up * scrollSpeed * Time.deltaTime; } yield return null; } } public void StartScrolling() { isScrolling = true; } public void StopScrolling() { isScrolling = false; } } ``` 这个脚本可以将ScrollView的内容向上滚动。可以通过调整scrollSpeed的值来控制滚动速度。在StartScrolling()方法中设置isScrolling为true,就可以开始自动滚动。在StopScrolling()方法中设置isScrolling为false,就可以停止自动滚动。 ### 回答2: 在Unity中,ScrollView组件允许用户滑动一个容器内的子对象。ScrollView可以手动滑动,也可以通过代码实现自动滚动。 要实现ScrollView自动滚动,需要在代码中使用协程和Lerp。协程是一种特殊的函数,可以在一段间内等待执行另一个任务。Lerp函数是一种插值函数,可以使用线性插值来获得两个值之间的中间值。 实现自动滚动的步骤如下: 1.获取ScrollView组件和容器RectTransform ScrollView scrollView = GetComponent<ScrollView>(); RectTransform container = scrollView.content; 2.计算目标滚动位置 float targetPosition = container.anchoredPosition.y - scrollSpeed; //scrollSpeed是滚动速度,在代码中定义 3.使用协程实现滚动 //定义协程函数 IEnumerator ScrollCoroutine(float targetPosition) { Vector2 startPosition = container.anchoredPosition; float elapsedTime = 0f; while (elapsedTime < scrollDuration) { elapsedTime += Time.deltaTime; float t = Mathf.Clamp01(elapsedTime / scrollDuration); container.anchoredPosition = Vector2.Lerp(startPosition, new Vector2(startPosition.x, targetPosition), t); yield return null; } } //调用协程函数 StartCoroutine(ScrollCoroutine(targetPosition)); 4.将以上步骤封装成函数 void AutoScroll(float scrollSpeed, float scrollDuration) { float targetPosition = container.anchoredPosition.y - scrollSpeed; StartCoroutine(ScrollCoroutine(targetPosition, scrollDuration)); } 通过这种方式,就可以在代码中实现自动滚动ScrollView。可以通过调整滚动速度和滚动间来控制自动滚动的速度和持续间。 ### 回答3: Unity中的ScrollView是非常常用的UI控件之一。它可以让玩家在屏幕上滑动内容,从而使得内容看起来更加丰富多样。然而,在一些情况下,我们希望ScrollView能够自动滚动,比如,当玩家打开一个页面后,ScrollView自动向下滚动几秒钟,然后停止在某个位置。这,我们可以使用Unity中的协程来实现这一功能。具体实现流程如下: 1. 首先,在Unity中创建一个ScrollView,给它添加一个RectTransform组件。在Rect Transform组件中,设置它的锚点和位置,使其适应屏幕。 2. 在ScrollView的Content中添加需要显示的UI元素。 3. 创建一个C#脚本,将其添加到ScrollView的GameObject中。 4. 在脚本中添加如下代码: ``` IEnumerator Scroll() { yield return new WaitForSeconds(3f); // 等待3秒钟 while (true) { yield return new WaitForSeconds(0.05f); // 每0.05秒钟滚动一次 scrollView.verticalNormalizedPosition = Mathf.MoveTowards(scrollView.verticalNormalizedPosition, 0.5f, Time.deltaTime); // 滚动ScrollView } } ``` 5. 在Start()函数中启动这个协程。 ``` void Start() { StartCoroutine(Scroll()); } ``` 这ScrollView自动滚动并且停止在位置0.5处。如果需要滚动到其他位置,只需要将0.5f替换成相应的位置即可。如果需要停止滚动,只需要在相应位置添加代码break即可。 需要注意的是,在使用自动滚动候,尽量不要让玩家手动触碰屏幕,因为这会打断自动滚动效果。当玩家再次手动触碰屏幕,我们可以通过代码中的break语句来停止自动滚动
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值