Hiding Specific Views When SearchBar Text Did Change

Viewed 17

As newbie, I finally got a case project for internship. Before jump in directly to code, I would like to ask about a logic.

here how it is look like

As you can as see, I have a search bar in the top, and under that a page view and under that a collectionview. So I will display to first 3 data in pageview and rest of it will be displayed in collectionView. Whenever user start typing in searchbar, PageView must disappear and collectionview must go all the way to the top. (under searchbar) And collectionview must display the filtered data. Once user delete all text from search bar, everything should be like in the beginning and pageview must be in the same page before user typed in searchbar. (If it was in the 2. page, it must be in the 2.page after its displayed again)

Problem is with hiding pageview when searchbar is used. My idea is the create ui programmaticly and once textDidChange func of searchBar runs, hide pageView and change constraints of collectionview programmatically. Once text is nil, make pageview visible again and change constraints again.

Is this logic useful? Is there any better way to do it?

1 Answers

Your approach seems correct to me, that's how I'd do it as well.

To add an extra touch, you can also animate the layout constraints changes (by calling layoutIfNeeded in the animation block, look up "animate constraints" on StackOverflow).

And for a perfect user experience, make those animations reversible by using UIViewPropertyAnimator so that if the user typed a letter and then quickly erased it during the animation it would just reverse in the middle. It's a somewhat advanced technique but you'll gain a great deal of experience with animations by implementing it. Watch Advanced Animations with UIKit from WWDC17 for more details.

Related