草庐IT

ios - 使用自动布局设置动态 UIView 以匹配容器 View

coder 2023-07-24 原文

我在 IB 中有一个 UIView，其中有另一个 UIView，我将其用作容器 View 。在代码中，我创建了三个不同的 View ，然后根据应用程序的状态将适当的 View 动画化到容器的 View 中。在任何给定时间，这三种不同观点中只有一种是有效的。问题是，当我在模拟器中的不同 iPhone 上运行时，我的新 subview 没有缩放以匹配容器 View 。我正在使用自动布局。出于测试目的，我将我的 subview 设置为一个大按钮，它的所有边缘都限制在 super View 中。并且容器 View 也有它的边缘限制到它的 super View 。我想要的是 subview 与容器的 View 相匹配。即按钮拉伸(stretch)容器 View 的整个大小。当在不同的 iPhone 上运行时，容器 View 的大小和 subview 应该相对于不同 iPhone 的屏幕尺寸按比例缩放。

下面是我用来初始化我的 subview 并设置它相对于容器 View 的约束的代码。

UIView *containerView = self.subView;
UIView *newSubview = [[mySubview alloc] init];
[newSubview setTranslatesAutoresizingMaskIntoConstraints:NO];
[self.containerView addSubview:newSubview];

[self.containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.containerView attribute:NSLayoutAttributeTop multiplier:1.0 constant:0]];

[self.containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.containerView attribute:NSLayoutAttributeLeading multiplier:1.0 constant:0]];

[self.containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:self.containerView attribute:NSLayoutAttributeWidth multiplier:1.0 constant:0]];

[self.containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:self.containerView attribute:NSLayoutAttributeHeight multiplier:1.0 constant:0]];

我似乎无法让它发挥作用。我对自动布局还很陌生，不确定我做错了什么，我不想再把头撞在墙上了。任何帮助都会很棒。 :)

************* 附加信息 **************

抱歉，我没有尽可能清楚地说明我的问题。因此，这里有更多关于屏幕截图的信息。首先，我将描述我在代码方面所做的事情。

在 AppDelegate.m 的 didFinishLaunchingWithOptions 中，我像这样创建 MyViewController，
self.myViewController = [[MyViewController alloc] initWithNibName:@"MyViewController" bundle:nil];

在 MyViewController.m 的 viewDidLoad 中，我创建了 mySubview 并将其添加到我的 containerView 并像这样为其创建约束，
UIView *containerView = self.containerView;
UIView *mySubview = [[MySubview alloc] init];
[mySubview setTranslatesAutoresizingMaskIntoConstraints:NO];
[containerView addSubview:mySubview];

NSDictionary *views = NSDictionaryOfVariableBindings(mySubview);
[containerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[mySubview]|"
                                                                 options:0
                                                                 metrics:nil
                                                                   views:views]];
[containerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[mySubview]|"
                                                                  options:0
                                                                  metrics:nil
                                                                    views:views]];

最后在 MySubview.h 的 init 中，我将 Nib 添加为这样的 subview ，
- (id)init
{
    if(self = [super init])
    {
        NSArray *nibArray = [[NSBundle mainBundle]loadNibNamed:@"MySubview" owner:self options:nil];
        [self addSubview:[nibArray objectAtIndex:0]];
    }
    return self;
}

需要注意的几件事可能会有所帮助，

在 MyViewController.xib 中，我有一个 UIView 用作 containerView。它有一个到 UIView* containerView 的 IBOutlet，是上面提到的那个。我对 IB 中的 containerView 的唯一限制是 Superview 的前导、尾随和底部空间以及 Superview = 44 的顶部空间。

对于 MySubview.xib，高度和宽度为 300，(高度或宽度没有使用约束)。我觉得这些尺寸应该无关紧要，因为 mySubview 应该受限于 containerView。

在 MySubview.xib 我有 3 个对象，topButton:height = 29、middleView:height = 242 和 bottomButton:height = 29。(见附图) TopButton 具有前导、尾随和顶部到 Superview 约束和底部到 middleView 约束。 MiddleView 具有前导和尾随 Superview 约束以及从上到上按钮约束和从下到下按钮约束。最后，bottomButton 具有到 Superview 约束的前导、尾随和底部以及从顶部到 middleView 的约束。

