键入时自动拉伸 UITextField

Question

我有一个以编程方式创建的 UITextField。我想在开头和结尾有不可编辑的前缀字符，比如

"Hello [TextField] world".

首先，我尝试手动添加字符并使用 shouldChangeCharactersInRange make 但这种方法不起作用，因为如果用户长按 TextField 并开始，他可以编辑第一个字符（所以可以弄乱前缀字符）。这个选项好像不太方便。

另一个选项可能是创建一个空 UITextField 和 2 个静态 UILabels（对于 "Hello" 和 "world"）。在这里，另一个问题出现了。由于我的 UITextField 的文本是居中对齐的（并且在视图中垂直居中），我给它一个视图的宽度和 0 的 x 轴（所以 textField 触及视图的左右边缘） .相反，如果我在创建时尝试为 TextField 提供固定宽度，则用户输入时宽度不会 expand/stretch。

我想要实现的是 TextField 的起始宽度从 0 开始，并且在每一侧都有静态的 UILabels，例如 "hello "[textField]" world"；当用户输入时，increasing/stretching textField 的左右宽度（因为它是文本居中对齐）。随着 textField 的宽度伸展，将 UILabel 推向边缘。所以：

|          ["Hello "][textField][" world"]         |

|    ["Hello "][MyTextFieldTextIsNice][" world"]   |

在不使用故事板和编程实例化 UITextField 和 UILabel 的情况下实现它的正确方法是什么？如何在用户输入时创建自动调整大小的 textField，将 UILabel 推到两侧？

Answer 1

这是可以做到的，但需要一些工作。您需要处理 UITextFieldDelegate 并使用宽度约束。按照大纲即可实现。

您的控制器应采用 UITextFieldDelegate 并使用此方法检查用户在 UITextField 中输入的字符串的长度：

(BOOL)textField:(UITextField *)textFieldshouldChangeCharactersInRange:(NSRange)range replacementString:(NSString *)string
根据字符串的长度动态调整UITextField上的宽度约束。
如果您还像这样为两侧的其他标签设置约束，它应该会按您预期的方式运行。 @"[Label][UITextField][Label]".
您还可以在 UITextField 上设置约束，使其与其父视图的 CenterX 对齐。

检查输入的文本字段，如下所示：

-(BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString *)string
{
    // This is the string the user entered. Get the string and use string metrics
    // to figure out how long the string will be based on font and 
    // font size and adjust the width constraint on the UITextField
    // accordingly.
    return YES;
 }

Answer 2

我不相信您可以将文本添加到不可编辑的文本字段，但您可以做的是自动检查输入的文本并在前面添加 "Hello" 并附加 "world"。

您首先必须检查输入的文本。你可以这样做：

var charArray: [Character] = []

for character in textField.characters {
charArray.append(character) }

这会给你一个字符数组。然后你可以检查第一个字符是否仍然是 "Hello " 以及最后一个字符是否仍然是 "world":

func checkInputStartsHello() -> Bool {

guard charArray[0] == "H" else { return false }
guard charArray[1] == "e" else { return false }
guard charArray[2] == "l" else { return false }
guard charArray[3] == "l" else { return false }
guard charArray[4] == "o" else { return false }
guard charArray[5] == " " else { return false }

return true
}

func checkInputEndsWorld() -> Bool {

guard charArray[charArray.count - 1] == "d" else { return false }
guard charArray[charArray.count - 2] == "l" else { return false }
guard charArray[charArray.count - 3] == "r" else { return false }
guard charArray[charArray.count - 4] == "o" else { return false }
guard charArray[charArray.count - 5] == "w" else { return false }
guard charArray[charArray.count - 6] == " " else { return false }

return true
}

然后添加"Hello "和“world”如果这些是错误的：

if !checkInputStartsHello() { textField.text = "Hello " + textField.text }
if !checkInputEndsWorld() { textField.text = textField.text + " world" }

确保每次输入文本时更新 charArray 并重新检查 textField.text。

此代码的结果将是一个文本字段，它会在用户单击键盘上的 'done' 后立即自动显示您输入的开头和结尾。

Answer 3

你应该使用 leftview 和 righttview 的文本框。例如，

 UIView *paddingView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 10, 40)]; 

 // create one label and add it to padding view and then set that padding as left view   

datePickerField.leftView = paddingView;  //here datepicker field is my textfield
datePickerField.leftViewMode = UITextFieldViewModeAlways;

右视图同样可以。

根据需要的框架创建标签和填充视图，然后将该标签添加到填充视图并将该填充视图设置为文本字段的 leftview 或 rightview。

因此，它会随着文本字段的变化自动改变它们的位置和大小。

希望这会有所帮助:)

Answer 4

我用的就是这种情况，用Storyboard，UITextField两边用UILabel居中对齐

下面是storyboard的截图。

然后我正在做 UITextField 的委托并使用以下代码。

-(BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString *)string
{

    NSString *strForWholeString = [NSString stringWithFormat:@"%@%@",textField.text,string];

    CGSize fontSize = [strForWholeString sizeWithAttributes:
                       @{NSFontAttributeName:
                             [UIFont fontWithName:@"Helvetica" size:14]}];



    if (self.textfieldLayoutWidthConstraint.constant >= 40) {
        self.textfieldLayoutWidthConstraint.constant = fontSize.width + 40 ;
        [self.view layoutIfNeeded];
        [self.view setNeedsUpdateConstraints];
    }

    return YES;
}

Swift代码

func textField(textField: UITextField!, shouldChangeCharactersInRange range: NSRange, replacementString string: String!) -> Bool {

        let strForWholeString = NSString(format:"%@%@", textField.text!,string) as String

        let fontSize: CGSize = strForWholeString.sizeWithAttributes([NSFontAttributeName: UIFont.systemFontOfSize(14.0)])

        if self.textfieldLayoutWidthConstraint?.constant >= 40 {
            self.textfieldLayoutWidthConstraint!.constant = fontSize.width + 40 ;
            self.view.layoutIfNeeded();
            self.view.setNeedsUpdateConstraints();
        }
        return true
    }

希望这对你有帮助。

You can download the sample code from here - Objective c

You can download the sample code from here - Swift

输出

键入时自动拉伸 UITextField

Auto-Stretching UITextField on typing

uitextfield

uilabel

ios

autolayout

swift