• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Swipe more than one movie clip

Explorer ,
Oct 01, 2017 Oct 01, 2017

Copy link to clipboard

Copied

Hi,

is it possible to have the swipe function work on more than one movie clip?

I have got it working no problem on a single movie clip using the code snippet provided.

But I would like to have two movie clips which I can swipe independently.

Both movie clips are positioned off-screen above the stage and are called individually - so that only one movie clip is visible at any point in time. I've got that part sorted no problem.

It's just being able to swipe each of those movie clips independently so one doesn't affect the other.

I've attached an image of the layout I am trying to achieve:

Layout Diagram.jpg

=========================   This is where I've got to with the code based on the swipe code snippet provide    ===================================

/* Swipe to Go to Next/Previous Frame and Stop

Swiping the stage moves the playhead to the next/previous frame and stops the movie.

*/

Multitouch.inputMode = MultitouchInputMode.GESTURE;

var currentGalleryItem:Number = 1;

var totalGalleryItems:Number = 17;

stage.addEventListener (TransformGestureEvent.GESTURE_SWIPE, fl_SwipeToGoToNextPreviousFrame);

function fl_SwipeToGoToNextPreviousFrame(event:TransformGestureEvent):void

{

if(event.offsetX == 1)

{

if(currentGalleryItem > 1){

currentGalleryItem--;

slideRight();

}

}

else if(event.offsetX == -1)

{

if(currentGalleryItem < totalGalleryItems){

currentGalleryItem++;

slideLeft();

}

}

}

var slideCounter:Number = 0;

function slideLeft(){

segpanel1.addEventListener("enterFrame", moveGalleryLeft);

}

function slideRight(){

segpanel1.addEventListener("enterFrame", moveGalleryRight);

}

function moveGalleryLeft(evt:Event){

segpanel1.x -= 48;

slideCounter++;

if(slideCounter == 10){

segpanel1.removeEventListener("enterFrame", moveGalleryLeft);

slideCounter = 0;

}

}

function moveGalleryRight(evt:Event){

segpanel1.x += 48;

slideCounter++;

if(slideCounter == 10){

segpanel1.removeEventListener("enterFrame", moveGalleryRight);

slideCounter = 0;

}

}

/* Seg panel 2*/

var slideCounter2:Number = 0;

function slideLeft2(){

segpanel2.addEventListener("enterFrame", moveGalleryLeft2);

}

function slideRight2(){

segpanel2.addEventListener("enterFrame", moveGalleryRight2);

}

function moveGalleryLeft2(evt:Event){

segpanel2.x -= 48;

slideCounter++;

if(slideCounter == 10){

segpanel2.removeEventListener("enterFrame", moveGalleryLeft2);

slideCounter = 0;

}

}

function moveGalleryRight2(evt:Event){

segpanel2.x += 48;

slideCounter++;

if(slideCounter == 10){

segpanel2.removeEventListener("enterFrame", moveGalleryRight2);

slideCounter = 0;

}

}

stop();

=========================   End of code    ===================================

I know I've tied myself in knots and I'm hoping the answer is quite straight-forward.

Be grateful for any advice.


Thanks

Views

447

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Oct 02, 2017 Oct 02, 2017

you're welcome:

var gallery:MovieClip;

gallery1.currentGalleryItem = 1;

gallery1.totalGalleryItems = 17;

gallery1.slideCounter = 0;

gallery2.currentGalleryItem = 1;

gallery2.totalGalleryItems = 27;  // or whatever

gallery2.slideCounter = 0;

function fl_SwipeToGoToNextPreviousFrame(event:TransformGestureEvent):void

