Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]
Photo

Difficulty in creating objects on different screens
Started by jdsmedeirosbr Jul 11 2018 04:35 AM

6 replies to this topic
[TOPIC CONTROLS]
[/TOPIC CONTROLS]
[modOptionsDropdown]
[/modOptionsDropdown]
[reputationFilter]
[TOPIC: post.html]
#1

jdsmedeirosbr

[GLOBAL: userInfoPane.html]
jdsmedeirosbr
  • Enthusiast

  • 44 posts
  • Corona SDK

Hello, I am creating an app that when playing on some card it is selected and creates a button to send the card to a deck when it is pressed, I have some difficulty in:
 
1 - Make the cards fill the total width of any device respecting the proportion and the space of 8 pixels.
 
2 - When playing the card, the button does not appear in the middle of the card
 
3 - At the touch of the button, I would like the card to transition to the green deck at the top of the screen and the other cards fill the void left by the card selected for the deck.
 
I'm using Corona 2018.3326 on Windows 7, I'm creating the main base app on iOS, first testing on the iPhone 4S simulator
 
local composer = require( "composer" )
local widget = require("widget")


local scene = composer.newScene()


local mFloor = math.floor   
local myCardsRef, cards = {}, {}
local lastTappedCard
local navBar 
local scrollView
local deck
local sizeDeck = (display.contentHeight * 45 / 100) - 64
local title
local cardDeck1
local cardDeck2
local cardDeck3
local cardDeck4
local cardDeck5
local cardDeck6
local cardDeck7
local cardDeck8
local button


function scene:create( event )


    local sceneGroup = self.view
    
    navBar = display.newRect(sceneGroup,0, 0,display.contentWidth, 64)
    navBar.anchorX = 0
    navBar.anchorY = 0
    navBar:setFillColor(1,0,0)
        
    deck = display.newRect(sceneGroup,0, navBar.y + navBar.height,display.contentWidth, sizeDeck)
    deck.anchorX = 0
    deck.anchorY = 0
    deck:setFillColor(1,1,0)
    
    title = display.newText(sceneGroup,"Home",display.contentCenterX, navBar.y + navBar.height - 20,nil, 17)
    title:setFillColor(1,1,1)
    
    cardDeck1 = display.newRect(sceneGroup, 45,deck.y + 8,50,65)
    cardDeck1.anchorX = 0
    cardDeck1.anchorY = 0
    cardDeck1:setFillColor(0,1,0)
    
    cardDeck2 = display.newRect(sceneGroup, cardDeck1.x + cardDeck1.width + 8,deck.y + 8,50,65)
    cardDeck2.anchorX = 0
    cardDeck2.anchorY = 0
    cardDeck2:setFillColor(0,1,0)
    
    cardDeck3 = display.newRect(sceneGroup, cardDeck2.x + cardDeck2.width + 8,deck.y + 8,50,65)
    cardDeck3.anchorX = 0
    cardDeck3.anchorY = 0
    cardDeck3:setFillColor(0,1,0)
    
    cardDeck4 = display.newRect(sceneGroup, cardDeck3.x + cardDeck3.width + 8,deck.y + 8,50,65)
    cardDeck4.anchorX = 0
    cardDeck4.anchorY = 0
    cardDeck4:setFillColor(0,1,0)
    
    cardDeck5 = display.newRect(sceneGroup, 45,cardDeck1.y + cardDeck1.height + 8,50,65)
    cardDeck5.anchorX = 0
    cardDeck5.anchorY = 0
    cardDeck5:setFillColor(0,1,0)
    
    cardDeck6 = display.newRect(sceneGroup, cardDeck5.x + cardDeck5.width + 8,cardDeck1.y + cardDeck1.height + 8,50,65)
    cardDeck6.anchorX = 0
    cardDeck6.anchorY = 0
    cardDeck6:setFillColor(0,1,0)
    
    cardDeck7 = display.newRect(sceneGroup, cardDeck6.x + cardDeck6.width + 8,cardDeck1.y + cardDeck1.height + 8,50,65)
    cardDeck7.anchorX = 0
    cardDeck7.anchorY = 0
    cardDeck7:setFillColor(0,1,0)
    
    cardDeck8 = display.newRect(sceneGroup, cardDeck7.x + cardDeck7.width + 8,cardDeck1.y + cardDeck1.height + 8,50,65)
    cardDeck8.anchorX = 0
    cardDeck8.anchorY = 0
    cardDeck8:setFillColor(0,1,0)


