AnimatedField 2.4.4

AnimatedField 2.4.4

×

由 Alberto Aznar 维护。

AnimatedField 2.4.4

AnimatedField Logo

Version License Swift 5.0 Platform Twitter


将 AnimatedField 用作 iOS UITextField/UITextView 组件。您可以使用自定义的正则表达式来检查字段，或者使用按类型排序的默认正则表达式（如电子邮件、用户名、密码、URL、价格等）。还可以在用户输入时以动态方式检查字段。限制文本长度并根据您的需求格式化字段。用这些华丽的动画字段替换您旧的和无聊的文本字段和文本视图。您只需要遵循一些简单的步骤来实现它。AnimatedField 可自定义且易于使用。


AnimatedField

AnimatedField

  • 开始编辑字段时的精彩动画
  • 完全可自定义
  • 使用正则表达式检查和筛选
  • 限制文本长度
  • 易于使用
  • 支持 iOS，开发在 Swift 5 中

目录

安装

AnimatedField 通过 CocoaPods 提供。要安装它，只需将以下行添加到您的 Podfile，并运行 pod install

pod 'AnimatedField'

然后您可以在需要时导入它

import AnimatedField

使用说明

在示例中，您将看到一些可以用于项目中动效果的字段。安装此桩库后，请按照以下步骤操作。非常简单

在您的 xib / storyboard 中添加 UIView

在 xib 中添加运行的 UIView 以放置动效果字段。然后，您必须输入这个视图中的类名，您可以在界面构建器的身份检查器中更改它。记住在 (类 & 模块) 中都输入 AnimatedField

Screenshot 1

然后，在您的 UIViewController 中连接 IBOutlet

@IBOutlet weak var animatedField: AnimatedField!

格式

您可以使用自己的参数来格式化 AnimatedField。在所有字段中使用它以获取相同的外观。查看默认值

var format = AnimatedFieldFormat()

/// Title always visible
format.titleAlwaysVisible = false

/// Font for title label
format.titleFont = UIFont.systemFont(ofSize: 13, weight: .regular)
    
/// Font for text field
format.textFont = UIFont.systemFont(ofSize: 16, weight: .regular)
    
/// Font for counter
format.counterFont = UIFont.systemFont(ofSize: 13, weight: .regular)
    
/// Line color
format.lineColor = UIColor.lightGray
    
/// Title label text color
format.titleColor = UIColor.lightGray
    
/// TextField text color
format.textColor = UIColor.darkGray
    
/// Counter text color
format.counterColor = UIColor.darkGray
    
/// Enable alert
format.alertEnabled = true

/// Font for alert label    
format.alertFont = UIFont.systemFont(ofSize: 13, weight: .regular)

/// Alert status color
format.alertColor = UIColor.red
    
/// Colored alert field text
format.alertFieldActive = true
    
/// Colored alert line
format.alertLineActive = true
    
/// Colored alert title
format. alertTitleActive = true

/// Alert position
format.alertPosition = .top
    
/// Secure icon image (On status)
format.visibleOnImage = IconsLibrary.imageOfEye(color: .red)
    
/// Secure icon image (Off status)
format.visibleOffImage = IconsLibrary.imageOfEyeoff(color: .red)
    
/// Enable counter label
format.counterEnabled = false
    
/// Set count down if counter is enabled
format.countDown = false

/// Enable counter animation on change
format.counterAnimation = false
    
/// Highlight color when becomes active
format.highlightColor: UIColor? = UIColor(displayP3Red: 0, green: 139/255, blue: 96/255, alpha: 1.0)

/// Secure image (nil for default eye image)
format.secureImage: UIImage? = nil

最后，将格式分配给 AnimatedField 是很重要的

animatedField.format = format

其他字段属性

还有其他一些可以在实现中使用动效果字段的属性

/// Object that configure `AnimatedField` view. You can setup `AnimatedField` with
/// your own parameters. See also `AnimatedFieldFormat` implementation.
animatedField.format = AnimatedFieldFormat()

/// Field type (default values)
animatedField.type = AnimatedFieldType.none

/// Field text
animatedField.text = "" 

/// Placeholder
animatedField.placeholder = "" 

/// Attributed Placeholder
animatedField.attributedPlaceholder = NSAttributedString(string: "Placeholder", 
                                                         attributes:[.foregroundColor: UIColor.white])

/// Uppercased field format
animatedField.uppercased = false
    
/// Lowercased field format
animatedField.lowercased = false
    
/// Keyboard type
animatedFieldkeyboardType = UIKeyboardType.alphabet 
    
/// Secure field (dot format)
animatedField.isSecure = false
    
/// Show visible button to make field unsecure
animatedField.showVisibleButton = false

/// Result of regular expression validation
let isValid = animatedField.isValid

实现数据源和方法代理

第一个自定义此 AnimatedField 的方法是实现代理和数据源方法。这些方法处理最常见的用法。这两个都是可选的。

animatedField.dataSource = self
animatedField.delegate = self

数据源

用于为字段视图提供数据。数据源必须采用AnimatedFieldDataSource协议

