在我的项目中,我将UIWebView
置于UINavigationBar
下,设置UIWebView
以占据除UINavigationBar
以外的其他屏幕。但我发现两个控件之间存在一些差距。左边缘和UIWebView
左侧之间也存在间隙。知道我错过了什么吗?
这是我更新的代码:
在UIView+AutoLayout
中:(此类别会将所有视图的translatesAutoresizingMaskIntoConstraints
属性设置为NO
)
#import "UIView+AutoLayout.h"
@implementation UIView (AutoLayout)
+ (id)autolayoutView
{
UIView *view = [self new];
view.translatesAutoresizingMaskIntoConstraints = NO;
return view;
}
@end
ViewController中的:
- (void)viewDidLoad
{
[super viewDidLoad];
self.navigationBar = [UINavigationBar autolayoutView];
UINavigationItem *backToListItem = [[UINavigationItem alloc] init];
UIBarButtonItem *listItem = [[UIBarButtonItem alloc] initWithTitle:@"List" style:UIBarButtonItemStylePlain target:self action:@selector(listButtonPressed:)];
backToListItem.leftBarButtonItem = listItem;
self.navigationBar.items = [NSArray arrayWithObject:backToListItem];
[self.view addSubview:self.navigationBar];
self.webView = [TNSWebView autolayoutView];
[self.view addSubview:self.webView];
NSDictionary *views = NSDictionaryOfVariableBindings(_navigationBar, _webView);
[self.view addConstraints:[NSLayoutConstraint
constraintsWithVisualFormat:@"|[_navigationBar]|"
options:0 metrics:nil
views:views]];
[self.view addConstraints:[NSLayoutConstraint
constraintsWithVisualFormat:@"V:|[_navigationBar]->=0-[_webView]|"
options:0 metrics:nil
views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[_webView]|" options:0 metrics:nil views:views]];
[self.webView setupVideoPlayer:self.videoId];
}
在po [[UIWindow keyWindow] recursiveDescription]
中使用lldb
命令我得到了这个结果
| <UIView: 0x1d23f880; frame = (0 20; 768 1004); autoresize = RM+BM; layer = <CALayer: 0x1d23cba0>>
| | <UINavigationBar: 0x1d00a4b0; frame = (0 0; 768 44); gestureRecognizers = <NSArray: 0x1d015ff0>; layer = <CALayer: 0x1d0c8f60>>
| | | <_UINavigationBarBackground: 0x1d010250; frame = (0 0; 768 44); opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d011140>>
| | | | <UIImageView: 0x1d0d26b0; frame = (0 44; 768 3); opaque = NO; autoresize = W+TM; userInteractionEnabled = NO; layer = <CALayer: 0x1d23fbd0>>
| | | <UINavigationItemView: 0x1d016740; frame = (384 22; 0 0); opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d016840>>
| | | <UINavigationButton: 0x1d013ff0; frame = (7 7; 48 30); opaque = NO; layer = <CALayer: 0x1d014170>>
| | | | <UIImageView: 0x1c5d9ca0; frame = (0 0; 48 30); clipsToBounds = YES; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1c58b330>>
| | | | <UIButtonLabel: 0x1d0144c0; frame = (13 7; 22 15); text = 'List'; clipsToBounds = YES; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d014560>>
| | <TNSWebView: 0x1d016bc0; baseClass = UIWebView; frame = (0 44; 768 960); layer = <CALayer: 0x1d016ca0>>
| | | <_UIWebViewScrollView: 0x1d012390; frame = (0 0; 768 960); clipsToBounds = YES; autoresize = H; gestureRecognizers = <NSArray: 0x1d011380>; layer = <CALayer: 0x1d0125e0>; contentOffset: {0, 0}>
| | | | <UIImageView: 0x1d00f2a0; frame = (0 0; 10 10); transform = [-1, 0, -0, -1, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d00f300>>
| | | | <UIImageView: 0x1d00f210; frame = (0 0; 10 10); transform = [0, 1, -1, 0, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d00f270>>
| | | | <UIImageView: 0x1d00f180; frame = (0 0; 10 10); transform = [0, -1, 1, 0, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d00f1e0>>
| | | | <UIImageView: 0x1d00efb0; frame = (0 0; 10 10); alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d00f150>>
| | | | <UIImageView: 0x1d00ef20; frame = (-4.5 4.5; 10 1); transform = [0, 1, -1, 0, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d00ef80>>
| | | | <UIImageView: 0x1d00ee90; frame = (-4.5 4.5; 10 1); transform = [0, -1, 1, 0, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d00eef0>>
| | | | <UIImageView: 0x1d00ee00; frame = (0 0; 1 10); transform = [-1, 0, -0, -1, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d00ee60>>
| | | | <UIImageView: 0x1d00ec30; frame = (0 0; 1 10); alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d00edd0>>
| | | | <UIImageView: 0x1d00eba0; frame = (0 954; 768 6); alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d00ec00>>
| | | | <UIImageView: 0x1d00fcd0; frame = (0 0; 768 6); transform = [-1, 0, -0, -1, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1d00fe70>>
| | | | <UIWebBrowserView: 0x1dbf2400; frame = (0 0; 768 960); gestureRecognizers = <NSArray: 0x1d014c40>; layer = <UIWebLayer: 0x1d017d00>>
| | | | | <TileHostLayer: 0x1d017e70> (layer)
| | | | | | <TileLayer: 0x1c5511a0> (layer)
| | | | | | <TileLayer: 0x1c551210> (layer)
| | | | | | <TileLayer: 0x1c551250> (layer)
| | | | | | <TileLayer: 0x1c551290> (layer)
更新的屏幕截图:
只需将导航栏的高度更改为44并使用recursiveDescription命令即可:
$0 = 0x2008f680 <UIWindow: 0x1ed814f0; frame = (0 0; 768 1024); autoresize = W+H; layer = <UIWindowLayer: 0x1ed815f0>>
| <UIView: 0x20167680; frame = (0 20; 768 1004); autoresize = RM+BM; layer = <CALayer: 0x1ed0ea50>>
| | <UINavigationBar: 0x1ed14b70; frame = (0 0; 768 44); gestureRecognizers = <NSArray: 0x20081bd0>; layer = <CALayer: 0x1ed09ff0>>
| | | <_UINavigationBarBackground: 0x1ed8b9b0; frame = (0 0; 768 44); opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x1ed08570>>
| | | | <UIImageView: 0x2007aa90; frame = (0 44; 768 3); opaque = NO; autoresize = W+TM; userInteractionEnabled = NO; layer = <CALayer: 0x200f9640>>
| | | <UINavigationItemView: 0x20053320; frame = (384 22; 0 0); opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x200f9c30>>
| | | <UINavigationButton: 0x200fa980; frame = (7 7; 48 30); opaque = NO; layer = <CALayer: 0x200f50c0>>
| | | | <UIImageView: 0x2016af20; frame = (0 0; 48 30); clipsToBounds = YES; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x2016af80>>
| | | | <UIButtonLabel: 0x2004e420; frame = (13 7; 22 15); text = 'List'; clipsToBounds = YES; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x200f8040>>
| | <TNSWebView: 0x2004d660; baseClass = UIWebView; frame = (0 44; 768 960); layer = <CALayer: 0x20053f20>>
| | | <_UIWebViewScrollView: 0x2004a230; frame = (0 0; 768 960); clipsToBounds = YES; autoresize = H; gestureRecognizers = <NSArray: 0x20049700>; layer = <CALayer: 0x2004a6c0>; contentOffset: {0, 0}>
| | | | <UIImageView: 0x20048d50; frame = (0 0; 10 10); transform = [-1, 0, -0, -1, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x20048db0>>
| | | | <UIImageView: 0x20048cc0; frame = (0 0; 10 10); transform = [0, 1, -1, 0, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x20048d20>>
| | | | <UIImageView: 0x20048c30; frame = (0 0; 10 10); transform = [0, -1, 1, 0, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x20048c90>>
| | | | <UIImageView: 0x200f7c50; frame = (0 0; 10 10); alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x20048c00>>
| | | | <UIImageView: 0x200f7bc0; frame = (-4.5 4.5; 10 1); transform = [0, 1, -1, 0, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x200f7c20>>
| | | | <UIImageView: 0x200f7b30; frame = (-4.5 4.5; 10 1); transform = [0, -1, 1, 0, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x200f7b90>>
| | | | <UIImageView: 0x200f7a30; frame = (0 0; 1 10); transform = [-1, 0, -0, -1, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x200f7b00>>
| | | | <UIImageView: 0x200f7890; frame = (0 0; 1 10); alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x200f7a00>>
| | | | <UIImageView: 0x200fad20; frame = (0 954; 768 6); alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x200fad80>>
| | | | <UIImageView: 0x200fab80; frame = (0 0; 768 6); transform = [-1, 0, -0, -1, 0, 0]; alpha = 0; opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x200facf0>>
| | | | <UIWebBrowserView: 0x1fb37600; frame = (0 0; 768 960); gestureRecognizers = <NSArray: 0x20049910>; layer = <UIWebLayer: 0x200f81c0>>
| | | | | <TileHostLayer: 0x2004ed10> (layer)
| | | | | | <TileLayer: 0x20168820> (layer)
| | | | | | <TileLayer: 0x20168890> (layer)
| | | | | | <TileLayer: 0x201688d0> (layer)
| | | | | | <TileLayer: 0x20168910> (layer)
答案 0 :(得分:2)
我把它全部拿回来。您的问题不在于视图布局。我相信您的问题是您加载到Web视图中的Web内容周围有边框(或填充或边距)。您可能会发现“Debugging Web Content on iOS”很有用。它解释了如何在Safari(在Mac上)中使用Web Inspector来调试在模拟器或设备上运行的UIWebView
中的内容。我想如果你检查网页内容中的视频元素,你会发现它没有与视口的左上边缘齐平。
我猜想在viewDidLoad
中查看时,导航栏高度设置不正确。现在检查你刚刚创建的视图框架还为时过早。
iOS应用程序将时间用于“运行循环”,如下所示:
while (1) {
Event phase: process one event (e.g. touch event, timer firing, local or push notification, etc.)
Layout phase: update the frames of new views and views with added or removed subviews
Draw phase: draw the contents of views that need to be drawn
Wait for the next event to arrive
}
将视图添加到视图层次结构时,它们将安排在布局阶段进行布局。直到布局阶段完成后,您才可以依赖新视图来获得正确的帧。
您可以通过编写UIView
的子类(或根据需要编写任何其他视图类的子类)并覆盖其layoutSubviews
方法来进入布局阶段。或者您可以在视图控制器中实现viewDidLayoutSubviews
方法。我建议使用UIView
子类并覆盖layoutSubviews
,但您可能会发现仅实施viewDidLayoutSubviews
更为便利:
- (void)viewDidLayoutSubviews {
[super viewDidLayoutSubviews];
[self layoutWebView];
}
- (void)layoutWebView {
CGRect frame = self.view.bounds;
CGFloat navBarHeight = self.navigationBar.frame.size.height;
frame.origin.y = navBarHeight;
frame.size.height -= navBarHeight;
self.webView.frame = frame;
}
或者,如果您的部署目标是iOS 6或更高版本,则可以使用自动布局将导航栏的下边缘固定到Web视图的上边缘。把它放在viewDidLoad
:
[self.view addLayoutConstraints:[NSLayoutConstraint
constraintsWithVisualFormat:@"|V:[_navigationBar][_webView]|"
options:0 metrics:nil
views:NSDictionaryOfVariableBindings(_navigationBar, _webView)]];
现在,我认为你的应用中特别发生的事情是你在创建UINavigationBar
时指定了50的高度,但是UINavigationBar
想要高度为44.所以在布局中相位,导航栏自调整到44点高。由于在布局过程中没有做任何事情来修复Web视图的框架,因此Web视图仍然位于顶层视图顶部边缘下方50个点,留下6个点的间隙。因此,您可以在创建导航栏时将其高度更改为44。 ; ^)
答案 1 :(得分:0)
也许您需要查看您的webView的查看模式。 在StoryBoard或xib上,查看左侧面板,选择属性检查器,检查webView的视图模式选择(例如缩放到填充, AspectFit , AspectFill .. 强>)。