scrollView = widget.newScrollView(
    {
      top = display.contentHeight - display.contentHeight * 55 / 100,
      left = 0,
      width = display.contentWidth,
      height = display.contentHeight * 55 / 100,
      scrollWidth = 600,
      horizontalScrollDisabled = true,
      scrollHeight = 1300,
      listener = scrollListener
    }
  ) 
  
  sceneGroup:insert(scrollView)
  
for i=1, 86 do


    cards[#cards + 1] = { 
        name = 'card'..i..'.png', 
        x    = 8 + ( i - 1 ) % 4 * 76,
        y    = 8 + ( mFloor( ( i - 0.5 ) / 4 ) * 98 ),
        w    = (display.contentWidth - 40) / 4,
        h    = 90
    }  
end 


print((scrollView.width - 40) / 4)


local function tap( self, event )


    if lastTappedCard then


        myCardsRef[lastTappedCard].alpha = 1
        button:removeSelf()
        button = nil


    end 


    myCardsRef[self].alpha = 0.5
    button = display.newRect(event.x,event.y, 50, 30)
    button:setFillColor(0,0,0)
    lastTappedCard = self


end


for index = 1, #cards do


  local card = display.newRect(cards[index].x,cards[index].y,cards[index].w,cards[index].h)
  card.anchorX = 0
  card.anchorY = 0
  card:setFillColor( 1, 0, 0 )
  card.tap = tap
  card:addEventListener( "tap" )
  scrollView:insert( card )


  myCardsRef[card] = card


end


end 

 

Attached Files



[TOPIC: post.html]
#2

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 24,995 posts
  • Corona SDK

I'm having a bit of trouble understanding what you're asking. There seem to be multiple questions. Can you find your main point of contention and try to clarify it better?

 

Rob



[TOPIC: post.html]
#3

jdsmedeirosbr

[GLOBAL: userInfoPane.html]
jdsmedeirosbr
  • Enthusiast

  • 44 posts
  • Corona SDK

I'm having a bit of trouble understanding what you're asking. There seem to be multiple questions. Can you find your main point of contention and try to clarify it better?

 

Rob

Yes, even in the meantime I have managed to solve some situations, my question now is just a ...
 
when I touch a card, it disappears, so I would like the others in the queue to make a transition animation to fill in the space left, whatever card is withdrawn.
 
local composer = require( "composer" )
local widget = require("widget")


local scene = composer.newScene()


local mFloor = math.floor   
local myCardsRef, cards = {}, {}
local lastTappedCard
local navBar 
local scrollView
local deck
local sizeDeck = (display.contentHeight * 45 / 100) - 64
local title
local cardDeck1
local cardDeck2
local cardDeck3
local cardDeck4
local cardDeck5
local cardDeck6
local cardDeck7
local cardDeck8
local button
local oldButton
local card
local countCard = 0


