CODEWITHSUNDEEP
iosswiftcore-animationblur
dnnagy
dnnagy

Reputation: 3533

iOS rounded, blurred textfield

I wonder, how can I create round blurred text input fields and blurred buttons in ios 8 or 9. Should I use Core animation or simply pngs drawn in ps? I never used Core Animation for UI, could you suggest a good tutorial/framework? Here's what I need to do : enter image description here

Upvotes: 0

Views: 1814

Answers (2)

Ali Jawad
Ali Jawad

Reputation: 151

Another way could be put a UIView under text field(text field not added inside that view), make corners rounded and alpha like 0.3 of UIView. Set Textfield background to clear colour. That will give you effect as you showed in image above.

Upvotes: 2

Chris Slowik
Chris Slowik

Reputation: 2879

You could make the text field background out of a UIVisualEffectView: https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIVisualEffectView/

You'll have to subclass UITextField and add your background view. Then set the layer to have rounded corners and it should clip.

Its worth noting that your design doesn't actually require blur. Your background is blurred already - your text field could just have a transparent white background and rounded corners. No blur necessary to reproduce the effect you have in your screenshot.

Upvotes: 3

Related Questions