Перемещение списка элементов по вертикали - PullRequest
Новая
       1

Перемещение списка элементов по вертикали

0 голосов
/ 03 июня 2019

У меня есть карта и список предметов внизу. Я хочу переместить список вверх (сохраняя положение карты), пока пользователь не достигнет последнего элемента списка. В этом случае список больше не должен двигаться вверх.

Проблема в том, что список продолжает двигаться вверх даже после того, как последний элемент был показан на белом фоне.

шаблон: 

<GridLayout rows="*, *, 0" columns="*"> 
<MapView row="0" col="0"> ...
<GridLayout #list rows="*, 0" columns="*" #list row="1" col="0">
    <GridLayout row="0" col="0" class="m-15"
        rows="..." (pan)="onPan($event)">
        ...
    </GridLayout>
</GridLayout>
<GridLayout #ref row="2" col="0">...

component.ts 

onPan(args: PanGestureEventData) {
    switch (args.state) {
      case 1:
        break;
      case 2:
        const diff = this.ref.nativeElement.getLocationRelativeTo(this.list.nativeElement);
        if (diff > 1400) return; // I used 1400 seems based on various devices sizes, it seems like a good number. 
        this.dragContainer.translateY += args.deltaY - this.prevDeltaY;
        this.prevDeltaY = args.deltaY;

        break;
      case 3:
      default:
        break;
    }
}

** Ожидаемый: ** - Я ожидаю, что когда будет показан последний элемент в списке, список больше не сможет двигаться вверх

** Фактический: ** - Список продолжает двигаться вверх, оставляя белый фон.

Я создал демо на нативной игровой площадке здесь https://play.nativescript.org/?template=play-ng&id=rB4H2M

1 Ответ

0 голосов
/ 11 июня 2019

Я наконец смог найти пример, который в основном делает то, что мне нужно. Эффект, которого я пытался достичь, называется Parallax, и вот пример демонстрационных примеров Nativescript

https://play.nativescript.org/?template=play-ng&id=b9hyJh&v=2

...