我想要发生的是让 mySubview 缩放以适应 containerView，因为已经创建并添加了约束，但是相反，mySubview 变得非常大并剪辑了 containerView。

以下是一些屏幕截图:

MyViewController.xib，标题下方的蓝色矩形是我的容器 View ，并且有 IBOutlet containerView。



我的 subview .xib



最后，结果是不正确的。



相反，我想要这个，我伪造它只是为了获取屏幕截图。

在 iPhone 4 上，



在 iPhone 5 上，



正如您在假屏幕截图中看到的那样，mySubview 会缩放以适应 containerView，即使 containerView 会稍微缩放以适应不同的手机屏幕尺寸。

希望我没有过度使用这些信息。任何帮助都会很棒。我觉得我很接近，但肯定错过了一个关键步骤。呸呸呸。

最佳答案

几个想法:

  • 这基本上看起来不错，除了一些变量名怪异:你的局部变量，containerView等于 self.subView ，但所有其他行都引用了一个不同的变量，一个类属性，self.containerView .您是否省略了设置 containerView 的行类(Class)属性(property)？但是当我解决这个问题时，你的代码对我来说很好。
  • 确保您没有试图查看 frame设置约束后立即，因为更改尚未反射(reflect)在 frame设置。你可以做一个[containerView layoutIfNeeded];如果您想强制它根据约束重新布局所有内容。另外，如果你想确认frame设置，最好推迟到 viewDidAppear 之后再查看这些值(即 viewDidLoad 在 View 构建过程中为时过早)。
  • 对您的代码稍作调整(与您的问题无关)，但是当我在容器 View 中设置约束时，我通常不仅会设置 NSLayoutAttributeTop和 NSLayoutAttributeLeading ，就像你做的那样，而且NSLayoutAttributeBottom和 NSLayoutAttributeTrailing (而不是 NSLayoutAttributeWidth 和 NSLayoutAttributeHeight )。它完成与您的代码相同的事情，但是当使用非零值时，它更直观。

    无论如何，我只是做了以下代码，你的排列，它工作正常:
    - (IBAction)didTouchUpInsideAddView:(id)sender
{
    UIView *containerView = self.containerView;
    UIView *newSubview = [[UIView alloc] initWithFrame:CGRectZero]; // initializing with CGRectZero so we can see it change
    newSubview.translatesAutoresizingMaskIntoConstraints = NO;
    newSubview.backgroundColor = [UIColor lightGrayColor];
    [containerView addSubview:newSubview];

    [containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview
                                                              attribute:NSLayoutAttributeTop
                                                              relatedBy:NSLayoutRelationEqual
                                                                 toItem:containerView
                                                              attribute:NSLayoutAttributeTop
                                                             multiplier:1.0
                                                               constant:0.0]];

    [containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview
                                                              attribute:NSLayoutAttributeLeading
                                                              relatedBy:NSLayoutRelationEqual
                                                                 toItem:containerView
                                                              attribute:NSLayoutAttributeLeading
                                                             multiplier:1.0
                                                               constant:0.0]];

    [containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview
                                                              attribute:NSLayoutAttributeBottom
                                                              relatedBy:NSLayoutRelationEqual
                                                                 toItem:containerView
                                                              attribute:NSLayoutAttributeBottom
                                                             multiplier:1.0
                                                               constant:0.0]];

    [containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview
                                                              attribute:NSLayoutAttributeTrailing
                                                              relatedBy:NSLayoutRelationEqual
                                                                 toItem:containerView
                                                              attribute:NSLayoutAttributeTrailing
                                                             multiplier:1.0
                                                               constant:0.0]];

    // the frame is still `CGRectZero` at this point

    NSLog(@"newSubview.frame before = %@", NSStringFromCGRect(newSubview.frame));

    // if not doing this in `viewDidLoad` (e.g. you're doing this in
    // `viewDidAppear` or later), you can force `layoutIfNeeded` if you want
    // to look at `frame` values. Generally you don't need to do this unless
    // manually inspecting `frame` values or when changing constraints in a
    // `animations` block of `animateWithDuration`.

    [containerView layoutIfNeeded];

    // everything is ok here

    NSLog(@"containerView.bounds after = %@", NSStringFromCGRect(containerView.bounds));
    NSLog(@"newSubview.frame after = %@", NSStringFromCGRect(newSubview.frame));
}
  • 您可以使用 visual format language 稍微简化该代码。 ，例如:
    NSDictionary *views = NSDictionaryOfVariableBindings(newSubview);

[containerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[newSubview]|"
                                                                      options:0
                                                                      metrics:nil
                                                                        views:views]];
[containerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[newSubview]|"
                                                                      options:0
                                                                      metrics:nil
                                                                        views:views]];

    我发现使用视觉格式语言更容易获得正确的约束。不太容易出错(至少对我来说)。但是，有些约束无法用视觉格式语言表示，在这种情况下，我会回到您概述的语法。
  • 在您修改后的问题中，您向我们展示了 init subview 的方法，它执行另一个 addSubview .你也必须在那里设置约束。底线，无论你在哪里 addSubview ，你必须设置你的约束，例如
    - (id)init
{
    if(self = [super init])
    {
        NSArray *nibArray = [[NSBundle mainBundle]loadNibNamed:@"MySubview" owner:self options:nil];
        UIView *subview = [nibArray objectAtIndex:0];
        subview.translatesAutoresizingMaskIntoConstraints = NO;

        [self addSubview:subview];

        NSDictionary *views = NSDictionaryOfVariableBindings(subview);
        [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[subview]|"
                                                                     options:0
                                                                     metrics:nil
                                                                       views:views]];
        [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[subview]|"
                                                                     options:0
                                                                     metrics:nil
                                                                       views:views]];
    }
    return self;
}

    • 关于ios - 使用自动布局设置动态 UIView 以匹配容器 View ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16157665/

    容器UIViewcontainerViewcodenewSubviewiosautolayoutresize

    有关ios - 使用自动布局设置动态 UIView 以匹配容器 View的更多相关文章

    1. ruby - 如何使用 Nokogiri 的 xpath 和 at_xpath 方法 - 2

      我正在学习如何使用Nokogiri，根据这段代码我遇到了一些问题:require'rubygems'require'mechanize'post_agent=WWW::Mechanize.newpost_page=post_agent.get('http://www.vbulletin.org/forum/showthread.php?t=230708')puts"\nabsolutepathwithtbodygivesnil"putspost_page.parser.xpath('/html/body/div/div/div/div/div/table/tbody/tr/td/div

    2. ruby - 使用 RubyZip 生成 ZIP 文件时设置压缩级别 - 2

      我有一个Ruby程序，它使用rubyzip压缩XML文件的目录树。gem。我的问题是文件开始变得很重，我想提高压缩级别，因为压缩时间不是问题。我在rubyzipdocumentation中找不到一种为创建的ZIP文件指定压缩级别的方法。有人知道如何更改此设置吗？是否有另一个允许指定压缩级别的Ruby库？ 最佳答案 这是我通过查看ruby​​zip内部创建的代码。level=Zlib::BEST_COMPRESSIONZip::ZipOutputStream.open(zip_file)do|zip|Dir.glob("**/*")d

    3. ruby - 为什么我可以在 Ruby 中使用 Object#send 访问私有(private)/ protected 方法？ - 2

      类classAprivatedeffooputs:fooendpublicdefbarputs:barendprivatedefzimputs:zimendprotecteddefdibputs:dibendendA的实例a=A.new测试a.foorescueputs:faila.barrescueputs:faila.zimrescueputs:faila.dibrescueputs:faila.gazrescueputs:fail测试输出failbarfailfailfail.发送测试[:foo,:bar,:zim,:dib,:gaz].each{|m|a.send(m)resc

    4. ruby-on-rails - 使用 Ruby on Rails 进行自动化测试 - 最佳实践 - 2

      很好奇，就使用ruby​​onrails自动化单元测试而言，你们正在做什么？您是否创建了一个脚本来在cron中运行rake作业并将结果邮寄给您？git中的预提交Hook？只是手动调用？我完全理解测试，但想知道在错误发生之前捕获错误的最佳实践是什么。让我们理所当然地认为测试本身是完美无缺的，并且可以正常工作。下一步是什么以确保他们在正确的时间将可能有害的结果传达给您？ 最佳答案 不确定您到底想听什么，但是有几个级别的自动代码库控制:在处理某项功能时，您可以使用类似autotest的内容获得关于哪些有效，哪些无效的即时反馈。要确保您的提

    5. ruby - 在 Ruby 中使用匿名模块 - 2

      假设我做了一个模块如下:m=Module.newdoclassCendend三个问题:除了对m的引用之外，还有什么方法可以访问C和m中的其他内容？我可以在创建匿名模块后为其命名吗(就像我输入“module...”一样)？如何在使用完匿名模块后将其删除，使其定义的常量不再存在？ 最佳答案 三个答案:是的，使用ObjectSpace.此代码使c引用你的类(class)C不引用m:c=nilObjectSpace.each_object{|obj|c=objif(Class===objandobj.name=~/::C$/)}当然这取决于

    6. ruby - 使用 ruby​​ 和 savon 的 SOAP 服务 - 2

      我正在尝试使用ruby​​和Savon来使用网络服务。测试服务为http://www.webservicex.net/WS/WSDetails.aspx?WSID=9&CATID=2require'rubygems'require'savon'client=Savon::Client.new"http://www.webservicex.net/stockquote.asmx?WSDL"client.get_quotedo|soap|soap.body={:symbol=>"AAPL"}end返回SOAP异常。检查soap信封，在我看来soap请求没有正确的命名空间。任何人都可以建议我

    7. python - 如何使用 Ruby 或 Python 创建一系列高音调和低音调的蜂鸣声？ - 2

      关闭。这个问题是opinion-based.它目前不接受答案。想要改进这个问题？更新问题，以便editingthispost可以用事实和引用来回答它.关闭4年前。Improvethisquestion我想在固定时间创建一系列低音和高音调的哔哔声。例如:在150毫秒时发出高音调的蜂鸣声在151毫秒时发出低音调的蜂鸣声200毫秒时发出低音调的蜂鸣声250毫秒的高音调蜂鸣声有没有办法在Ruby或Python中做到这一点？我真的不在乎输出编码是什么(.wav、.mp3、.ogg等等)，但我确实想创建一个输出文件。

    8. ruby-on-rails - 'compass watch' 是如何工作的/它是如何与 rails 一起使用的 - 2

      我在我的项目目录中完成了compasscreate.和compassinitrails。几个问题:我已将我的.sass文件放在public/stylesheets中。这是放置它们的正确位置吗？当我运行compasswatch时，它不会自动编译这些.sass文件。我必须手动指定文件:compasswatchpublic/stylesheets/myfile.sass等。如何让它自动运行？文件ie.css、print.css和screen.css已放在stylesheets/compiled。如何在编译后不让它们重新出现的情况下删除它们？我自己编译的.sass文件编译成compiled/t

    9. ruby - 使用 ruby​​ 将 HTML 转换为纯文本并维护结构/格式 - 2

      我想将html转换为纯文本。不过，我不想只删除标签，我想智能地保留尽可能多的格式。为插入换行符标签，检测段落并格式化它们等。输入非常简单，通常是格式良好的html(不是整个文档，只是一堆内容，通常没有anchor或图像)。我可以将几个正则表达式放在一起，让我达到80%，但我认为可能有一些现有的解决方案更智能。 最佳答案 首先，不要尝试为此使用正则表达式。很有可能你会想出一个脆弱/脆弱的解决方案，它会随着HTML的变化而崩溃，或者很难管理和维护。您可以使用Nokogiri快速解析HTML并提取文本:require'nokogiri'h

    10. ruby - 在 64 位 Snow Leopard 上使用 rvm、postgres 9.0、ruby 1.9.2-p136 安装 pg gem 时出现问题 - 2

      我想为Heroku构建一个Rails3应用程序。他们使用Postgres作为他们的数据库，所以我通过MacPorts安装了postgres9.0。现在我需要一个postgresgem并且共识是出于性能原因你想要pggem。但是我对我得到的错误感到非常困惑当我尝试在rvm下通过geminstall安装pg时。我已经非常明确地指定了所有postgres目录的位置可以找到但仍然无法完成安装:$envARCHFLAGS='-archx86_64'geminstallpg--\--with-pg-config=/opt/local/var/db/postgresql90/defaultdb/po

    随机推荐