B4A Class [B4X] [XUI] AS PinLock

First, i spend a lot of time in creating views, some views i need by my self, but some views not and to create a high quality view cost a lot of time. If you want to support me, then you can do it here by Paypal.

This Class is optimized for B4A and B4I, but not for B4J.

This is the First Version, if you have bugs, then ask in the comments.

This is a Lock View, to secure private user data in the app, the user must enter a code to get ahead.

You can encrypt the input with the following methods

• MD5
• SHA-1
• SHA-224
• SHA-256
• SHA-384
• SHA-512
• NONE (the output is 12345678 for example without encryption)

You can set a Salt value to the Hash.
And so it works:
1 + Salt Optional = Hash
2 + Salt Optional = Hash
3 + Salt Optional = Hash
4 + Salt Optional = Hash

Hash1 + Hash2 + Hash3 + Hash4 + Salt = Final Hash
The Final Hash you must save and then you can compare the hash with the user input.

Features

• you can use your own Layout on the Header (header.LoadLayout("tst.bal"))
• background and textcolor color is customizable
• the Fingerprint icon is just a placeholder for your own function like a Fingerprint or a questionmark for help
• MD5,SHA-1,SHA-224,SHA-256,SHA-384 and SHA-512 to encrypt the input
• responsive design, you can rotate the smartphone and it still looks cool
• 4 or 8 input length
• more...

Author: Alexander Stolte
Version: 1.2

• ASPinLocker
  • Events:
    • BaseResize
    • CustomKeyClick
    • PinReady (Value As String)
  • Fields:
    • xpnl_key_0 As B4XView
    • xpnl_key_1 As B4XView
    • xpnl_key_2 As B4XView
    • xpnl_key_3 As B4XView
    • xpnl_key_4 As B4XView
    • xpnl_key_5 As B4XView
    • xpnl_key_6 As B4XView
    • xpnl_key_7 As B4XView
    • xpnl_key_8 As B4XView
    • xpnl_key_9 As B4XView
    • xpnl_key_delete As B4XView
    • xpnl_key_fingerprint As B4XView
  • Functions:
    • Class_Globals As String
    • ClearInput As String
      Reset the input
    • Deny As String
      Set the Color of Labels in the Code Area to the Deny Color, to show the user that the input was wrong
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • getCodeBackgroundColor As Int
    • getCodeLength As Int
      Get or Set the Code Length (4 or 8)
    • getCodeTextColor As Int
      Get or Set the Code Color (Description Text Color and Code Circels Color)
    • getDenyColor As Int
      Get or Set the Deny Color (Description Text Color and Code Circels Color)
    • getDescription As String
      Get or Sets the Description Text (Enter access code)
    • getDescriptionColor As Int
      Get or Sets the Description Color (Enter access code)
    • getemMD5 As String
    • getemNONE As String
    • getemSHA1 As String
    • getemSHA224 As String
    • getemSHA256 As String
    • getemSHA384 As String
    • getemSHA512 As String
    • getEncryptMethod As String
      Get or Set the Encryption Method Valid: MD5 SHA-1 SHA-224 SHA-256 SHA-384 SHA-512 NONE
    • getHeaderColor As Int
      Get or Sets the Header Background Color
    • getHeaderPanel As B4XView
      Get the Header Panel, to load your own Layout
    • getKeyboardBackgroundColor As Int
    • getKeyboardClickColor As Int
      Get or Set the Keyboard Click Color
    • getKeyboardExtraButtonBackgroundColor As Int
    • getKeyboardSeperatorColor As Int
    • getKeyboardTextColor As Int
    • getSalt As String
      Get or Set the Salt Value to Secure your User Input more
    • getShowKeyboardSeperator As Boolean
    • getSuccessColor As Int
      Get or Set the Success Color (Description Text Color and Code Circels Color)
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • setCodeBackgroundColor (color As Int) As String
    • setCodeLength (Length As Int) As String
      Get or Set the Code Length (4 or 8)
    • setCodeTextColor (Color As Int) As String
      Get or Set the Code Color (Description Text Color and Code Circels Color)
    • setDenyColor (Color As Int) As String
      Get or Set the Deny Color (Description Text Color and Code Circels Color)
    • setDescription (text As String) As String
      Get or Sets the Description Text (Enter access code)
    • setDescriptionColor (Color As Int) As String
      Get or Sets the Description Color (Enter access code)
    • setEncryptMethod (Method As String) As String
      Get or Set the Encryption Method Valid: MD5 SHA-1 SHA-224 SHA-256 SHA-384 SHA-512 NONE
    • setHeaderColor (Color As Int) As String
      Get or Sets the Header Background Color
    • setKeyboardBackgroundColor (color As Int) As String
    • setKeyboardClickColor (Color As Int) As String
      Get or Set the Keyboard Click Color
    • setKeyboardExtraButtonBackgroundColor (color As Int) As String
    • setKeyboardSeperatorColor (color As Int) As String
    • setKeyboardTextColor (color As Int) As String
    • setSalt (Salt As String) As String
      Get or Set the Salt Value to Secure your User Input more
    • setShowKeyboardSeperator (show As Boolean) As String
    • setSuccessColor (Color As Int) As String
      Get or Set the Success Color (Description Text Color and Code Circels Color)
    • Success As String
      Set the Color of Labels in the Code Area to the Success Color, to show the user that the input was right
  • Properties:
    • CodeBackgroundColor As Int
    • CodeLength As Int
      Get or Set the Code Length (4 or 8)
    • CodeTextColor As Int
      Get or Set the Code Color (Description Text Color and Code Circels Color)
    • DenyColor As Int
      Get or Set the Deny Color (Description Text Color and Code Circels Color)
    • Description As String
      Get or Sets the Description Text (Enter access code)
    • DescriptionColor As Int
      Get or Sets the Description Color (Enter access code)
    • emMD5 As String [read only]
    • emNONE As String [read only]
    • emSHA1 As String [read only]
    • emSHA224 As String [read only]
    • emSHA256 As String [read only]
    • emSHA384 As String [read only]
    • emSHA512 As String [read only]
    • EncryptMethod As String
      Get or Set the Encryption Method Valid: MD5 SHA-1 SHA-224 SHA-256 SHA-384 SHA-512 NONE
    • HeaderColor As Int
      Get or Sets the Header Background Color
    • HeaderPanel As B4XView [read only]
      Get the Header Panel, to load your own Layout
    • KeyboardBackgroundColor As Int
    • KeyboardClickColor As Int
      Get or Set the Keyboard Click Color
    • KeyboardExtraButtonBackgroundColor As Int
    • KeyboardSeperatorColor As Int
    • KeyboardTextColor As Int
    • Salt As String
      Get or Set the Salt Value to Secure your User Input more
    • ShowKeyboardSeperator As Boolean
    • SuccessColor As Int
      Get or Set the Success Color (Description Text Color and Code Circels Color)

