{"id":2930,"url":"https://github.com/jverdi/JVFloatLabeledTextField","last_synced_at":"2025-08-03T12:31:43.763Z","repository":{"id":10930760,"uuid":"13234786","full_name":"jverdi/JVFloatLabeledTextField","owner":"jverdi","description":"UITextField subclass with floating labels - inspired by Matt D. Smith's design: http://dribbble.com/shots/1254439--GIF-Mobile-Form-Interaction?list=users","archived":false,"fork":false,"pushed_at":"2023-04-17T14:38:05.000Z","size":401,"stargazers_count":7196,"open_issues_count":28,"forks_count":732,"subscribers_count":183,"default_branch":"main","last_synced_at":"2024-10-29T11:22:25.721Z","etag":null,"topics":["carthage","floating-labels","forms","objective-c","pod","ui-components","uikit"],"latest_commit_sha":null,"homepage":null,"language":"Objective-C","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/jverdi.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2013-10-01T04:31:03.000Z","updated_at":"2024-10-28T01:18:30.000Z","dependencies_parsed_at":"2022-07-21T04:49:34.297Z","dependency_job_id":"9f8af435-556e-41f9-a3ad-7f76163aac89","html_url":"https://github.com/jverdi/JVFloatLabeledTextField","commit_stats":{"total_commits":209,"total_committers":62,"mean_commits":3.370967741935484,"dds":0.5023923444976077,"last_synced_commit":"301f9f08fb99c747b50e9e4f098488a039d61cec"},"previous_names":[],"tags_count":22,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jverdi%2FJVFloatLabeledTextField","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jverdi%2FJVFloatLabeledTextField/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jverdi%2FJVFloatLabeledTextField/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jverdi%2FJVFloatLabeledTextField/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jverdi","download_url":"https://codeload.github.com/jverdi/JVFloatLabeledTextField/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":228543197,"owners_count":17934444,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["carthage","floating-labels","forms","objective-c","pod","ui-components","uikit"],"created_at":"2024-01-05T20:16:26.622Z","updated_at":"2024-12-07T00:31:06.542Z","avatar_url":"https://github.com/jverdi.png","language":"Objective-C","readme":"JVFloatLabeledTextField\n=======================\n[![Build Status](https://travis-ci.org/jverdi/JVFloatLabeledTextField.svg?branch=master)](https://travis-ci.org/jverdi/JVFloatLabeledTextField)\n[![Carthage compatible](https://img.shields.io/badge/Carthage-compatible-4BC51D.svg?style=flat)](#carthage)\n[![Pod Version](https://img.shields.io/cocoapods/v/JVFloatLabeledTextField.svg)](http://cocoadocs.org/docsets/JVFloatLabeledTextField/)\n[![Pod Platform](https://img.shields.io/cocoapods/p/JVFloatLabeledTextField.svg)](http://cocoadocs.org/docsets/JVFloatLabeledTextField/)\n[![Pod License](https://img.shields.io/cocoapods/l/JVFloatLabeledTextField.svg)](http://jaredverdi.mit-license.org)\n[![CocoaPods](https://img.shields.io/cocoapods/dt/JVFloatLabeledTextField.svg)](https://github.com/jverdi/JVFloatLabeledTextField)\n\n`JVFloatLabeledTextField` is the first implementation of a UX pattern that has come to be known the **\"Float Label Pattern\"**. \n\nDue to space constraints on mobile devices, it is common to rely solely on placeholders as a means to label fields.\nThis presents a UX problem, in that, once the user begins to fill out a form, no labels are present.\n\nThis UI component library, which includes both a `UITextField` and `UITextView` subclass, aims to improve the user experience by having placeholders transition into floating labels that hover above the fields after they are populated with text.\n\nCredits for the concept to Matt D. Smith ([@mds](https://twitter.com/mds)), and his [original design](https://dribbble.com/shots/1254439--GIF-Mobile-Form-Interaction?list=users):\n\n![Matt D. Smith's Design](http://dribbble.s3.amazonaws.com/users/6410/screenshots/1254439/form-animation-_gif_.gif)\n\n\nThe component is officially supported for iOS 9 and greater.\n\n\nGetting started via CocoaPods\n=============================\n```\nsudo gem install cocoapods\n```\n\nCreate a ```Podfile``` in your project directory:\n```\npod init\n```\n\nAdd the following to your ```Podfile``` project's target:\n```\npod 'JVFloatLabeledTextField'\n```\n\nThen run CocoaPods with ```pod install```.\n\nFinally, include ```JVFloatLabeledTextField.h``` and ```JVFloatLabeledTextView.h``` in your project.\n\n\nGetting started via Carthage\n============================\n```\nbrew update\nbrew install carthage\n```\n\nCreate a ```Cartfile``` in your project directory that contains:\n```\ngithub \"jverdi/JVFloatLabeledTextField\"\n```\n\nThen run carthage with ```carthage update``` and add ```JVFloatLabeledText.framework``` to your project from the ```Carthage/Build/iOS``` directory.\n\nFinally, include ```JVFloatLabeledText.h``` in your project:\n```\n#import \u003cJVFloatLabeledText/JVFloatLabeledText.h\u003e\n```\n\nGetting started via SPM (Xcode 11+)\n============================\n\nClick `File` -\u003e `Swift Packages` -\u003e `Add Package Dependency`, enter [JVFloatLabeledText repo's URL](https://github.com/jverdi/JVFloatLabeledTextField).\n\nAfter select the package, you can choose the dependency type (tagged version, branch or commit). Then Xcode will setup all the stuff for you.\n\nIf you're a framework author and use JVFloatLabeledTextField as a dependency, update your `Package.swift` file:\n\n```swift\nlet package = Package(\n    dependencies: [\n        .package(url: \"https://github.com/jverdi/JVFloatLabeledTextField\", from: \"1.2.2\")\n    ],\n)\n```\n\nAdditional References\n=======================\n[How the Float Label Pattern Started](http://mds.is/float-label-pattern/) - Matt D. Smith  \n[Float Label Pattern](http://bradfrost.com/blog/post/float-label-pattern/) - Brad Frost  \n[Material Design - Floating Labels](http://www.google.com/design/spec/components/text-fields.html#text-fields-floating-labels) - Google  \n\nPorts and Alternate Implementations\n=====================================\n[Android](https://github.com/wrapp/floatlabelededittext) - Henrik Sandström  \n[Android](https://github.com/weddingparty/AndroidFloatLabel) - Kaushik Gopal  \n[Android](https://github.com/KevinJ90825/FloatLabelPattern) - Kevin Johnson  \n[Xamarin.iOS](https://github.com/gshackles/FloatLabeledEntry) - Greg Shackles  \n[Xamarin.Android](https://github.com/Johan-dutoit/JVFloatSharp) - Johan du Toit  \n[CSS](http://snook.ca/archives/html_and_css/floated-label-pattern-css) Jonathan Snook  \n[JQuery / Zepto.js](https://github.com/maman/JVFloat.js) - Achmad Mahardi  \n[JQuery](https://github.com/m10l/FloatLabel.js) - Mike Mitchell  \n[AngularJS](https://github.com/dmackerman/angular-better-placeholders) - Dave Ackerman  \n[Bootstrap plugin](https://github.com/fauxparse/bootstrap-floating-labels) - Matt Powell  \n[JavaFX](https://github.com/andytill/floaty-field) - Andy Till  \n[Swift](https://github.com/dirkfabisch/B68FloatingLabelTextField) - Dirk Fabisch  \n[Swift](https://github.com/FahimF/FloatLabelFields) - Fahim Farook  \n[Swift](https://github.com/kNeerajPro/CGFLoatingUIKit) - Neeraj Kumar  \n[Swift](https://github.com/varshylmobile/VMFloatLabel) - Jimmy Jose  \n[Swift](https://github.com/Skyscanner/SkyFloatingLabelTextField) - Skyscanner (Daniel Langh, Gergely Orosz, Raimon Lapuente)  \n[ObjC](https://github.com/ArtSabintsev/UIFloatLabelTextField) - Arthur Ariel Sabintsev  \n[ObjC](https://github.com/iwasrobbed/RPFloatingPlaceholders) - Rob Phillips  \n[4D](http://forums.4d.fr/Post/EN/15995553/0/0/) - Maurice Inzirillo  \n[Appcelerator Titanium](https://github.com/TheSmiths-Widgets/ts.floatlabelfield) - The Smiths  \n[B4i](https://www.b4x.com/android/forum/threads/floatlabelededittext-iui8.64096/#post-405516) - Erel Uziel  \n  \n  \nAdded a port? Let me know - [@jverdi](https://twitter.com/jverdi)\n","funding_links":[],"categories":["UI","Material","Objective-C","**Index**","Objective-C  Stars 1000以内排名整理","iOS"],"sub_categories":["TextField \u0026 TextView","Recently I've done a few projects that involve Payments, iBeacons, and PassKit. Make sure to check these links out:","Layout","Other free courses","JVFloatLabeledTextField"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjverdi%2FJVFloatLabeledTextField","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjverdi%2FJVFloatLabeledTextField","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjverdi%2FJVFloatLabeledTextField/lists"}