Skip to content

Commit

Permalink
[Chips] Update MDCChipField to move long text from a line with chips …
Browse files Browse the repository at this point in the history
…to a new line. (material-components#9826)

Call layoutSubviews on textChanged to reposition MDCChipField's textField if:

1. The textField is on the same line as chips and becomes too long to fit
1. The textField is on the line below chips but can fit on the line with chips

Fixes #9006 

Before:
![before 2020-03-03 15_08_50](https://user-images.githubusercontent.com/581764/75815310-2e680000-5d61-11ea-8623-62719a0d0f3a.gif)

After:
![after 2020-03-03 15_10_39](https://user-images.githubusercontent.com/581764/75815323-3031c380-5d61-11ea-8468-69b70d4921ab.gif)
  • Loading branch information
bryanoltman authored Mar 3, 2020
1 parent 04567ba commit 8b7c2b6
Showing 1 changed file with 17 additions and 0 deletions.
17 changes: 17 additions & 0 deletions components/Chips/src/MDCChipField.m
Original file line number Diff line number Diff line change
Expand Up @@ -615,6 +615,21 @@ - (BOOL)textFieldShouldReturn:(UITextField *)textField {
- (void)textFieldDidChange {
[self deselectAllChips];
[self createNewChipWithTextField:self.textField delimiter:MDCChipFieldDelimiterSpace];
CGRect lastChipFrame = self.chips.lastObject.frame;
if (!CGRectIsEmpty(lastChipFrame)) {
BOOL isTextTooWide = [self textInputDesiredWidth] >= [self availableWidthForTextInput];
BOOL isTextFieldOnSameLineAsChips =
CGRectGetMidY(self.textField.frame) == CGRectGetMidY(lastChipFrame);
if (isTextTooWide && isTextFieldOnSameLineAsChips) {
// The text is on the same line as the chips and doesn't fit
// Trigger layout to move the text field down to the next line
[self setNeedsLayout];
} else if (!isTextTooWide && !isTextFieldOnSameLineAsChips) {
// The text is on the line below the chips but can fit on the same line
// Trigger layout to move the text field up to the previous line
[self setNeedsLayout];
}
}

if ([self.delegate respondsToSelector:@selector(chipField:didChangeInput:)]) {
[self.delegate chipField:self didChangeInput:[self.textField.text copy]];
Expand Down Expand Up @@ -740,6 +755,8 @@ - (CGFloat)availableWidthForTextInput {
}

// The width of the text input + the clear button.
// Used to determine whether the text field can fit on a line with chips or whether it gets its
// own line.
- (CGFloat)textInputDesiredWidth {
UIFont *font = self.textField.placeholderLabel.font;
CGRect placeholderDesiredRect = [self.textField.text
Expand Down

0 comments on commit 8b7c2b6

Please sign in to comment.