function scene:create( event )


    local sceneGroup = self.view
    
    navBar = display.newRect(sceneGroup,0, 0,display.contentWidth, 64)
    navBar.anchorX = 0
    navBar.anchorY = 0
    navBar:setFillColor(1,0,0)
        
    deck = display.newRect(sceneGroup,0, navBar.y + navBar.height,display.contentWidth, sizeDeck)
    deck.anchorX = 0
    deck.anchorY = 0
    deck:setFillColor(1,1,0)
    
    title = display.newText(sceneGroup,"Home",display.contentCenterX, navBar.y + navBar.height - 20,nil, 17)
    title:setFillColor(1,1,1)
    
    cardDeck1 = display.newRect(sceneGroup, 45,deck.y + 8,50,65)
    cardDeck1.anchorX = 0
    cardDeck1.anchorY = 0
    cardDeck1:setFillColor(0,1,0)
        
    cardDeck2 = display.newRect(sceneGroup, cardDeck1.x + cardDeck1.width + 8,deck.y + 8,50,65)
    cardDeck2.anchorX = 0
    cardDeck2.anchorY = 0
    cardDeck2:setFillColor(0,1,0)
    
    cardDeck3 = display.newRect(sceneGroup, cardDeck2.x + cardDeck2.width + 8,deck.y + 8,50,65)
    cardDeck3.anchorX = 0
    cardDeck3.anchorY = 0
    cardDeck3:setFillColor(0,1,0)
    
    cardDeck4 = display.newRect(sceneGroup, cardDeck3.x + cardDeck3.width + 8,deck.y + 8,50,65)
    cardDeck4.anchorX = 0
    cardDeck4.anchorY = 0
    cardDeck4:setFillColor(0,1,0)
    
    cardDeck5 = display.newRect(sceneGroup, 45,cardDeck1.y + cardDeck1.height + 8,50,65)
    cardDeck5.anchorX = 0
    cardDeck5.anchorY = 0
    cardDeck5:setFillColor(0,1,0)
    
    cardDeck6 = display.newRect(sceneGroup, cardDeck5.x + cardDeck5.width + 8,cardDeck1.y + cardDeck1.height + 8,50,65)
    cardDeck6.anchorX = 0
    cardDeck6.anchorY = 0
    cardDeck6:setFillColor(0,1,0)
    
    cardDeck7 = display.newRect(sceneGroup, cardDeck6.x + cardDeck6.width + 8,cardDeck1.y + cardDeck1.height + 8,50,65)
    cardDeck7.anchorX = 0
    cardDeck7.anchorY = 0
    cardDeck7:setFillColor(0,1,0)
    
    cardDeck8 = display.newRect(sceneGroup, cardDeck7.x + cardDeck7.width + 8,cardDeck1.y + cardDeck1.height + 8,50,65)
    cardDeck8.anchorX = 0
    cardDeck8.anchorY = 0
    cardDeck8:setFillColor(0,1,0)


scrollView = widget.newScrollView(
    {
      top = display.contentHeight - display.contentHeight * 55 / 100,
      left = 0,
      width = display.contentWidth,
      height = display.contentHeight * 55 / 100,
      scrollWidth = 600,
      horizontalScrollDisabled = true,
      scrollHeight = 1300,
      listener = scrollListener
    }
  )   
  sceneGroup:insert(scrollView)
  
for i=1, 86 do


    cards[#cards + 1] = { 
        name = 'card'..i..'.png', 
        x    = 8 + ( i - 1 ) % 4 * 76,
        y    = 8 + ( mFloor( ( i - 0.5 ) / 4 ) * 98 ),
        w    = (display.contentWidth - 40) / 4,
        h    = 90
    }  
end 


local function anim()
    
  lastTappedCard:setFillColor(0.5,0.9,0.3)
  
  lastTappedCard:removeSelf()
  cardDeck1.width = 50
  cardDeck1.height = 65  


  end


local function cardRemove(self,event)  
  
    display.remove(self)   
    oldButton = nil
    button = nil 
    lastTappedCard:removeSelf()  
    countCard = countCard + 1
    if countCard == 1 then 
    cardDeck1:setFillColor(.9,.04,.8)
    elseif countCard == 2 then
    cardDeck2:setFillColor(.9,.04,.8)
    elseif countCard == 3 then
    cardDeck3:setFillColor(.9,.04,.8)
    elseif countCard == 4 then
    cardDeck4:setFillColor(.9,.04,.8)
    elseif countCard == 5 then
    cardDeck5:setFillColor(.9,.04,.8)
    elseif countCard == 6 then
    cardDeck6:setFillColor(.9,.04,.8)
    elseif countCard == 7 then
    cardDeck7:setFillColor(.9,.04,.8)
    elseif countCard == 8 then
    cardDeck8:setFillColor(.9,.04,.8)
    end 
    lastTappedCard:removeSelf()
    lastTappedCard = nil
       
    return true         
end


local function tap( self, event )


    if lastTappedCard then


        myCardsRef[lastTappedCard].alpha = 1 
        
        if oldButton and oldButton.removeSelf then


        display.remove( oldButton )
        oldButton = nil
        
        end
    end 


    myCardsRef[self].alpha = 0.5   
    myCardsRef[self].isEnabled = false
    oldButton = display.newRect(sceneGroup,myCardsRef[self].x + myCardsRef[self].width * .5,myCardsRef[self].y + myCardsRef[self].height * .5, 60, 30)   
    oldButton:setFillColor(0,0,0)
    getButton = button
    scrollView:insert(oldButton)    
    lastTappedCard = self 
    oldButton.tap = cardRemove
    oldButton:addEventListener("tap")    
    return true
