Git Product home page Git Product logo

searchtextfield's Introduction

SearchTextField

CI Status Version License Platform

Overview

SearchTextField is a subclass of UITextField, written in Swift that makes really easy the ability to show an autocomplete suggestions list.
You can decide wether to show the list as soon as the field is focused or when the user starts typing.
You can also detects when the user stops typing, very useful when you can get a suggestion list from a remote server.

New Feature! Now you can make suggestions "inline", showing the first matched result as the placeholder (instead of the results list) and selecting it when the user touches the enter key.


alt_tag

Requirements

  • iOS 8

Installation

SearchTextField is available through CocoaPods. To install it, simply add the following line to your Podfile:

use_frameworks!

pod "SearchTextField"

Manual installation

Just import SearchTextField.swift into your project

Usage

You can use it in the simplest way...

import SearchTextField

// Connect your IBOutlet...
@IBOutlet weak var mySearchTextField: SearchTextField!

// ...or create it manually
let mySearchTextField = SearchTextField(frame: CGRectMake(10, 100, 200, 40))

// Set the array of strings you want to suggest
mySearchTextField.filterStrings(["Red", "Blue", "Yellow"])

...or you can customize it as you want

// Show also a subtitle and an image for each suggestion:

let item1 = SearchTextFieldItem(title: "Blue", subtitle: "Color", image: UIImage(named: "icon_blue"))
let item2 = SearchTextFieldItem(title: "Red", subtitle: "Color", image: UIImage(named: "icon_red"))
let item3 = SearchTextFieldItem(title: "Yellow", subtitle: "Color", image: UIImage(named: "icon_yellow"))
mySearchTextField.filterItems([item1, item2, item3])

// Set a visual theme (SearchTextFieldTheme). By default it's the light theme
mySearchTextField.theme = SearchTextFieldTheme.darkTheme()

// Modify current theme properties
mySearchTextField.theme.font = UIFont.systemFontOfSize(12)
mySearchTextField.theme.bgColor = UIColor (red: 0.9, green: 0.9, blue: 0.9, alpha: 0.3)
mySearchTextField.theme.borderColor = UIColor (red: 0.9, green: 0.9, blue: 0.9, alpha: 1)
mySearchTextField.theme.placeholderColor = UIColor.gray
mySearchTextField.theme.separatorColor = UIColor (red: 0.9, green: 0.9, blue: 0.9, alpha: 0.5)
mySearchTextField.theme.cellHeight = 50

// Set specific comparision options - Default: .caseInsensitive
mySearchTextField.comparisonOptions = [.caseInsensitive]

// Set the max number of results. By default it's not limited
mySearchTextField.maxNumberOfResults = 5

// You can also limit the max height of the results list
mySearchTextField.maxResultsListHeight = 200

// Customize the way it highlights the search string. By default it bolds the string
mySearchTextField.highlightAttributes = [NSBackgroundColorAttributeName: UIColor.yellowColor(), NSFontAttributeName:UIFont.boldSystemFontOfSize(12)]

// Handle what happens when the user picks an item. By default the title is set to the text field
mySearchTextField.itemSelectionHandler = { filteredResults, itemPosition in
    // Just in case you need the item position
    let item = filteredResults[itemPosition]
    
    mySearchTextField.text = item.title
}


// Start visible, showing the list of results without typing. By default it's disabled
countryTextField.startVisible = true


/** 
* Update data source when the user stops typing. 
* It's useful when you want to retrieve results from a remote server while typing 
* (but only when the user stops doing it)
**/
mySearchTextField.userStoppedTypingHandler = {
    if let criteria = self.mySearchTextField.text {
        if criteria.characters.count > 1 {

        // Show the loading indicator
        self.mySearchTextField.showLoadingIndicator()

        self.searchMoreItemsInBackground(criteria) { results in
            // Set new items to filter
            self.acronymTextField.filterItems(results)

            // Hide loading indicator
            self.mySearchTextField.stopLoadingIndicator()
        }
    }
}

New feature: show the first matched result as placeholder (inline mode)

// Set the array of strings you want to suggest
mySearchTextField.filterStrings(["gmail.com", "yahoo.com", "yahoo.com.ar"])

// Then set the inline mode in true
mySearchTextField.inlineMode = true

// Start suggesting only after some string is detected
mySearchTextField.startFilteringAfter = "@"

// Start suggesting inmediately just after the string is detected 
mySearchTextField.startSuggestingInmediately = true

New feature: pass custom object to SearchTextFieldItem

public init(title: String, subtitle: String?, image: UIImage?, userInfo:[String:Any]?)

Swift Versions

Install v1.0.0 if you need to support Swift 2.3.

Install v1.0.2 and above if you want to support Swift 3.

Demo

Check out the Example project.

Author

Alejandro Pasccon, [email protected]

License

SearchTextField is available under the MIT license. See the LICENSE file for more info.

searchtextfield's People

Contributors

apasccon avatar albeva avatar artem-kalmykov avatar chrismhinsch avatar jujuforce avatar resand avatar bryant1410 avatar radvansky-tomas avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.