Fit token without expanding field

[otymartin]

@tadejr
Hey, I have a use case where I only add one token in the field so I have no need for the field to expand. Except it does when the token text has a certain number of characters. in my case its only 13 characters and comes no were to filling the full width of the textField yet the tokenField still expands. How can I stop the tokenField from expanding?

[otymartin]

For now, I just commented out the code that updates the Intrinsic content height after it has been initially set which works fine.
Is there a more appropriate solution or is this it?

    func collectionView(_ collectionView: UICollectionView, layout: ResizingTokenFieldFlowLayout, heightDidChange newHeight: CGFloat) {
        guard didSetInitialHeight else {
            didSetInitialHeight = true
            intrinsicContentHeight = newHeight
            return
        }
                
//        delegate?.resizingTokenField(self, willChangeIntrinsicHeight: newHeight)
//        intrinsicContentHeight = newHeight
//        delegate?.resizingTokenField(self, didChangeIntrinsicHeight: newHeight)
    }

[tadejr]

Hey @otymartin, the token field grows as soon as a row runs out of space to display all items. These items can be:

• the label at the beginning
• multiple tokens
• the text field at the end

In your case it most likely expands as soon as the text field needs to move to a new row. Could you explain in more detail what behaviour you wish to achieve (are you using the label in the beginning and the text field to receive text input)? Or are you just displaying 1 token without ever changing it?

[otymartin]

@tadejr
Could you explain in more detail what behaviour you wish to achieve (are you using the label in the beginning and the text field to receive text input)? Or are you just displaying 1 token without ever changing it?

Im displaying max 1 token in the textField. The user can remove it and replace with another token but there will only every be max 1 token in the textField. My problem was that despite the fact that the token perfectly fit within the textfield with plenty of space left over, it was still expanding. I temporary solved it by commenting out the delegate callback that allows the textfield to expand.

I do use a label at the beginning "Receiver: Martin Otyeka" , its for a chat app. It perfectly fits but still expands the textfield which I don't want.

//        delegate?.resizingTokenField(self, willChangeIntrinsicHeight: newHeight)
//        intrinsicContentHeight = newHeight
//        delegate?.resizingTokenField(self, didChangeIntrinsicHeight: newHeight)

[tadejr]

Thanks for the info @otymartin! As mentioned, the token field grows because it always requires a minimum width at the end, which serves as the text input area. You can control it by setting the textFieldMinWidth property. Although in your case I suspect this won't do, since you never want the field to grow, which is not supported in the current version. I'm glad you found a way of making it work for you, but the solution is risky - the internal view still resizes, you only prevent the token field itself to grow, which can cause errors.

One more question to understand your use case better - do you use the text field part of the token field? Meaning users can type their own text in it, like in the example GIF? Or are you only using it to display the token (and the label)?

[otymartin]

@tadejr

Thanks for the indepth insight.

I only use the textfield to show the label and the token. Just some context, its for a chat app. So a user selects from a list of friends who's names have a max character count of 17 (strictly forced). So In theory I should never need the textfield to grow. Users can type in the textfield but only as a way to filter friends (their search query never turns into a token itself.