2015-11-16 1 views

Répondre

1

Voulez-vous un curseur horizontal où l'utilisateur peut glisser les images sur le côté?

Si c'est le cas, un simple ScrollView fera l'affaire.

<Page> 
<ScrollView orientation="horizontal"> 
    <Image src="~/image1.png" /> 
    <Image src="~/image2.png" /> 
    <Image src="~/image3.png" /> 
    <Image src="~/image4.png" /> 
</ScrollView> 
</Page> 

Voir aussi la documentation du ScrollView: https://docs.nativescript.org/ApiReference/ui/scroll-view/HOW-TO.html

+0

yey! cela fonctionne: D J'ai également utilisé au-dessus des images. –

+0

Une autre chose, comment puis-je centrer l'image une fois que je fais défiler vers une autre image? –

+0

http://www.telerik.com/forums/scrollview-7e1541bdfde3 même problème avec cela. J'ai essayé d'utiliser le balayage, mais parfois, le balayage échoue. hmmm .. –

0

Vous pouvez utiliser ce processus pour Gesture

import { SwipeGestureEventData } from "ui/gestures"; 
export class XXX{ 
public direction: number; 
private images:any[] = ["image url", "image url","image url","image url"]; 
public current_image; 
private image_lenght; 
private current_image_count=0; 

constructor() { 
    this.image_lenght = this.images.length; 
    this.current_image = this.images[this.current_image_count]; 
} 

private onSwipe(args: SwipeGestureEventData) { 
     direction = args.direction; 
    /*left to right direction = 1 
    right to left direction = 2 
    top to bottom direction = 8 
    bottom to top direction = 4*/ 


    switch (this.direction) { 
     case 1: 
      if(this.current_image_count != 0) 
       this.current_image_count --; 
      break; 

     case 2: 
      if(this.current_image_count < (this.image_lenght) -1) 
       this.current_image_count ++; 
      break; 

     case 4: 
      // code... 
      break; 

     case 8: 
      // code. 
      break; 


     default: 
      // code... 
      break; 
    } 

    this.current_image = this.images[this.current_image_count]; 
    } 
} 

pour plus d'informations sur le geste dans Nativescript angulaire refer here