iPhone X – 我们如何处理表格节标题上方的空格? 它通过内容展示

我有一个tableview,每个部分有多个部分和部分标题。 如您所知,节标题随tableview一起移动。 因此,如果有多个部分,则当前部分的标题会粘到tableview的顶部,而该部分的内容会在标题下滚动。

我试图弄清楚它应该如何适应iPhone X,因为标题上方的空间正如您在此屏幕截图中所注意到的那样显示内容。 我看了Apple关于如何适应iPhone X缺口的观点,但他们的所有示例都有一个顶部的搜索栏视图,所以他们从未真正面对这个问题。

在此处输入图像描述

正如您在此屏幕截图中注意到的那样,标题上方的空间正在显示内容

区分两件事:主视图,在凹槽后面延伸,以及表视图。 将表格视图顶部固定在安全区域的顶部。 在iPhone X上, 在iPhone X上,安全区域的顶部将从主视图的顶部向下,安全区域的底部将从主视图的底部向上,保持您的从俯卧撑后面或指示器后面的桌子视图。

在此屏幕截图中,有几个单元格在A标题上方滚动,但您看不到它们。 并且表格视图的底部不会显示虚拟主页指示符。

在此处输入图像描述

这只是给表视图控制器一个黑色背景的父视图控制器。 您可以在代码中执行此操作,也可以在故事板中完全配置它而无需代码。

如果您有兴趣,那么您可以查看这个github页面,它使您能够解决这个问题:

https://github.com/HarshilShah/NotchKit

这就是我最终做的事情。

我在里面添加了一个带有UIVisualEffectView的新UIViewnotchFIxView )。 我将它放在视图控制器的顶部。 这是所有tableview之外的最顶层视图。 我将顶部,左侧和右侧约束固定到superview(不是安全区域)。

我将此视图的底部固定在安全区域的顶部。

我将UIScrollViewDelegate协议添加到接口并跟随用于iPhoneX检测的宏:

 #define IS_IPHONE (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone) #define SCREEN_WIDTH ([[UIScreen mainScreen] bounds].size.width) #define SCREEN_HEIGHT ([[UIScreen mainScreen] bounds].size.height) #define SCREEN_MAX_LENGTH (MAX(SCREEN_WIDTH, SCREEN_HEIGHT)) #define IS_IPHONE_X (IS_IPHONE && SCREEN_MAX_LENGTH == 812.0) 

我添加了一个BOOL checkIfNotch; 变量到我的界面并在viewDidLoad中初始化它:

 checkIfNotch = IS_IPHONE_X; 

然后,最终显示/隐藏notchFIxView如下:

 - (void)scrollViewDidScroll:(UIScrollView *)scrollView{ if (checkIfNotch) { static CGFloat lastY = 0; CGFloat currentY = scrollView.contentOffset.y; if ((lastY <= tableheaderviewHeight) && (currentY > tableheaderviewHeight)) { NSLog(@" ******* Header view just disappeared"); self.notchFIxView.hidden=NO; [UIView animateWithDuration:0.3 animations:^{ self.notchFIxView.alpha=1; } completion:^(BOOL finished) { }]; } if ((lastY > tableheaderviewHeight) && (currentY <= tableheaderviewHeight)) { NSLog(@" ******* Header view just appeared"); [UIView animateWithDuration:0.3 animations:^{ self.notchFIxView.alpha=0; } completion:^(BOOL finished) { self.notchFIxView.hidden=YES; }]; } lastY = currentY; } } 

在此之后,它看起来更好:

在此处输入图像描述