Implementing Magnifier tool Quesition?

talis · July 2012

Hi everyone,
I want to implement a magnification tool on touch of the screen and move it as your finger moves on screen. When the user will raise the finger the magnifying will be removed from screen.

Actually i want to implement this feature in Flippageview.Lua (Page Curl Effect)
I tried somethings but when i move my finger far edge of the corner my magnifying tool is out of borders:)

Maybe i am doind it totaly wrong. Do you have any idea to direct me ? Maybe different approach etc..

In FlipPageView.Lua i added a new Function test(x,y)

function FlipPageView:test(x,y)
--Create the shape object
self:addChild(myMask)
 
local texture = Texture.new(self.imgPath[self.page2])
print("x")
print(x)
--myMask:setPosition(84,144)
print("y")
print(y)
myMask:clear()
myMask:setFillStyle(Shape.TEXTURE, texture)
myMask:beginPath()
myMask:moveTo(x,y)
myMask:lineTo(x+50,y+50)
myMask:lineTo(x+50,y-50)
myMask:lineTo(x-50,y-50)
myMask:closePath()
myMask:endPath()
 
myMask:setScale(1.5,1.5)
--myMask:setPosition(84,y-100)
end

And in on mouse move(event) a added an else part when the page is not flipping

function FlipPageView:onMouseMove(event)
    if self.flip and not self.isFlipping then
        local dx = event.x - self.oldX
        local dy = event.y - self.oldY
        self.xTouch = self.xTouch - dx
        self.yTouch = self.yTouch - dy
        self:roll()
        self.oldX = event.x
        self.oldY = event.y
    else
--Here i am calling my test function
        self:test(event.x,event.y)
	end
end

talis · July 2012

How I want to use it:
1-There will be a magnifying glass icon in the right upper corner of screen.
2-In order to use magnifying user should activate it on clicking the icon.
3-In the beginning of app. magnifying flag will be set to false.
4-In my function i will check if the user activated magnifying property or not. If yes it will work with the move of the finger on screen if not nothing will happen.
5-Magnification will follow your finger movement just some pixels below so the user can see it. (Hey i have so much big fingers:D)
6-When the user will move his/her finger close to edge of screen the magnification view must change location so it can be still seen.

techdojo · July 2012

It's an interesting problem, I can't answer all of your questions but here's how I would do the magnifying glass given the current Gideros limitations.

Assuming that the background you want to magnify is a single image, then you could create a shape with a textured fill and a transformation matrix to specify your UV texture coordinates (I think the soup ninja example implements something like this when it does the poly splitting function). You could then draw the shape with a magnification factor to create the zoomed in effect. You could create a "round" window by specifying a more complex shape.

As you track the users input you would change the shape transformation matrix so that it changed the texture UV coordinates in the source image to reflect the new position on the screen.

talis · July 2012

Thank you very much for the advice @techdojo.
I am not so much good at Gideros or lua still learning. My first and only experience with Lua is WOW(Worl Of Warcraft) except Gideros. I wrote an addon there.

So hope i will scratch out your advice. I will try those.

techdojo · July 2012

@Talis - You might want to look at the 2nd raster bar demo on http://www.giderosmobile.com/forum/discussion/1288/old-skool-demo-effects-as-done-with-gideros as it'll help start to help you implement your magnifying glass.

Howdy, Stranger!

Categories

In this Discussion

Top Posters

Implementing Magnifier tool Quesition?

Comments

Howdy, Stranger!

Quick Links

Categories

In this Discussion

Top Posters

Implementing Magnifier tool Quesition?

Comments