在 xcode8 中为 iOS 10.2 在 scrollview 中制作 UIimageView 和 textview 的自动布局
making an auto layout of UIimageView and textview inside scrollview for iOS 10.2 in xcode8
我正在 xcode8 中为 iOS 10.2 制作笔记应用程序。注释由文本字段、文本视图和图像视图组成。我在单独的滚动视图中添加了 textview 和 imageview(以提供缩放和调整图像的便利)。然后我在 stackview 中添加了两个滚动视图,以确保 imageview 和 textview 在横向模式下并排站立。为此,我在 stackview 的轴 属性 中添加了变化(width=any,height= compact 和 Gamut=any,并将其设置为水平,如屏幕截图右角所示 to see view hierarchy without any constraints) .
我尝试了很多限制,但每次都无法采用。让我们举个例子,我正在根据内容的大小调整滚动视图的大小(通过设置顶部、底部、前导和尾随约束),堆栈视图被调整到主视图。现在,唯一需要调整的是关于堆栈视图的文本视图和图像视图。但是,这是棘手的部分如果我将文本视图的固定尾随约束包含到堆栈视图中;它将在纵向 mode.As 中工作,很快我就会进入横向模式,该约束将不起作用(与堆栈视图的距离为 0 的尾随约束),因为边缘将位于图像视图的一侧而不是堆栈视图(因为我正在放置图像和文本并排,如上文所述),这将使文本视图大于所需,图像视图对堆栈视图的主要约束和图像视图之间的垂直距离约束也是如此,textview.I 认为问题的根源是我有对堆栈视图的轴进行了更改(以便在横向模式下并排显示文本和图像)但是,这是必要的 part.Can 有人对此有解决方案吗?你认为还有其他问题吗?我应该选择 Intrinsic Size of scrollviews to placeholder 选项还是让它成为系统默认值?
谢谢。
所以我希望我能理解这个问题,并且我会尝试向您介绍我所理解的您希望完成的事情。我首先说我只是因为向后兼容性才开始使用 UIStackView。
注意。为了使用 AutoLayout 获得 ScrollView 的魔力,我几乎总是将它们嵌入到另一个 UIView 中。有理由不这样做,但在这种情况下,您将看到这对 AutoLayout 的价值。
步骤 1) 拖动 UIStackView 并添加 Top、Bottom、Leading 和 Trailing。现在添加 2 个 UIViews 并将 UIStackView 设置为 Fill Equally。它现在看起来像图像(用于检查您的工作的背景颜色)。
步骤 2) 现在向这些 UIView 中的每一个添加一个 UIScrollView。添加前导、尾随、顶部和底部。
Step 3) 分别在ScrollViews中添加一个UITextView和UIImageView。现在 Autolayout 对我们很生气 :( 但我们会解决这个问题。
第 4 步)从 UIImageView 拖动到包含 UIScrollView 的视图(我们添加的第一组视图)。见图
-选择添加等宽选项。见图像
重复相同的步骤但添加等高。现在将 Top、Bottom、Leading 和 Trailing 添加到 ScrollView。
第 5 步)使用 UITextView 重复第 4 步
您的最终视图层次结构应如下所示。
现在你可以旋转你的 UIStackView 并做你想做的事。
和水平
并排预览
我确实在顶部的文本字段上添加了一个 <= 0.1 等高乘数,但我不知道是否有必要。
尽情享受吧。
我正在 xcode8 中为 iOS 10.2 制作笔记应用程序。注释由文本字段、文本视图和图像视图组成。我在单独的滚动视图中添加了 textview 和 imageview(以提供缩放和调整图像的便利)。然后我在 stackview 中添加了两个滚动视图,以确保 imageview 和 textview 在横向模式下并排站立。为此,我在 stackview 的轴 属性 中添加了变化(width=any,height= compact 和 Gamut=any,并将其设置为水平,如屏幕截图右角所示 to see view hierarchy without any constraints) . 我尝试了很多限制,但每次都无法采用。让我们举个例子,我正在根据内容的大小调整滚动视图的大小(通过设置顶部、底部、前导和尾随约束),堆栈视图被调整到主视图。现在,唯一需要调整的是关于堆栈视图的文本视图和图像视图。但是,这是棘手的部分如果我将文本视图的固定尾随约束包含到堆栈视图中;它将在纵向 mode.As 中工作,很快我就会进入横向模式,该约束将不起作用(与堆栈视图的距离为 0 的尾随约束),因为边缘将位于图像视图的一侧而不是堆栈视图(因为我正在放置图像和文本并排,如上文所述),这将使文本视图大于所需,图像视图对堆栈视图的主要约束和图像视图之间的垂直距离约束也是如此,textview.I 认为问题的根源是我有对堆栈视图的轴进行了更改(以便在横向模式下并排显示文本和图像)但是,这是必要的 part.Can 有人对此有解决方案吗?你认为还有其他问题吗?我应该选择 Intrinsic Size of scrollviews to placeholder 选项还是让它成为系统默认值?
谢谢。
所以我希望我能理解这个问题,并且我会尝试向您介绍我所理解的您希望完成的事情。我首先说我只是因为向后兼容性才开始使用 UIStackView。
注意。为了使用 AutoLayout 获得 ScrollView 的魔力,我几乎总是将它们嵌入到另一个 UIView 中。有理由不这样做,但在这种情况下,您将看到这对 AutoLayout 的价值。
步骤 1) 拖动 UIStackView 并添加 Top、Bottom、Leading 和 Trailing。现在添加 2 个 UIViews 并将 UIStackView 设置为 Fill Equally。它现在看起来像图像(用于检查您的工作的背景颜色)。
步骤 2) 现在向这些 UIView 中的每一个添加一个 UIScrollView。添加前导、尾随、顶部和底部。
Step 3) 分别在ScrollViews中添加一个UITextView和UIImageView。现在 Autolayout 对我们很生气 :( 但我们会解决这个问题。
第 4 步)从 UIImageView 拖动到包含 UIScrollView 的视图(我们添加的第一组视图)。见图
-选择添加等宽选项。见图像
重复相同的步骤但添加等高。现在将 Top、Bottom、Leading 和 Trailing 添加到 ScrollView。
第 5 步)使用 UITextView 重复第 4 步
您的最终视图层次结构应如下所示。
现在你可以旋转你的 UIStackView 并做你想做的事。
和水平
并排预览
我确实在顶部的文本字段上添加了一个 <= 0.1 等高乘数,但我不知道是否有必要。
尽情享受吧。