Giter Club home page Giter Club logo

activecode's Introduction

Code Input View

Purpose

Create a code input view to validate when forgot password or activate to complete registration. Try it now.

Requirement

  • Dynamic number of character, maybe 6 or 8, maximum is 12.
  • Active the current character underline.
  • Auto active/validate when enter enough character.

Idea

  • Create a custom view named CharacterView to display a code character with underline.
  • Create an array of CharacterView with the number of character base on demand.
  • Calculate and decrease the font size, the distance between 2 views to make sure all characters will be displayed at the center of the screen.

How to use

  • Copy the CodeView.swift to your project

  • Use 1 of 3 ways:

    a. Change subclass on IB

    b. Add programmatically with init(frame)

    c. Add programmatically with init(frame:numberOfCharacter)

  • Change the number of character (default is 4)

      codeView.numberOfCharacter = 6
    
  • Change the code character (default is the character you typed)

      codeView.codeCharacter = "•"
    
  • Add validateCode method

      codeView.validateCode = { (code) in
                  let alert = UIAlertController(title: "Active Code", message: "Your code is \(code)", preferredStyle: .Alert)
                  let defaultAction = UIAlertAction(title: "OK", style: .Default, handler: nil)
                  alert.addAction(defaultAction)
                  self.presentViewController(alert, animated: true, completion: nil)
              }
    
  • You can change the underline color in struct Color in CodeView.swift

Improvement

  • The code doesn't work good on iPhone 6+, the font size is a little small.
  • The recursion code makes the performance down a lot.

activecode's People

Stargazers

 avatar  avatar

Forkers

mohd14shoeb

activecode's Issues

[Bug] - Error in code

It shows an error in this line: addValidateFunction(codeView1)
--> I think you should remove the number "1"

Missing Lable on top

Hi Ky,
I tried to test this one, but can not see the label. Can you check it?

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.