如何使用表格标题视图内的排除路径正确调整文本视图的大小 [英] How to properly resize textview with exclusionPaths inside of table header view

问题描述

我在 tableView 标题中添加了一个视图，由一个 imageView 和一个 textView 组成.图像视图在顶角左对齐，文本视图在图像视图上延伸到屏幕右侧，如下所示.

I have added a view to my tableView header consisting of an imageView and a textView. The image view is left aligned in the top corner and the textview extends over the imageview to the right side of the screen like as follows.

textView 可以有动态内容并且有如下设置的排除路径:

The textView can have dynamic content and has an exclusion path set as follows:

let imagePath = UIBezierPath(rect: imageView.frame)
self.textView.textContainer.exclusionPaths = [imagePath]

我禁用了 textview 的滚动，并在标题视图中设置了以下约束:

I have disabled scrolling for the textview and have set the following constraints inside of the header view:

TextView:左 - 8px，右 - 8px，顶部 - 0px，底部 - 8px

TextView: left - 8px, right - 8px, top - 0px, bottom - 8px

ImageView: left - 8px, width - 100px, height 100px, top - 8px, bottom - 大于或等于8px

ImageView: left - 8px, width - 100px, height 100px, top - 8px, bottom - greater than or equal to 8px

我在 textView 填充动态文本后添加了此代码:

I have added this code after my textView is populated with the dynamic text:

if let headerView = self.tableView.tableHeaderView {
    let height = headerView.systemLayoutSizeFitting(UILayoutFittingCompressedSize).height
    var headerFrame = headerView.frame

    if height != headerFrame.size.height {
        headerFrame.size.height = height
        headerView.frame = headerFrame
        self.tableView.tableHeaderView = headerView
    }
}

用于调整标题的大小.但是，当 textView 的文本少于图像的高度时，视图的大小会增加.

Which adjusts the size of the header. However, when the textView has less text than the height of the image, the size of the view grows.

三行文字示例:

六行文字示例:

足够文本以传递图像视图的示例:

Example of enough text to pass imageview:

有人知道为什么会这样吗?

Does anyone know why this is happening?

推荐答案

我有一个解决方案，因为我自己刚刚遇到这个问题:)你看，我试图做一些非常相似的事情，其中​​ UITextView 的文本应该避免 UIImageView 在它的左边.我的代码如下:

I have a fix for this, because I just encountered this issue myself :) You see, I was trying to do something very similar, where a UITextView's text should avoid a UIImageView to its left. My code was the following:

let ticketProfileExclusionPath = UIBezierPath(roundedRect: ticketProfilePicture.frame, cornerRadius: Constants.ProfilePictureExclusionRadius)
ticketContent.textContainer.exclusionPaths.append(ticketProfileExclusionPath)

而且我的结果不是很好:

And my results were not very good:

如您所见，问题依赖于给 ticketContent UITextView 的 CGRect 作为其排除路径，因为 后者假设给定的 CGRect 被修正到它自己的框架，而不是它的父视图的.

As you can see, the problem relies on the CGRect given to the ticketContent UITextView as its exclusion path, since the latter assumes the given CGRect is corrected to its own frame, not its superview's.

修复非常简单，需要使用自出现 (iOS 2.0) 以来就存在的 API:

The fix is very simple and requires the use of an API present since the dawn of time (iOS 2.0):

let exclusionPathFrame = convert(ticketProfilePicture.frame, to: ticketContent).offsetBy(dx: Constants.SystemMargin, dy: Constants.Zero)

我们在这里做的是将 UIImageView 的框架转换为 UITextView 的坐标系，因此从 UITextView 的角度提供了正确的排除路径代码>UITextView.添加的偏移量只是为了对齐我的 UITableViewCell 的文本 UIView 的所有三个.

What we're doing here is converting the UIImageView's frame to the UITextView's coordinate system, therefore providing the correct exclusion path from the perspective of the UITextView. The added offset is simply to align all three of my UITableViewCell's text UIViews.

convert() 是一个 UIView 方法.

如您所见，文本现在很好地环绕 ticketProfilePicture UIImageView.

As you can see, the text now wraps around the ticketProfilePicture UIImageView quite nicely.

希望这会有所帮助.

这篇关于如何使用表格标题视图内的排除路径正确调整文本视图的大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！