Change log:
- V1.1

• Add Custom Key Click (Fingerprint Key)
• Add Clear Input to reset the user input
• Add Explanations on the Subs

-V1.2

• Removes unused variable
• Fix Bug the setDescription property was not showing
• Add CodeColor Property
• Add KeyboardBackgroundColor Porperty
• Add KeyboardTextColor Poperty
• Add KeyboardExtraButtonBackgroundColor
• Remove Seperator Bug with the new seperators
• Add New Designer-Property ShowKeyboardSeperator set to true to show seperators on the numberfields
• Add New Designer-Property KeyboardSeperatorColor set the seperator color for the numberfields
• Add EncryptMethods as return values

If you like my work, then spend me a coffe or two

 

[itgirl]

Wow looks amazing thanks

 

[T201016]

A really interesting presentation.
Could you please explain by example
encryption of input data, e.g. SHA-512 - would it allow me to better understand the intention of the method?

 

[Alexander Stolte]

It encrypt the output.

NONE (the output is 12345678 for example without encryption)

 

[T201016]

Hi,
Testing your refined code example (ASPinLocker)
I came across a little oversight in the ASPinLocker class module - (see: Private Sub key_deleteone_Click)

Well, in my opinion, the last line in the procedure "key_deleteone_Click"
should contain an examination of the current position, which you do not have in the original

Code before the change: current_pos = current_pos -1
After the change: If current_pos> 0 Then current_pos = current_pos -1

I mean that after repeatedly clicking the BACK button
you must then double-click the keyboard (0-9) to enter the first digit.

I am waiting for further development of ASPinLocker e.g., an interesting solution to the matter of remembering the access code to the memory card.
Regards.

Private Sub key_deleteone_Click
  
    Dim tmp_xlbl As B4XView = Sender
    CreateHaloEffect(tmp_xlbl.Parent,tmp_xlbl.Width/2,tmp_xlbl.Height/2,keyboard_click_color)
  
    If current_pos = 4 Then
        hashed_value_4 = ""
        xlbl_pin_4.Text = Chr(0xF10C)
      
        If code_length = 4 Then
          
            SetCodeTextColor(code_text_color)
          
        End If
      
    else If current_pos = 3 Then
        hashed_value_3 = ""
        xlbl_pin_3.Text = Chr(0xF10C)
      
    else If current_pos = 2 Then
        hashed_value_2 = ""
        xlbl_pin_2.Text = Chr(0xF10C)
      
    else If current_pos = 1 Then
        hashed_value_1 = ""
        xlbl_pin_1.Text = Chr(0xF10C)
      
    else If current_pos = 5 Then
        hashed_value_5 = ""
        xlbl_pin_5.Text = Chr(0xF10C)
      
    else If current_pos = 6 Then
        hashed_value_6 = ""
        xlbl_pin_6.Text = Chr(0xF10C)
      
    else If current_pos = 7 Then
        hashed_value_7 = ""
        xlbl_pin_7.Text = Chr(0xF10C)
      
    else If current_pos = 8 Then
        hashed_value_8 = ""
        xlbl_pin_8.Text = Chr(0xF10C)
        If code_length = 8 Then
          
            SetCodeTextColor(code_text_color)
          
        End If
    End If
  
    If current_pos > 0 Then current_pos = current_pos -1    <------ my suggested change on the line.
  
End Sub

 

[wimpie3]

Would it be a good idea to expand this library and make a 2-in-1 combination with the fingerprint scanner? When a fingerprint is set, use that one to get access to your app, and when it's not set, use the PIN input entry?

 

[Alexander Stolte]

Would it be a good idea to expand this library and make a 2-in-1 combination with the fingerprint scanner? When a fingerprint is set, use that one to get access to your app, and when it's not set, use the PIN input entry?

Thats not the task of this view. Add this view to your project and add your own logic.

 

[asales]

As I don't uses the fingerprint key, how I change the icon to a question mark?
I tried to set the visible of the key = false, but it removes the border and looks strange.
Thanks.

 

[jahswant]

@Alexander Stolte the view behave in weird manner in B4J. when pin is set to a small place holder is viside and it doesn't respond to numbers click !

 

[Alexander Stolte]

the view behave in weird manner in B4J. when pin is set to a small place holder is viside and it doesn't respond to numbers click !

This Class is optimized for B4A and B4I, but not for B4J.