end


  for index = 1, #cards do


    card = display.newRect(sceneGroup,cards[index].x,cards[index].y,cards[index].w,cards[index].h)
    card.anchorX = 0
    card.anchorY = 0
    card:setFillColor( 1, 0, 0 )
    card.tap = tap
    card:addEventListener( "tap" )
    scrollView:insert( card )
    myCardsRef[card] = card
  end
end 

Attached Files



[TOPIC: post.html]
#4

cyberparkstudios

[GLOBAL: userInfoPane.html]
cyberparkstudios
  • Contributor

  • 538 posts
  • Corona SDK

I saw your post and thought maybe this might help answer your last question.

 

Please keep in mind this is based on not totally understanding the question 100% or exactly what the game is suppose to do... but I think I have a fair idea... so I 'hacked together a sample' that hopefully will answer or give you some food for thought on how to get the code where you want it.

 

Also, keep in mind there is usually many different ways to do most things, so this is not the best way by far, and not the way I would do it for myself.  I tired to keep your code close to how you had it, but I had to make some changes just for me to be able to work with it and experiment. 

 

Test this out by making a new project. Cut and paste the code below and see if it does close to what you were looking for.

Keep in mind it needs work still.

 

I have issues dealing with the widget scrollView, so I substituted that with display group to hold the cards. The group will function similar to a scrollview.  I just could not get the scrollview to work with the code as I have the code. I imagine there is a way to make it work - i just don't use the scrollview much.

 

main.lua

display.setStatusBar( display.HiddenStatusBar )

local Composer = require ( "composer" )
Composer.removeHidden()
Composer.gotoScene("Scenes.gameScene", {time=550, effect="crossFade"})

gameScene.lua


local composer = require( "composer" )
local widget = require("widget")

local mFloor = math.floor   
local myCardsRef, cards = {}, {}
local lastTappedCard
local navBar 
local scrollView
local sizeDeck = (display.contentHeight * 45 / 100) - 64
local title

local decks_backGround
local deck
local cardDecks = {}
local deckCursor = 1
local cardCursor = 0
local deckWt = 50
local deckHt = 65   
local leftEdge = 45
local topEdge = 45
local horzCur
local vertCur
local gap = 8
local bg_cover
local effectRect
local sg

local gameState = "READY"

local W = display.contentWidth
local H = display.contentHeight
local MID_W = W * .5
local MID_H = H * .5

local scene = composer.newScene()

