UITextField的收缩宽度基于另一个的增长

时间:2017-05-31 20:48:41

标签: ios user-interface cocoa-touch

我正在尝试根据另一个的宽度增加来修改UITextField的宽度。这是我布局的一个例子:

Layout with two text fields

在左侧框中(选择后包含int对话框代码)我想将其设置为边距0以开始并向右扩展右UITextField。当左框包含数据时,我想调整右侧文本字段的边框。

我知道如何在Android中轻松完成此操作,但我在Xcode中没有太多运气。有人能指出我正确的方向吗?

2 个答案:

答案 0 :(得分:1)

基本理念是

  1. 观察文字更改事件
  2. 重新计算宽度
  3. 更新宽度约束的constant属性
  4. 这是一个简单的演示,需要考虑更多边缘情况。

    demo

    - (void)viewDidLoad {
        UIView *container = [[UIView alloc] initWithFrame:CGRectMake(100, 150, 175, 100)];
        container.backgroundColor = [UIColor grayColor];
        [self.view addSubview:container];
    
        //initialize text fields
        UITextField *leftInput = [[UITextField alloc] initWithFrame:CGRectZero];
        leftInput.translatesAutoresizingMaskIntoConstraints = NO;
        [leftInput addTarget:self action:@selector(textDidChange:) forControlEvents:UIControlEventEditingChanged];
        [container addSubview:leftInput];
    
        UITextField *rightInput = [[UITextField alloc] initWithFrame:CGRectZero];
        rightInput.translatesAutoresizingMaskIntoConstraints = NO;
        [container addSubview:rightInput];
    
        //setup constraints
        NSDictionary *views = NSDictionaryOfVariableBindings(container, leftInput, rightInput);
        NSMutableArray *constraints = [NSMutableArray array];
        [constraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[leftInput]-[rightInput]-|" options:0 metrics:nil views:views]];
        [constraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[leftInput]-|" options:0 metrics:nil views:views]];
        [constraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[rightInput]-|" options:0 metrics:nil views:views]];
        NSLayoutConstraint *widthConstraint = [NSLayoutConstraint constraintWithItem:leftInput attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute:0 multiplier:0 constant:minWidth];
        [constraints addObject:widthConstraint];
        self.widthConstraint = widthConstraint;
        [NSLayoutConstraint activateConstraints:constraints];
    }
    
    - (void)textDidChange:(UITextField *)textInput {
        NSDictionary *attributes = @{NSFontAttributeName: textInput.font};
        CGFloat width = [textInput.text sizeWithAttributes:attributes].width;
        self.widthConstraint.constant = MAX(minWidth, width);
    }
    

答案 1 :(得分:0)

这是一种不使用常量的替代方法。我们的想法是设置自动布局,以便为您重新计算左侧文本字段的宽度,这样您只需在文本更改时更新布局。

首先,将左侧文本字段的拥抱优先级设置为高于右侧文本字段。确保安装了这些水平约束:

  1. 左侧文本字段的左边距到容器(或其他项目,只需修复左边距)
  2. 左侧文本字段的右边距应该与右侧文本字段的左边距有一个固定的水平间距(这是文本字段之间的间隙,标准是8px但当然使用您想要的内容)
  3. 右侧文本字段的右边距到容器的右侧或用于锚定右侧的任何内容
  4. 这会强制两个文本字段占据左右边距之间的某个给定空间,而autolayout必须决定哪个文本字段具有优先级。通过为左侧文本字段设置更高的拥抱优先级,您可以声明如果有可用空间,则首选扩展右侧文本字段,因此如果两个字段都为空,则右侧字段将占用整个空间。这就是为什么您需要设置大于或小于约束来限制文本字段可以获得的小/大的原因。

    现在,让我们假设我们从两个文本字段开始为空。此时,为左侧文本字段提供最小宽度将是明智的,否则它将具有0的宽度,因此将无法输入任何文本。最小大约50应该是合理的,以允许文本输入,但尝试看看什么对你有用。

    请记住在文本字段中捕获文本编辑已更改的属性,因此假设您在名为leftTextField的变量中包含文本字段,请调用

    [leftTextField addTarget:self action:@selector(leftTextChanged) forControlEvents:UIControlEventEditingChanged];
    

    在viewDidLoad或其他初始化方法中的某处。

    现在剩下的就是要求autolayout重新计算视图的内在大小并自行更新。这是通过调用layoutIfNeeded来完成的,因此您的方法看起来像

    - (void)leftTextChanged {
        [self.view layoutIfNeeded];
    }
    

    希望这有帮助。