JavaFX Pattern Lock Demo("Unofficial")

This is a project that i decided to do while traveling to Mombasa on a train ,that's almost a day of coding.At first i didn't have any idea what to code and i thought of creating an Android lock pattern in javafx.


It wasn't easy as i thought ,the circular nodes are two circles in a Stackpane (KeyPads) with Shadow effect,the line its a Polyline.MouseEvents are onMouseMoved and onMouseClicked this where i tried working with MouseDragEvents but couldn't make it work.still researching .

Adding the keypads,the KeyPad class constructor has the x and y layout and keypad name.

 int k=0;

          for(int x=40;x<200;x+=60){
            for(int y=40;y<200;y+=60){
                KeyPad key_pad=new KeyPad(x,y,"c"+k);
                key_pad.addListener(line);
                key_pad_panel.getChildren().addAll(key_pad);
                k++;
            }
        }

The keypads are Children of  the StackPane and the StackPane is a Child of  an AnchorPane,every keypad has a name/key set by calling setUserData();i.e keypad.setUserData("c0");

To check if the pattern is a match i add getUserData().toString() in an ObservableList  onMouseMoved which will add too much points,but in the correct order.To work around this i created a List of distinct keys in the right order

  List<String> pattern=new ArrayList<>();
  pattern=password.stream().distinct().collect(toList());

If invalid pattern the AnchorPane move upwards 10px and back to its initial position with use of the TranslateTransition giving it a bounce like effect.


Download the src here


Video Demo









Comments

Popular Posts