local function updateCursors()		
	deckCursor = deckCursor + 1
	if deckCursor > 8 then
		deckCursor = 1
	end		
	cardCursor = cardCursor + 1
	if cardCursor > #cards then
		cardCursor = 1
	end
	print(" cards left " .. #cards - cardCursor)
	
	-- adjust the topBounds of the scrollGroup as each card is removed
	topBounds = H - scrollGroup.height
	
	gameState = "READY"
end

local function endEffect()
	transition.to(effectRect, {time = 750, alpha = 0, onComplete=updateCursors})
end
	
local function tap( self, event )
	if gameState == "READY" then
		if event.target.isSelected == false then
			myCardsRef[self]:setFillColor(.5, .5, .5) 
			myCardsRef[self].isSelected = true
		else
			local x = myCardsRef[self].x
			local y = myCardsRef[self].y
			local idx = myCardsRef[self].scrollIdx
			local prevX = scrollGroup[idx].x
			local prevY = scrollGroup[idx].y
			local prevIdx = idx
			local spotX = scrollGroup[idx].x
			local spotY = scrollGroup[idx].y	
			gameState = "EFFECT"
			myCardsRef[self].x = event.x 
			myCardsRef[self].y = event.y		
			transition.to(myCardsRef[self], {time = 500, x = cardDecks[deckCursor].x, y = cardDecks[deckCursor].y, xScale = .75, yScale = .75})
			effectRect.x = cardGroup.x + cards[idx].x
			effectRect.y = cardGroup.y + cards[idx].y
			transition.to(effectRect, {time = 500, alpha = 1, onComplete=endEffect})
			for i = idx + 1, scrollGroup.numChildren do
				local x = scrollGroup[i].x
				local y = scrollGroup[i].y
				local pIdx = scrollGroup[i].scrollIdx
				scrollGroup[i].x = prevX
				scrollGroup[i].y = prevY
				scrollGroup[i].scrollIdx = prevIdx
				prevX = x
				prevY = y
				prevIdx = pIdx				
			end			
			sg:insert(myCardsRef[self])		
		end	
	end
	return true
end

local function onScroll(e)
	if gameState == "READY" then
		local t = e.target
		if "began" == e.phase then				
			t.isFocus = true			
			display.getCurrentStage():setFocus(t, nil)
			t.x0 = e.x - t.x
			t.y0 = e.y - t.y	
			yStart = t.y			
		elseif t.isFocus then	   
			if "moved" == e.phase then	
				t.y = e.y - t.y0					
				if t.y <  topBounds then 
					t.y = topBounds 
				elseif t.y >  botBounds then 
					t.y = botBounds
				end
				print(" t.y " .. t.y)
			elseif "ended" == e.phase or "cancelled" == e.phase then
				display.getCurrentStage():setFocus(t, nil )
				t.isFocus = false							
			end
		end			
    end
    return true
end

------------------------------------------------------------------
-- COMPOSER EVENTS
------------------------------------------------------------------

function scene:create( e )
	sg = self.view
	
	bg_cover = display.newRect(sg, MID_W, MID_H, W, H * .5)
	bg_cover.y = -(bg_cover.height * .5)
  	bg_cover:setFillColor(0)
	
	navBar = display.newRect(sg,0, 0,display.contentWidth, 64)
    navBar.anchorX = 0
    navBar.anchorY = 0
    navBar:setFillColor(1,0,0)
 
    topEdge = navBar.y + navBar.height + gap
    horzCur = leftEdge
    vertCur = topEdge
        
    decks_backGround = display.newRect(sg,0, navBar.y + navBar.height,display.contentWidth, sizeDeck)
    decks_backGround.anchorX = 0
    decks_backGround.anchorY = 0
    decks_backGround:setFillColor(1,1,0)

	title = display.newText(sg,"Home",display.contentCenterX, navBar.y + navBar.height - 20,nil, 17)
    title:setFillColor(1,1,1)
   
    for i = 1, 8 do
    	table.insert(cardDecks, display.newRect(sg, leftEdge, topEdge, deckWt, deckHt) )
    	cardDecks[i].anchorX = 0
    	cardDecks[i].anchorY = 0    	
    	if i == 5 then
    		horzCur = leftEdge
    		vertCur = topEdge + deckHt + gap    		
   		end 
    	cardDecks[i].x = horzCur
    	cardDecks[i].y = vertCur
    	horzCur = horzCur + deckWt + gap	
    	cardDecks[i]:setFillColor(0, 1, 0)    	  
    end
   
	cardGroup = display.newGroup()
	sg:insert(cardGroup)
	cardGroup:toBack()
	scrollGroup = display.newGroup()
	cardGroup:insert(scrollGroup)
	cardGroup.x = 0
	cardGroup.y = decks_backGround.y + decks_backGround.height
	cardGroup:addEventListener("touch", onScroll)
	      	
    for i= 1, 86 do
		cards[#cards + 1] = { 
			name = 'card'..i..'.png', 
			x    = 8 + ( i - 1 ) % 4 * 76,
			y    = 8 + ( mFloor( ( i - 0.5 ) / 4 ) * 98 ),
			w    = (display.contentWidth - 40) / 4,
			h    = 90
		}  
	end 
	
	for index = 1, #cards do
		card = display.newRect(cards[index].x,cards[index].y,cards[index].w,cards[index].h)
		card.anchorX = 0
		card.anchorY = 0				
		card:setFillColor( 1, 0, 0 )
		card.tap = tap
	   	card.isSelected = false    	
		card:addEventListener( "tap" )	
		scrollGroup:insert(card)		
		myCardsRef[card] = card
		myCardsRef[card].scrollIdx = index
  	end 
  	
  	effectRect = display.newRect(cards[1].w, cards[1].h, cards[1].w, cards[1].h)
  	effectRect:setFillColor(0)
  	effectRect.anchorX = 0
  	effectRect.anchorY = 0
  	effectRect.alpha = 0
  	topBounds = H - scrollGroup.height
	botBounds = decks_backGround.y + decks_backGround.height
end

function scene:show( e )
    if ( e.phase == "will" ) then
    elseif ( e.phase == "did" ) then
    end
end

function scene:hide( e )    
    if ( e.phase == "will" ) then
    
    elseif ( e.phase == "did" ) then
    
    end   
end

function scene:destroy( e )
       
end

scene:addEventListener( "create", scene )
scene:addEventListener( "show", scene )
scene:addEventListener( "hide", scene )
scene:addEventListener( "destroy", scene )

return scene

Hope it helps. 

Best of Luck on your game!

 

Bob



[TOPIC: post.html]
#5

jdsmedeirosbr

[GLOBAL: userInfoPane.html]
jdsmedeirosbr
  • Enthusiast

  • 44 posts
  • Corona SDK

I saw your post and thought maybe this might help answer your last question.

 

Please keep in mind this is based on not totally understanding the question 100% or exactly what the game is suppose to do... but I think I have a fair idea... so I 'hacked together a sample' that hopefully will answer or give you some food for thought on how to get the code where you want it.

 

Also, keep in mind there is usually many different ways to do most things, so this is not the best way by far, and not the way I would do it for myself.  I tired to keep your code close to how you had it, but I had to make some changes just for me to be able to work with it and experiment. 

 

Test this out by making a new project. Cut and paste the code below and see if it does close to what you were looking for.

Keep in mind it needs work still.

 

I have issues dealing with the widget scrollView, so I substituted that with display group to hold the cards. The group will function similar to a scrollview.  I just could not get the scrollview to work with the code as I have the code. I imagine there is a way to make it work - i just don't use the scrollview much.

 

main.lua

display.setStatusBar( display.HiddenStatusBar )

local Composer = require ( "composer" )
Composer.removeHidden()
Composer.gotoScene("Scenes.gameScene", {time=550, effect="crossFade"})

gameScene.lua


local composer = require( "composer" )
local widget = require("widget")

local mFloor = math.floor   
local myCardsRef, cards = {}, {}
local lastTappedCard
local navBar 
local scrollView
local sizeDeck = (display.contentHeight * 45 / 100) - 64
local title

local decks_backGround
local deck
local cardDecks = {}
local deckCursor = 1
local cardCursor = 0
local deckWt = 50
local deckHt = 65   
local leftEdge = 45
local topEdge = 45
local horzCur
local vertCur
local gap = 8
local bg_cover
local effectRect
local sg

local gameState = "READY"

local W = display.contentWidth
local H = display.contentHeight
local MID_W = W * .5
local MID_H = H * .5

local scene = composer.newScene()

local function updateCursors()		
	deckCursor = deckCursor + 1
	if deckCursor > 8 then
		deckCursor = 1
	end		
	cardCursor = cardCursor + 1
	if cardCursor > #cards then
		cardCursor = 1
	end
	print(" cards left " .. #cards - cardCursor)
	
	-- adjust the topBounds of the scrollGroup as each card is removed
	topBounds = H - scrollGroup.height
	
	gameState = "READY"
end

local function endEffect()
	transition.to(effectRect, {time = 750, alpha = 0, onComplete=updateCursors})
end
	
local function tap( self, event )
	if gameState == "READY" then
		if event.target.isSelected == false then
			myCardsRef[self]:setFillColor(.5, .5, .5) 
			myCardsRef[self].isSelected = true
		else
			local x = myCardsRef[self].x
			local y = myCardsRef[self].y
			local idx = myCardsRef[self].scrollIdx
			local prevX = scrollGroup[idx].x
			local prevY = scrollGroup[idx].y
			local prevIdx = idx
			local spotX = scrollGroup[idx].x
			local spotY = scrollGroup[idx].y	
			gameState = "EFFECT"
			myCardsRef[self].x = event.x 
			myCardsRef[self].y = event.y		
			transition.to(myCardsRef[self], {time = 500, x = cardDecks[deckCursor].x, y = cardDecks[deckCursor].y, xScale = .75, yScale = .75})
			effectRect.x = cardGroup.x + cards[idx].x
			effectRect.y = cardGroup.y + cards[idx].y
			transition.to(effectRect, {time = 500, alpha = 1, onComplete=endEffect})
			for i = idx + 1, scrollGroup.numChildren do
				local x = scrollGroup[i].x
				local y = scrollGroup[i].y
				local pIdx = scrollGroup[i].scrollIdx
				scrollGroup[i].x = prevX
				scrollGroup[i].y = prevY
				scrollGroup[i].scrollIdx = prevIdx
				prevX = x
				prevY = y
				prevIdx = pIdx				
			end			
			sg:insert(myCardsRef[self])		
		end	
	end
	return true
end

local function onScroll(e)
	if gameState == "READY" then
		local t = e.target
		if "began" == e.phase then				
			t.isFocus = true			
			display.getCurrentStage():setFocus(t, nil)
			t.x0 = e.x - t.x
			t.y0 = e.y - t.y	
			yStart = t.y			
		elseif t.isFocus then	   
			if "moved" == e.phase then	
				t.y = e.y - t.y0					
				if t.y <  topBounds then 
					t.y = topBounds 
				elseif t.y >  botBounds then 
					t.y = botBounds
				end
				print(" t.y " .. t.y)
			elseif "ended" == e.phase or "cancelled" == e.phase then
				display.getCurrentStage():setFocus(t, nil )
				t.isFocus = false							
			end
		end			
    end
    return true
end

------------------------------------------------------------------
-- COMPOSER EVENTS
------------------------------------------------------------------

function scene:create( e )
	sg = self.view
	
	bg_cover = display.newRect(sg, MID_W, MID_H, W, H * .5)
	bg_cover.y = -(bg_cover.height * .5)
  	bg_cover:setFillColor(0)
	
	navBar = display.newRect(sg,0, 0,display.contentWidth, 64)
    navBar.anchorX = 0
    navBar.anchorY = 0
    navBar:setFillColor(1,0,0)
 
    topEdge = navBar.y + navBar.height + gap
    horzCur = leftEdge
    vertCur = topEdge
        
    decks_backGround = display.newRect(sg,0, navBar.y + navBar.height,display.contentWidth, sizeDeck)
    decks_backGround.anchorX = 0
    decks_backGround.anchorY = 0
    decks_backGround:setFillColor(1,1,0)

	title = display.newText(sg,"Home",display.contentCenterX, navBar.y + navBar.height - 20,nil, 17)
    title:setFillColor(1,1,1)
   
    for i = 1, 8 do
    	table.insert(cardDecks, display.newRect(sg, leftEdge, topEdge, deckWt, deckHt) )
    	cardDecks[i].anchorX = 0
    	cardDecks[i].anchorY = 0    	
    	if i == 5 then
    		horzCur = leftEdge
    		vertCur = topEdge + deckHt + gap    		
   		end 
    	cardDecks[i].x = horzCur
    	cardDecks[i].y = vertCur
    	horzCur = horzCur + deckWt + gap	
    	cardDecks[i]:setFillColor(0, 1, 0)    	  
    end
   
	cardGroup = display.newGroup()
	sg:insert(cardGroup)
	cardGroup:toBack()
	scrollGroup = display.newGroup()
	cardGroup:insert(scrollGroup)
	cardGroup.x = 0
	cardGroup.y = decks_backGround.y + decks_backGround.height
	cardGroup:addEventListener("touch", onScroll)
	      	
    for i= 1, 86 do
		cards[#cards + 1] = { 
			name = 'card'..i..'.png', 
			x    = 8 + ( i - 1 ) % 4 * 76,
			y    = 8 + ( mFloor( ( i - 0.5 ) / 4 ) * 98 ),
			w    = (display.contentWidth - 40) / 4,
			h    = 90
		}  
	end 
	
	for index = 1, #cards do
		card = display.newRect(cards[index].x,cards[index].y,cards[index].w,cards[index].h)
		card.anchorX = 0
		card.anchorY = 0				
		card:setFillColor( 1, 0, 0 )
		card.tap = tap
	   	card.isSelected = false    	
		card:addEventListener( "tap" )	
		scrollGroup:insert(card)		
		myCardsRef[card] = card
		myCardsRef[card].scrollIdx = index
  	end 
  	
  	effectRect = display.newRect(cards[1].w, cards[1].h, cards[1].w, cards[1].h)
  	effectRect:setFillColor(0)
  	effectRect.anchorX = 0
  	effectRect.anchorY = 0
  	effectRect.alpha = 0
  	topBounds = H - scrollGroup.height
	botBounds = decks_backGround.y + decks_backGround.height
end

function scene:show( e )
    if ( e.phase == "will" ) then
    elseif ( e.phase == "did" ) then
    end
end

function scene:hide( e )    
    if ( e.phase == "will" ) then
    
    elseif ( e.phase == "did" ) then
    
    end   
end

function scene:destroy( e )
       
end

scene:addEventListener( "create", scene )
scene:addEventListener( "show", scene )
scene:addEventListener( "hide", scene )
scene:addEventListener( "destroy", scene )

return scene

Hope it helps. 

Best of Luck on your game!

 

Bob

hello cyberparkstudios, thanks for the help in the code, it was nice, but your example still does not do what I want. in this case, when I tap a card to go to the deck, it was to disappear from the scrollview and the other cards move in a transition to take the place of the card that was withdrawn. And the app I want to create is a decks creator for the royale clash. I want to guaradr some deck models to use in the game



[TOPIC: post.html]
#6

cyberparkstudios

[GLOBAL: userInfoPane.html]
cyberparkstudios
  • Contributor

  • 538 posts
  • Corona SDK

So, the first part you want does happen... the selected card 'transitions' from the scrollview and to one of the 8 decks...and it does disappear from the scrollview (in my case scrollGroup).  

 

The second part you want, I didn't want to mess with the transitioning, because your question was not clear and I had already spent a lot of time getting it to where it is.  So, I decided to just used a simple 'hack' for a visual effect for the card as it was removed and simply moved all the cards up through the group to fill that empty slot.  

 

As you probably see how I did that;  I simply found the index of the card that was selected and removed that card, and then looped though the rest of the scrollGroup assigning the x and y of a previous card's spot to the next card in the group...  simply moving them all up one spot int he scrollGroup.

 

To do what you want, you can instead of assigning the x and y, create a transition for each of the cards to 'transition' to that x and y position of the card before it.  

 

I thought about doing that for you, but honestly already spent a lot of time on it, and based on your original question was not sure that was what you wanted.  I am not sure when I will have time to mess with it more. So play around with it and see if you can code the transitions. 

 

You really only need to transition the 8 to 12 cards that are visible on the display. For the other cards below screen can do as I have it presently; just set their x,y to the previous spot.

 

If I was making the game for myself I would start from scratch and it a bit different.  There are better ways to do this, and would take redoing most all the code.  I am not real familiar with that Clash Royal card game to understand the exact action/effect you are looking for, and am not sure what you mean by a deck creator.

 

See what you can come up with doing transitions for what you need.  

 

I may not have time to even look at this tomorrow, but I will check back to see if you have any success doing the transitions.  Check the corona docs for transtition.to 

 

Good luck

Bob



[TOPIC: post.html]
#7

jdsmedeirosbr

[GLOBAL: userInfoPane.html]
jdsmedeirosbr
  • Enthusiast

  • 44 posts
  • Corona SDK

So, the first part you want does happen... the selected card 'transitions' from the scrollview and to one of the 8 decks...and it does disappear from the scrollview (in my case scrollGroup).  

 

The second part you want, I didn't want to mess with the transitioning, because your question was not clear and I had already spent a lot of time getting it to where it is.  So, I decided to just used a simple 'hack' for a visual effect for the card as it was removed and simply moved all the cards up through the group to fill that empty slot.  

 

As you probably see how I did that;  I simply found the index of the card that was selected and removed that card, and then looped though the rest of the scrollGroup assigning the x and y of a previous card's spot to the next card in the group...  simply moving them all up one spot int he scrollGroup.

 

To do what you want, you can instead of assigning the x and y, create a transition for each of the cards to 'transition' to that x and y position of the card before it.  

 

I thought about doing that for you, but honestly already spent a lot of time on it, and based on your original question was not sure that was what you wanted.  I am not sure when I will have time to mess with it more. So play around with it and see if you can code the transitions. 

 

You really only need to transition the 8 to 12 cards that are visible on the display. For the other cards below screen can do as I have it presently; just set their x,y to the previous spot.

 

If I was making the game for myself I would start from scratch and it a bit different.  There are better ways to do this, and would take redoing most all the code.  I am not real familiar with that Clash Royal card game to understand the exact action/effect you are looking for, and am not sure what you mean by a deck creator.

 

See what you can come up with doing transitions for what you need.  

 

I may not have time to even look at this tomorrow, but I will check back to see if you have any success doing the transitions.  Check the corona docs for transtition.to 

 

Good luck

Bob

thank you very much for your help cyberparkstudios, but I have not been able to remove the card yet and leave the deck with the correct amount after removing one or more cards, I have already looked for the solution a lot and I confess that I am almost giving up this project.
 



[topic_controls]
[/topic_controls]