// Returns boolean to check if field can be changed. This will override custom implementation.
func animatedField(_ animatedField: AnimatedField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool? 

// Returns boolean to check if field can return
func animatedFieldShouldReturn(_ animatedField: AnimatedField) -> Bool 

// Needed for limit characters when user fills the field. Returns characters limit
func animatedFieldLimit(_ animatedField: AnimatedField) -> Int?

// Needed for validation when user is filling the field. Returns regular expression to filter characters when user is typing
func animatedFieldTypingMatches(_ animatedField: AnimatedField) -> String? 

// Needed for validation when user ends editing field. Returns regular expression to filter field when user ends editing
func animatedFieldValidationMatches(_ animatedField: AnimatedField) -> String? 

// Returns alert message when validation fails
func animatedFieldValidationError(_ animatedField: AnimatedField) -> String?

// Returns alert message when price exceeded limits (only for price type)
func animatedFieldPriceExceededError(_ animatedField: AnimatedField) -> String?

代表者

为了在您的应用中添加更多功能，您必须实现AnimatedFieldDelegate 。负责管理选择行为以及与字段的交互。

// Called when text field begin editing 
func animatedFieldDidBeginEditing(_ animatedField: AnimatedField)

// Called when text field end editing
func animatedFieldDidEndEditing(_ animatedField: AnimatedField)

// Called when field (multiline) is resized
func animatedField(_ animatedField: AnimatedField, didResizeHeight height: CGFloat)

// Called when secure button is pressed. 
// Example: Use it if you like to secure/unsecure other field when this is secured/unsecured (like repeat password field)
func animatedField(_ animatedField: AnimatedField, didSecureText secure: Bool)

// Called when picker value is changed
func animatedField(_ animatedField: AnimatedField, didChangePickerValue value: String)

// Called when alert message is shown. 
// Example: If you have disabled alert messages in field and want to show other kind of message in other view. This will use your own alert messages if you implemented datasource method or default ones if you used default types.
func animatedField(_ animatedField: AnimatedField, didShowAlertMessage text: String)

// Called when text field changed
func animatedFieldDidChange(_ animatedField: AnimatedField)

额外

您还可以使用以下方法来重置字段、显示/隐藏警告和设置/取消安全字段。

// Restart field (empty field)
func restart()

// Show alert message
func showAlert(_ message: String?)

// Hide alert message
func hideAlert()

// Secure / unsecure field with dots (no visible)
func secureField(_ secure: Bool)

字段类型

电子邮件

此类型将显示.emailAddress键盘

AnimatedFieldType.email

正则表达式："[A-Z0-9a-z@_\.]"

验证正则表达式："[A-Z0-9a-z._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}"

用户名

在用户结束编辑时，用正则表达式验证的min和max限制来填充。

AnimatedFieldType.username(Int, Int)

正则表达式："[A-Za-z0-9_.]"

验证正则表达式："[A-Za-z0-9_.]{(min),(max)}"

密码

在用户结束编辑时，用正则表达式验证的min和max限制来填充。

AnimatedFieldType.password(Int, Int)

输入正则表达式: ".*"

验证正则表达式: ".{(min),(max)}"

价格

用最大价格和最大小数位数填充。首先，将限制结果数字。最大小数位数将限制小数位数。此类型将显示.decimalPad键盘。

AnimatedFieldType.price(Double, Int)

输入正则表达式: "[0-9(decimal)]"

验证正则表达式: "^(?=.*[1-9])([1-9]\d*(?:(decimal)\d{1,(max decimals)})?|(?:0(decimal)\d{1,(max decimals)}))$"

  • decimal取决于区域设置的小数分隔符

网址

此类型将显示.URL键盘。

AnimatedFieldType.url

输入正则表达式: ".*"

验证正则表达式: "https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]+\.[^\s]{2,}|www\.[a-zA-Z0-9]+\.[^\s]{2,}"

日期选择器

此类型将显示日期选择视图。用模式、默认日期、最小日期、最大日期、完成标签文本、日期格式（示例：“dd / MM / yyyy”）填充。

AnimatedFieldType.datepicker(UIDatePicker.Mode?, Date?, Date?, Date?, String?, String?)

输入正则表达式: ".*"

验证正则表达式: ".*"

数字选择器

此类型将显示数字选择器视图。用默认数字、最小数字、最大数字、完成标签文本填充。

AnimatedFieldType.numberpicker(Int, Int, Int, String?)

输入正则表达式: ".*"

验证正则表达式: ".*"

多行文本

此类型将使用多行文本，并在用户填写字段时动态调整大小。当用户完成新行时，将调用 didResizeHeight 方法，并传入更新后的字段高度。请使用这个功能来偏移您的滚动视图。

AnimatedFieldType.multiline

输入正则表达式: ".*"

验证正则表达式: ".*"

使用 AnimatedField 的应用

如果您使用 AnimatedField，我很乐意听到您的反馈并将您的应用展示在此处！

FashTime

Check In Event Manager

作者

Alberto Aznar, [email protected]

贡献

请随意与想法合作💭，问题⁉️以及/或者Pull请求🔃.

  1. 分支它！
  2. 创建您的功能分支: git checkout -b my-new-feature
  3. 提交您的更改: git commit -am 'Add some feature'
  4. 推送到分支: git push origin my-new-feature
  5. 提交Pull请求 :D

许可证

AnimatedField 在 MIT 许可证下可用。有关更多信息，请参阅 LICENSE 文件。

由@alberdev提供的库

AnimatedField Logo ContentLoader Logo CiaoTransitions Logo DateScrollPicker Logo EmptyStateKit Logo GridTimerView Logo PaintCodeKit Logo