how to create swipe views with tabs?

[alzaabi98]

what about the swipes ? is working with you ?

[horacebury]

@alzaabi98

horacebury …

can you explain more if you don’t mind

1- how can I know the vertical swipe from horizontal.  do you mean to event.x and event.xStart

2-  do you mean to use takeFocus() to make the focus on rectangle always on top of the senses.

3- Do I need to make one rectangle per scene or just one rectangle for all scenes in main.lua

4- for Tap events… do you mean to ignore them on rectangle and not doing return true so they can go down

Regards

Abdul

1. Yes, in each phase==“moved” you should test the distance between the start position and the current position of the touch. If the distance is more than a certain amount (call that the threshold) you check whether the amount moved on the x is more than the amount moved on the y. If event.x-event.xStart > event.y-event.yStart then it is horizontal.
2. I mean that you use the answer in #1 to check the distance and swipe direction on a display.newRect which covers the screen, a layer on top of the scrollview. If the swipe is horizontal do a navigation left or right. If the swipe is vertical, call takeFocus on the scrollview.
3. The rectangle would be per scene - one in each scene. But it depends on the scenes and if they need it. Build a test scene first. Post the code you make and I’ll see if it’s right. I might have posted something similar in the past few months, so do a search on the forums and code exchange, too.
4. Yes - simply don’t listen for tap events on the rectangle.

[alzaabi98]

Thanks sir for the explanation . 

what i did is to insert the tableview in a scrollview just to make use of takefocus() function… i was able to send horizontal swipes events down to scrollveiw … but the issue, the scrollview was moving up/down not the tableview… also tap events did not pass thru… here is my function …

[lua]

local function handleSwipe( event )
    if ( event.phase == “moved” ) then
        local dX = event.x - event.xStart
        local dy = math.abs( ( event.y - event.yStart ) )

        
        if ( dX > 60 ) then
            --swipe right
            print( “Swipe Right”)
            print( event.x, event.xStart, dX )

                   
        elseif ( dX  < -60 ) then
            print( “Swipe Left”)
            print( event.x, event.xStart, dX )

        end

        if ( dy > 50 ) then
            scrollView:takeFocus( event )
           – display.getCurrentStage():setFocus( list )
            print(“vertical swipe”)

        end

        --return true
    end
  return true

end

[/lua]

[oewere]

just solved the problem out … was really simple 

1 = make the tab and tab button global

2 call this function — tabbar:setselection(index, true) at the create scene level

=== what this does is doesn’t matter if its swipe or press, every time a page is open, make the happen

here where i got the i deal from

http://www.youtube.com/watch?v=eYRxlhs4Mi4

http://docs.coronalabs.com/api/type/TabBarWidget/setSelected.html

hope it helps

[alzaabi98]

Hi oewere

It is not simple as you mentioned… if you noticed in my code above, the tabBar is already global :

 

_G.tabBar = widget.newTabBar

 

The issue is when it comes to horizontal swipes and how to maintain it when you  have other vertical swipes for the table view. 

[akak]

Hi,

I am have a very similar problem if you’d care to take a look here:

http://forums.coronalabs.com/topic/53448-managing-focus-among-tableview-and-other-scene-elements/

But my tableview doesn’t have rows that can be swiped horizontally, so I was thinking in this case to work around the problem by, instead of passing the focus to the over layer, using the listener function of the tableview.

Basically make the tableview detect a general horizontal swipe that would trigger the scene transition.

Do you think this would work?

Where to start?

I tried something like this already (it’s the tableview listener function) :

local function scrollListener (event) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; local swipeLengthX = math.abs(event.x - event.xStart) &nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if event.phase == "began" then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print ( event.xStart) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; elseif event.phase == "moved" then &nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print (event.phase, event.x, event.xStart, swipeLengthX)&nbsp; &nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if event.x \> event.xStart and swipeLengthX \> 50 then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print("Swiped Left") &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; elseif event.x \< event.xStart and swipeLengthX \> 50 then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print( "Swiped Right" ) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; composer.gotoScene("counter", {effect="iosSlideRight01", time= 400}) end &nbsp;&nbsp; end &nbsp;end

but, aside returning error when the tableview ‘bounces back’, it seems like the tableview’s listener function only triggers it’s phases when the touch goes vertically - to scroll - only then it recognizes also horizontal drag movements… Does this make any sense?

Help would be greatly appreciated here,  wouldn’t want to switch to another sdk only for not being able to overcome such a basic problem…

Thanks!

[akak]

Hello,

I solved this issue by using the tableview’s listener function:

local function scrollListener (event) &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if event.phase == "began" then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; local swipeLengthX = math.abs(event.x - event.xStart) print (event.phase, event.x, event.xStart, swipeLengthX)&nbsp; &nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if event.x \> event.xStart and swipeLengthX \> 50 then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print("Swiped Left") &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; composer.gotoScene("counter", {effect="iosSlideRight01", time= 400}) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; elseif event.x \< event.xStart and swipeLengthX \> 50 then &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; print( "Swiped Right" ) end &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; elseif event.phase == "moved" then &nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp; end &nbsp;end

Please notice that in my case I don’t have any vertical or horizontal in-row swipe events to detect, so I think this solution wouldn’t apply to your specific cases since I understand you want to have somehow vertically scrollable rows…

I really hope someone else might get something good out of this anyway.

Cheers!