Skip to content

How It Works

Ismael Shakverdiev edited this page Mar 15, 2022 · 1 revision

Field Suggestion was designed to be simple, controllable and fast. That's why it has quite simple architecture, there are few required options which brings us abilities to generate matchers and build widget.

Here is the basic structure diagram

 ╭───────╮      ╭─────────────╮                                                  
 │ Input │╮    ╭│ Suggestions │                                                  
 ╰───────╯│    │╰─────────────╯                                                  
          │    │               
          │  Element         
          │    │              ╭──────────╮                                       
          ▼    ▼          ╭──▶│ Matchers │─╮                                     
    ╭──────────────────╮  │   ╰──────────╯ │  ╭──────────────╮                   
    │ Search Algorithm │──╯                ╰─▶│ Item Builder │                   
    ╰──────────────────╯                      ╰──────────────╯                   
                                                ...

Required values are:

  • Input (comes from the field's text editing controller)
  • Suggestions (uses N index element)
  • Search Algorithm (the way of generating matchers)
  • Item Builder (builds matcher's widget representation)

Widget listens text editing controller to take input in each text inserting.
After taking input, it loops through the suggestions and executes the defined search function. (So, it passes the CURRENT input and N indexed CURRENT suggestion, to the search function).
By doing that we fill matchers list, which'd be passed to item builder(which that builds matcher equivalent widgets).

Let's modify diagram appropriate to explanation

 ╭───────╮      ╭─────────────╮                                                  
 │ Input │╮    ╭│ Suggestions │                                                  
 ╰───────╯│    │╰─────────────╯                                                  
          │    │
          │    │               Generated by                                      
          │  Element         search algorithm                                    
          │    │              ╭──────────╮                                       
          ▼    ▼          ╭──▶│ Matchers │─╮                                     
    ╭──────────────────╮  │   ╰──────────╯ │  ╭──────────────╮                   
    │ Search Algorithm │──╯                ╰─▶│ Item Builder │                   
    ╰──────────────────╯                      ╰──────────────╯                   
     Passes input and suggestion's             ... Passes context and            
     element to search function.               index of "matcher in suggestions".
     So, as a result matchers                  suggestion item widget.           
     fill be filled appropriate                                                  
     to algorithm