如何使用 ios 中的约束使视图位置动态化?

Posted

技术标签:

【中文标题】如何使用 ios 中的约束使视图位置动态化?【英文标题】:how to make position of view dynamic using constrants in ios? 【发布时间】:2016-02-15 05:35:26 【问题描述】:

我正在开发一个显示图像视图的应用程序。图像上有一些红点是 UIButton。当用户点击按钮时,图像应该缩放。为此我添加了具有如下约束的滚动视图

在滚动视图中我有图像视图

现在,当我的屏幕尺寸发生变化时,图像尺寸也会发生变化。我添加了一个 UIButton 作为红点。我已经给它设置了水平和垂直线的约束。

现在,当设备尺寸发生变化时,图像上的按钮位置也会发生变化。 即使图像大小增加,我想要的按钮位置在所有设备上也应该相同。请告诉我我该怎么做。

【问题讨论】:

【参考方案1】: 在 UIImage 视图顶部添加按钮 然后通过从按钮拖动到图像来添加约束。 首先对 UIImageView 和顶部的前导空间设置两个约束 UIImageView 的空间是常数或标准,具体取决于你 需要。

它看起来像你的代码.. button.top = image.top button.leading = image.leading

添加这两个约束就可以了。

如果您想固定按钮的大小,您需要添加 hieght 和 宽度限制。 我会附上一张关于它的样子的图片

这里的天气图标是图像,我在按钮上设置约束 (去除尾随和底部的约束)

根据图片放置按钮

    将图像设置为已知尺寸,例如 100 x 100 然后将按钮放在需要的位置。 现在检查从图像顶部到按钮的距离。 前任。如果是 12,那么你的比例将是 12:100 现在将常量 (button.top) 设置为 12。 所以现在如果高度变为 200 乘以比率 即image.height* 12/100 在给定的例子中constant = 200(new image hieght) *(12/100)(ratio) = 24 所以button.top = 24的新距离

【讨论】:

我想保持按钮修复的位置。我的意思是,如果图像中云上的红点,那么它应该在每台设备上它不应该移动的云上 哦,所以你的图像在滚动视图中正确吗??所以你只需要将按钮拖放到 uiimage 上。然后将鼠标指针从按钮拖动到uiimage。你会得到选项。我将为此编辑我的答案。 是的。但问题是如果图像尺寸增加,那么图像上红点按钮的位置会发生变化。比如说,如果红点图像在一台设备上的云上,那么它在那个位置上的位置是相同的另一台设备 哦,那么您必须以编程方式设置约束。看看你的图像比例是多少。根据比率,您可以为约束设置常量值....为此采用参考图像分辨率并检查按钮位置值是什么....并根据您的图像大小增加或减少多少来调整按钮相应地 好的。我知道这是我认为可以通过使用其他一些方法使这个过程更容易的解决方案。然后我必须以编程方式为每个设备设置不同的约束。【参考方案2】:

像视图一样,您可以将约束拖放到 viewController.m 文件中:

@property (weak, nonatomic) IBOutlet NSLayoutConstraint *myLayoutConstraint;

您可以在哪里以编程方式操作:

[UIView animateWithDuration:1.0 animations:^
    self.myLayoutConstraint.constant = 10;
 completion:^(BOOL finished) 
    //handle completion
];

【讨论】:

以上是关于如何使用 ios 中的约束使视图位置动态化?的主要内容,如果未能解决你的问题,请参考以下文章

如何在 iOS 应用中使滚动视图高度动态化?

如何使视图修复屏幕IOS 8?

如何在约束布局 1.0 中使视图居中

如何根据swift 4或5中的图像大小使图像视图高度和宽度(纵横比)动态? [关闭]

如何使自动布局约束依赖于多个其他锚?

xcode ios - 如何使图像适合不同的屏幕尺寸