{

if(gallery1.hitTestPoint(mouseX,mouseY)){

gallery = gallery1;

} else if(gallery2.hitTestPoint(mouseX,mouseY)){

gallery = gallery2;

}

if(event.offsetX == 1)

{

if(currentGalleryItem > 1){

currentGallery

...

Votes

Translate

Translate
Community Expert ,
Oct 01, 2017 Oct 01, 2017

Copy link to clipboard

Copied

use a hittestpoint to determine when movieclip is undergoing a swipe and 'move' that one.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 02, 2017 Oct 02, 2017

Copy link to clipboard

Copied

Thanks kglad

I'm just looking at how to set up a hit point test.

Thanks.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 02, 2017 Oct 02, 2017

Copy link to clipboard

Copied

you're welcome:

var gallery:MovieClip;

gallery1.currentGalleryItem = 1;

gallery1.totalGalleryItems = 17;

gallery1.slideCounter = 0;

gallery2.currentGalleryItem = 1;

gallery2.totalGalleryItems = 27;  // or whatever

gallery2.slideCounter = 0;

function fl_SwipeToGoToNextPreviousFrame(event:TransformGestureEvent):void

{

if(gallery1.hitTestPoint(mouseX,mouseY)){

gallery = gallery1;

} else if(gallery2.hitTestPoint(mouseX,mouseY)){

gallery = gallery2;

}

if(event.offsetX == 1)

{

if(currentGalleryItem > 1){

currentGalleryItem--;

slideRight();

}

}

else if(event.offsetX == -1)

{

if(currentGalleryItem < totalGalleryItems){

currentGalleryItem++;

slideLeft();

}

}

}

// now change your code to update gallery instead of segpanel1 and segpanel2

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 02, 2017 Oct 02, 2017

Copy link to clipboard

Copied

Thanks again, this looks exactly what I've been trying to do.

Easy when you know how eh!!

I will try and implement this later (I'm committed to another project at the mo) but if not I'll get on to it tomorrow.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 02, 2017 Oct 02, 2017

Copy link to clipboard

Copied

you're welcome.

p.s. if you have a lot of galleries using an array would simplify and make your code easier to debug and expand.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 13, 2017 Oct 13, 2017

Copy link to clipboard

Copied

Hi,

I've just finally got a chance to try this and I know I'm doing something daft but I'm getting the following error messages:

Scene 1, Layer 'Actswipe', Frame 1, Line 48, Column 4 1120: Access of undefined property currentGalleryItem.

Scene 1, Layer 'Actswipe', Frame 1, Line 50, Column 1 1120: Access of undefined property currentGalleryItem.

Scene 1, Layer 'Actswipe', Frame 1, Line 52, Column 1 1180: Call to a possibly undefined method slideRight.

Scene 1, Layer 'Actswipe', Frame 1, Line 62, Column 4 1120: Access of undefined property currentGalleryItem.

Scene 1, Layer 'Actswipe', Frame 1, Line 62, Column 25 1120: Access of undefined property totalGalleryItems.

Scene 1, Layer 'Actswipe', Frame 1, Line 64, Column 1 1120: Access of undefined property currentGalleryItem.

Scene 1, Layer 'Actswipe', Frame 1, Line 66, Column 1 1180: Call to a possibly undefined method slideLeft.

I've changed the code so that the movie clips Im trying to swipe are called gallery1 and gallery2 as you advised but nothing's happening.

This is the exact code I'm using:

Multitouch.inputMode = MultitouchInputMode.GESTURE;

stage.addEventListener (TransformGestureEvent.GESTURE_SWIPE, fl_SwipeToGoToNextPreviousFrame);

var gallery:MovieClip;

gallery1.currentGalleryItem = 1;

gallery1.totalGalleryItems = 17;

gallery1.slideCounter = 0;

gallery2.currentGalleryItem = 1;

gallery2.totalGalleryItems = 27;  // or whatever

gallery2.slideCounter = 0;

function fl_SwipeToGoToNextPreviousFrame(event:TransformGestureEvent):void

{

if(gallery1.hitTestPoint(mouseX,mouseY)){

gallery = gallery1;

} else if(gallery2.hitTestPoint(mouseX,mouseY)){

gallery = gallery2;

}

if(event.offsetX == 1)

{

if(currentGalleryItem > 1){

currentGalleryItem--;

slideRight();

}

}

else if(event.offsetX == -1)

{

if(currentGalleryItem < totalGalleryItems){

currentGalleryItem++;

slideLeft();

}

}

}

I'm sure it's going to be something obvious but I've tried copying various bits from my previous code but that obviously throughs up further errors.


Any advice appreciated.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 13, 2017 Oct 13, 2017

Copy link to clipboard

Copied

you still need your slideRight and slideLeft functions.  also:

var gallery:MovieClip;

gallery1.currentGalleryItem = 1;

gallery1.totalGalleryItems = 17;

gallery1.slideCounter = 0;

gallery2.currentGalleryItem = 1;

gallery2.totalGalleryItems = 27;  // or whatever

gallery2.slideCounter = 0;

function fl_SwipeToGoToNextPreviousFrame(event:TransformGestureEvent):void

{

if(gallery1.hitTestPoint(mouseX,mouseY)){

gallery = gallery1;

} else if(gallery2.hitTestPoint(mouseX,mouseY)){

gallery = gallery2;

}

if(event.offsetX == 1)

{

if(gallery.currentGalleryItem > 1){

gallery.currentGalleryItem--;

slideRight();

}

}

else if(event.offsetX == -1)

{

if(gallery.currentGalleryItem < gallery.totalGalleryItems){

gallery.currentGalleryItem++;

slideLeft();

}

}

}

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 17, 2017 Oct 17, 2017

Copy link to clipboard

Copied

Hi,

I've tried all sorts with this and I can't get it to work. I've added the slideRight slideLeft functions as you pointed out like this:

function slideLeft(){

gallery1,gallery2.addEventListener("enterFrame", moveGalleryLeft);

}

function slideRight(){

gallery1,gallery2.addEventListener("enterFrame", moveGalleryRight);

}

But that just makes the whole thing go crazy - the gallery just flying off the screen without stopping. So my whole code is looking like this:

/* Swipe to Go to Next/Previous Frame and Stop

Swiping the stage moves the playhead to the next/previous frame and stops the movie.

*/

Multitouch.inputMode = MultitouchInputMode.GESTURE;

var currentGalleryItem:Number = 1;

var totalGalleryItems:Number = 6;

stage.addEventListener (TransformGestureEvent.GESTURE_SWIPE, fl_SwipeToGoToNextPreviousFrame);

var slideCounter:Number = 0;

function slideLeft(){

gallery1,gallery2.addEventListener("enterFrame", moveGalleryLeft);

}

function slideRight(){

gallery1,gallery2.addEventListener("enterFrame", moveGalleryRight);

}

function moveGalleryLeft(evt:Event){

gallery1,gallery2.x -= 48;

slideCounter++;

if(slideCounter == 10){

gallery1.removeEventListener("enterFrame", moveGalleryLeft);

slideCounter = 0;

}

}

function moveGalleryRight(evt:Event){

gallery1,gallery2.x += 48;

slideCounter++;

if(slideCounter == 10){

gallery1.removeEventListener("enterFrame", moveGalleryRight);

slideCounter = 0;

}

}

var gallery:MovieClip;

gallery1.currentGalleryItem = 1;

gallery1.totalGalleryItems = 6;

gallery1.slideCounter = 0;

gallery2.currentGalleryItem = 1;

gallery2.totalGalleryItems = 6; 

gallery2.slideCounter = 0;

function fl_SwipeToGoToNextPreviousFrame(event:TransformGestureEvent):void

{

if(gallery1.hitTestPoint(mouseX,mouseY)){

gallery = gallery1;

} else if(gallery2.hitTestPoint(mouseX,mouseY)){

gallery = gallery2;

}

if(event.offsetX == 1)

{

if(gallery.currentGalleryItem > 1){

gallery.currentGalleryItem--;

slideRight();

}

}

else if(event.offsetX == -1)

{

if(gallery.currentGalleryItem < gallery.totalGalleryItems){

gallery.currentGalleryItem++;

slideLeft();

}

}

}

A mess I know but hopefully I'll learn something from this . . .

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 17, 2017 Oct 17, 2017

Copy link to clipboard

Copied

it doesn't make any sense to move 48 px in an enterframe loop because that's probably the width of your gallery items.

anyway, that should be:

function slideLeft(){

if(gallery.slideCounter>0){

gallery.addEventListener("enterFrame", moveGalleryLeft);

}

}

function slideRight(){

if(gallery.slideCounter<gallery.totalGalleryItems){

gallery.addEventListener("enterFrame", moveGalleryRight);

}

}

function moveGalleryLeft(evt:Event){

gallery.x -= 48;  // if you moved less than a gallery item width, you could animate the movement

gallery.slideCounter++;

gallery.removeEventListener("enterFrame", moveGalleryLeft);

}

function moveGalleryRight(evt:Event){

gallery.x += 48;  // if you moved less than a gallery item width, you could animate the movement

gallery.slideCounter--;

gallery.removeEventListener("enterFrame", moveGalleryRight);

}

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 25, 2017 Oct 25, 2017

Copy link to clipboard

Copied

I'm really struggling with this. But I am making some progress in that at least I've got both clips responding independently which is a big step in the right direction.

But what's not working is the following:

1) The movie clip only swipes right.

2) The swipe animation is instant - no smooth slide.

So I can't swipe backwards and forwards.

This is how I've butchered your code:

/* Swipe to Go to Next/Previous Frame and Stop

Swiping the stage moves the playhead to the next/previous frame and stops the movie.

*/

Multitouch.inputMode = MultitouchInputMode.GESTURE;

stage.addEventListener (TransformGestureEvent.GESTURE_SWIPE, fl_SwipeToGoToNextPreviousFrame);

var gallery:MovieClip;

gallery1.currentGalleryItem = 1;

gallery1.totalGalleryItems = 6;

gallery1.slideCounter = 0;

gallery2.currentGalleryItem = 1;

gallery2.totalGalleryItems = 6;  // or whatever

gallery2.slideCounter = 0;

function fl_SwipeToGoToNextPreviousFrame(event:TransformGestureEvent):void

{

if(gallery1.hitTestPoint(mouseX,mouseY)){

gallery = gallery1;

} else if(gallery2.hitTestPoint(mouseX,mouseY)){

gallery = gallery2;

}

if(event.offsetX == 1)

{

if(gallery.currentGalleryItem > 1){

gallery.currentGalleryItem--;

slideRight();

}

}

else if(event.offsetX == -1)

{

if(gallery.currentGalleryItem < gallery.totalGalleryItems){

gallery.currentGalleryItem++;

slideLeft();

}

}

}

function slideLeft(){

if(gallery.slideCounter>0){

gallery.addEventListener("enterFrame", moveGalleryLeft);

}

}

function slideRight(){

if(gallery.slideCounter<gallery.totalGalleryItems){

gallery.addEventListener("enterFrame", moveGalleryRight);

}

}

function moveGalleryLeft(evt:Event){

gallery.x -= 480;  // if you moved less than a gallery item width, you could animate the movement

gallery.slideCounter++;

gallery.removeEventListener("enterFrame", moveGalleryLeft);

}

function moveGalleryRight(evt:Event){

gallery.x += 480;  // if you moved less than a gallery item width, you could animate the movement

gallery.slideCounter--;

gallery.removeEventListener("enterFrame", moveGalleryRight);

}

I'm trying my best but this is a pretty steep learning curve.

Thanks for any advice.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 25, 2017 Oct 25, 2017

Copy link to clipboard

Copied

1. check event.offsetX to see if it's anything other than 1 or -1

2. i mentioned that in the comments

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 28, 2017 Oct 28, 2017

Copy link to clipboard

Copied

Finally got it figured out.

The crucial part is (as you pointed out right at the top KGLAD) setting up the hit point for the movie clip . .. . not the stage.

That worked for me once I got my head around it 🙂

This is a really great and informative video on this subject:

https://www.youtube.com/watch?v=_erNkPDtaDI&t=116s

Thanks for your input.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 28, 2017 Oct 28, 2017

Copy link to clipboard

Copied

LATEST

you're welcome.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines