Howdy, Stranger!
It looks like you're new here. If you want to get involved, click one of these buttons!
Quick Links
Categories
- 7.8K All Categories
- 11 Help with translations
- 4.2K General questions
- 107 Roadmap
- 358 Game & application design
- 317 Plugins
- 70 User experience
- 75 Marketplace
- 291 Code snippets
- 34 Building a team?
- 269 Suggestions & requests
- 352 Announce your apps made with Gideros.
- 90 Step by step tutorials
- 668 Bugs and issues
- 195 Introduce yourself
- 239 Announcements
- 106 Forum talk
- 404 Relax cafe
In this Discussion
Modifying ar2rsawseen's great slider code?
DaveyJJ
Member
Hi all,
As a newbie programmer (designer of 20+ years) I can manage only fairly rudimentary Lua and JS coding. Enough to get myself into trouble, sometimes make things work, but still need to remind myself daily how to write a loop.
I managed to get into ar2rsawseen's superb Ace.slide code, and actually write a loop to slide horizontally through four images, which is a big deal for me.
AceSlide.init({
orientation = "horizontal",
spacing = 0,
parent = stage,
speed = .5,
unfocusedAlpha = 1.0,
easing = inCubic,
allowDrag = true,
dragOffset = 70
})
local cover = {"image-1.jpg","image-2.jpg","cimage-3.jpg","image-4.jpg"}
for i = 1, 4 do
local images = Bitmap.new(Texture.new(cover[i]))
AceSlide.add(images)
end
My question is about a "multi-layer" series of images that needs to swipe/scroll both horizontally through a row, and also swipe/scroll up/down vertically down to the next/previous series. I'll pseudo-code it to show you what I mean ...
local cars = {
{"ford-1.jpg, "ford-2.jpg", "ford-3.jpg" ... "ford-n.jpg"}
{"gm-1.jpg, "gm-2.jpg", "gm-3.jpg" ... "gm-n.jpg"}
}
So the screen initially shows ford-1, move right shows ford-2, the down arrow would show gm-1 (preferably going to the start of the next row, instead of gm-2), etc.
Is is somehow possible to have the AceSlide.init work for both directions, depending on which arrow or swipe the user does? Can anyone help me with this (it's probably not as easy as I imagine)?
As a newbie programmer (designer of 20+ years) I can manage only fairly rudimentary Lua and JS coding. Enough to get myself into trouble, sometimes make things work, but still need to remind myself daily how to write a loop.
I managed to get into ar2rsawseen's superb Ace.slide code, and actually write a loop to slide horizontally through four images, which is a big deal for me.
AceSlide.init({
orientation = "horizontal",
spacing = 0,
parent = stage,
speed = .5,
unfocusedAlpha = 1.0,
easing = inCubic,
allowDrag = true,
dragOffset = 70
})
local cover = {"image-1.jpg","image-2.jpg","cimage-3.jpg","image-4.jpg"}
for i = 1, 4 do
local images = Bitmap.new(Texture.new(cover[i]))
AceSlide.add(images)
end
My question is about a "multi-layer" series of images that needs to swipe/scroll both horizontally through a row, and also swipe/scroll up/down vertically down to the next/previous series. I'll pseudo-code it to show you what I mean ...
local cars = {
{"ford-1.jpg, "ford-2.jpg", "ford-3.jpg" ... "ford-n.jpg"}
{"gm-1.jpg, "gm-2.jpg", "gm-3.jpg" ... "gm-n.jpg"}
}
So the screen initially shows ford-1, move right shows ford-2, the down arrow would show gm-1 (preferably going to the start of the next row, instead of gm-2), etc.
Is is somehow possible to have the AceSlide.init work for both directions, depending on which arrow or swipe the user does? Can anyone help me with this (it's probably not as easy as I imagine)?
Dislikes: roboward
Tagged:
+1 -1 (+0 / -1 )Share on Facebook
Comments
In my humbled opinion, it would be easier to write new a new class.
I have one idea though, that might work almost as you want. For horizontal you create Ace.Slide, but for vertical you simply change scene to new horizontal Ace.Slide, which will go to first element in row.
Will that work for you?
Likes: DaveyJJ
And here is the video, just if someone is interested in something similar:
Likes: DaveyJJ, marbolec, hosamred
Likes: gorkem
Nevertheless I've updated project files attached to my previous comment, with vertical swiping functionality, but as I said Ace.Slide overrides its and Swiping works only "outside the box".
You may want to try to out some design element like "swipe line", to show users, that they can swipe outside the image, or comment out "event:stopPropagation()" in Ace.Slide onMouseMove and onMouseUp methods and try to find apropriate dragOffset parameter value not to trigger horizontal slide while swiping vertical one.
But doing that also might cause some bugs if you use images as buttons, meaning they also need to receive mouse events. Well just need to experiment around and see.