Computer Science Canada

How to make a slide to unlock screen?
Author:  DaBigOne [ Mon Jan 13, 2014 4:40 pm ]
Post subject:  How to make a slide to unlock screen?
What is it you are trying to achieve?
I?m trying to make a ?slide to unlock screen?, similar to what?s found on smartphones and tablets

What is the problem you are having?
I made the basic mechanics work, but I want to make sure the user has to drag the screen to unlock, not just click past the point where the loop exits.
Also, if they drag it to a certain distance, but not past the required distance, the text should flow back to where it was , instead of just snapping back instantly.
Describe what you have tried to solve this problem
I?ve tried putting a for loop in for the second problem, but to no avail.
I have no idea how to do the first.

Post any relevant code (You may choose to attach the file instead of posting the code if it is too long)

Turing:


var x, y, b : int
var font := Font.New ("arial:14")
setscreen ("offscreenonly")

loop
    mousewhere (x, y, b)
    cls
    if b = 1 then
        Font.Draw ("Slide to unlock", x + maxx div 2 - Font.Width ("Slide to unlock", font) div 2, 50, font, black)
    else
        Font.Draw ("Slide to unlock", maxx div 2 - Font.Width ("Slide to unlock", font) div 2, 50, font, black)
    end if
    View.Update
    exit when x > 500 and b = 1
end loop
put ?you unlocked the screen!?
%I don?t want the user to just click past 500 to unlock it. I want them to have to drag it past 500 for it to work.
%Also, when you drag it without reaching 500 and let go, I want to text to animate back with a delay, instead of just snapping back.


Please specify what version of Turing you are using
4.11
Author:  Raknarg [ Mon Jan 13, 2014 5:51 pm ]
Post subject:  RE:How to make a slide to unlock screen?
If x is past a certain point, then continue the program. Otherwise, check the button variable. If the button is being clicked, set x to the mouses x (like you are). However if the button is not being clicked, reduce x until it's back at the start.

EDIT: To compensate for the fact you want them to drag it, keep track of where they started clicking. If the position it is now is past where they started, then exit
Author:  DaBigOne [ Mon Jan 13, 2014 7:51 pm ]
Post subject:  RE:How to make a slide to unlock screen?
I tried what you said, but it didn?t work (the advice on reducing x).

I fixed the problem of dragging somewhat, by adding a timer, and making sure they have to hold it for at least 100 milliseconds.

I also tried saving the initial value of x to a new variable, but it keeps changing, and I have no idea how to stop this from happening.
Author:  Raknarg [ Mon Jan 13, 2014 9:02 pm ]
Post subject:  RE:How to make a slide to unlock screen?
The variable is changing because it keeps thinking that the user is pressing down again, and it resets. therefore, You need to keep track of whether this is the first time the user is pressing down the button, or if he's been holding it.

How did you implement the reduction of x?
Author:  DaBigOne [ Tue Jan 14, 2014 5:30 pm ]
Post subject:  Re: How to make a slide to unlock screen?
I found a new implementation of the snap back with the for loop, but I have no idea how to save one x coordinate when x keeps changing.
Here?s the code:

[syntax=?Turing?]

var x, y, b : int := 0
var font := Font.New ("arial:14")
setscreen ("offscreenonly")

loop
mousewhere (x, y, b)
cls
if b = 1 and x < 500 and x > 0 then
Font.Draw ("Slide to unlock", x, 50, font, black)
elsif b = 0 then
for decreasing i : x .. 258
cls
Font.Draw ("Slide to unlock", i, 50, font, black)
delay (1)
View.Update
end for
Font.Draw ("Slide to unlock", 258, 50, font, black)
end if
View.Update
exit when x > 575 and b = 1
end loop
put ?you unlocked the screen!?
[/syntax]
Author:  Raknarg [ Tue Jan 14, 2014 6:39 pm ]
Post subject:  RE:How to make a slide to unlock screen?
To save one x position, record it once and then don't overwrite it until you want it overwritten.
Author:  DaBigOne [ Sat Jan 18, 2014 11:48 am ]
Post subject:  RE:How to make a slide to unlock screen?
I think I solved the problem for making sure they drag it. But I still don?t know how to make the snap back.

var x, y, b : int
var font := Font.New ("arial:14")
setscreen ("offscreenonly")
var unlock : boolean := false

loop
mousewhere (x, y, b)
cls
Font.Draw ("Slide to unlock", maxx div 2 - Font.Width ("Slide to unlock", font) div 2, 50, font, black)
if b = 1 and (x>0 and x< 401) then
loop
mousewhere (x, y, b)
cls
Font.Draw ("Slide to unlock", x, 50, font, black)
View.Update
if b = 0 and (x > 400 and x < 641) then
unlock := true
exit
elsif b = 0 then
exit
end if
end loop
end if
if unlock then
exit
end if
View.Update

end loop
cls
put "you unlocked the screen!"
Author:  Raknarg [ Sat Jan 18, 2014 12:55 pm ]
Post subject:  RE:How to make a slide to unlock screen?
This is what I meant
Turing:

var x, y, b : int
var font := Font.New ("arial:14")
setscreen ("offscreenonly")
var unlock : boolean := false

%Make some kind of offset variable
var offsetx : int := 0

loop
    mousewhere (x, y, b)
    cls
    put offsetx
    % Add the offset to the font here.
    Font.Draw ("Slide to unlock", offsetx + maxx div 2 - Font.Width ("Slide to unlock", font) div 2, 50, font, black)
    if b = 1 and (x > 0 and x < 401) then
        loop
            mousewhere (x, y, b)
            % The offset is going to be the distance between where the mouse is now and where the slider started
            offsetx := x - (maxx div 2 - Font.Width ("Slide to unlock", font) div 2)
            cls
            Font.Draw ("Slide to unlock", x, 50, font, black)
            View.Update
            if b = 0 and (x > 400 and x < 641) then
                unlock := true
                exit
            elsif b = 0 then
                exit
            end if
        end loop
    end if
    %If we've stopped sliding the screen, then we need to change the offset back to 0 gradually
    if offsetx > 0 then
        offsetx -= 1
    elsif offsetx < 0 then
        offsetx += 1
    end if

    if unlock then
        exit
    end if
    View.Update
    %added a delay here to make the effect more gradual
    delay (5)
end loop
cls
put "you unlocked the screen!"

:


You can syndicate this boards posts using the file backend.php or view the topic map using sitemap.php.

Terms of Use | Privacy Policy