最新消息:20190717 VPS服务器:Vultr新加坡,WordPress主题:大前端D8,统一介绍入口:关于

[已解决]swift中实现文本输入框:点击后占位符文字向上移动字体变小

iOS crifan 1142浏览 0评论

需要实现这样的文本输入框:

swift textfield placeholder click move up

objective c – PlaceHolder animates when start typing in TextField in iOS – Stack Overflow

iphone – Text in UITextField moves up after editing (center while editing) – Stack Overflow

UITextView Placeholder Text in Swift (IBDesignable in IB) | iOS Insight

iwasrobbed/RPFloatingPlaceholders: UITextField and UITextView subclasses with placeholders that change into floating labels when the fields are populated with text.

jverdi/JVFloatLabeledTextField: UITextField subclass with floating labels – inspired by Matt D. Smith’s design: http://dribbble.com/shots/1254439–GIF-Mobile-Form-Interaction?list=users

ArtSabintsev/UIFloatLabelTextField: A subclassed UITextField that follows the Float Label UI design pattern.

FahimF/FloatLabelFields: Text entry controls which contain a built-in title/label so that you don’t have to add a separate title for each field.

swift textfield lib

hackiftekhar/IQKeyboardManager: Codeless drop-in universal library allows to prevent issues of keyboard sliding up and cover UITextField/UITextView. Neither need to write any code nor any setup required and much more.

去试试:

raulriera/TextFieldEffects: Custom UITextFields effects inspired by Codrops, built using Swift

Cartfile中添加:

github "raulriera/TextFieldEffects"

再去更新:

carthage update TextFieldEffects –platform iOS

即:

licrifandeMacBook-Pro:SalesAppiOS crifan$ carthage update TextFieldEffects –platform iOS

*** Cloning TextFieldEffects

*** Fetching MGSwipeTableCell

*** Fetching SwiftHEXColors

*** Fetching Charts

*** Fetching SwiftKeychainWrapper

*** Fetching Alamofire

*** Fetching XCGLogger

*** Fetching realm-cocoa

*** Fetching Cartography

*** Checking out TextFieldEffects at "1.2.0"

*** xcodebuild output can be found in /var/folders/46/2hjxz38n22n3ypp_5f6_p__00000gn/T/carthage-xcodebuild.mhr3in.log

*** Building scheme "TextFieldEffects" in TextFieldEffects.xcodeproj

代码:

var phoneTextField:HoshiTextField

self.phoneTextField = HoshiTextField()

        self.addSubview(self.phoneTextField)

        //3. phone number textFiled

        self.phoneTextField.placeholder = "手机号"

//        self.phoneTextField.foregroundColor = UIColor.lightGrayColor()

        //self.phoneTextField.borderActiveColor = UIColor.blueColor()

        self.phoneTextField.keyboardType = UIKeyboardType.PhonePad

        constrain(phoneTextField) {phoneTextField in

            //phoneTextField.top == phoneTextField.superview!.top + (LoginLogoImageHeigh + SwitchActionHeight + 10)

            phoneTextField.top == phoneTextField.superview!.top + LoginPhonePaddingTop

            phoneTextField.centerX == phoneTextField.superview!.centerX

            phoneTextField.width == phoneTextField.superview!.width – 2 * LoginPaddingX

            phoneTextField.height == LoginTextFieldHeight

        }

效果:

点击后:

-》但是没有底下的颜色。。。

-》折腾了半天,发现

库中用的是:

TextFieldEffects/HoshiTextField.swift at master · raulriera/TextFieldEffects

@IBInspectable dynamic public var borderActiveColor: UIColor? {

        didSet {

            updateBorder()

        }

    }

暴露出的接口是:

/**

An HoshiTextField is a subclass of the TextFieldEffects object, is a control that displays an UITextField with a customizable visual effect around the lower edge of the control.

*/

@IBDesignable public class HoshiTextField : TextFieldEffects.TextFieldEffects {

    /**

     The color of the border when it has no content.

     This property applies a color to the lower edge of the control. The default value for this property is a clear color.

     */

    @IBInspectable dynamic public var borderInactiveColor: UIColor?

    /**

     The color of the border when it has content.

     This property applies a color to the lower edge of the control. The default value for this property is a clear color.

     */

    @IBInspectable dynamic public var borderActiveColor: UIColor?

但是却没有办法通过:

        self.phoneTextField.borderActiveColor = UIColor.blueColor()

去设置变量。

-》后来发现是自己之前写成:

var phoneTextField:UITextField

后来改为:

var phoneTextField:HoshiTextField

就可以正常设置值了:

        self.phoneTextField.placeholder = "手机号"

        self.phoneTextField.borderInactiveColor = UIColor.grayColor()

        self.phoneTextField.borderActiveColor = UIColor.grayColor()

然后就可以了:

转载请注明:在路上 » [已解决]swift中实现文本输入框:点击后占位符文字向上移动字体变小

发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
60 queries in 0.113 seconds, using 18.85MB memory