Nativescript не обнаруживает событие свайпа в ScrollView - PullRequest
Новая
       8

Nativescript не обнаруживает событие свайпа в ScrollView

0 голосов
/ 01 октября 2018

Я пытаюсь создать приложение, которое имеет несколько кнопок (каждая реагирует на нажатие) на отдельной странице, доступ к каждой странице должен быть проведен одним прикосновением.С помощью следующего кода я получаю кнопки для реагирования на нажатия, но событие удара не срабатывает надежно (оно работает после нажатия на нижнюю метку)

page1.xml 

<Page actionBarHidden="true" loaded="loaded" xmlns="http://schemas.nativescript.org/tns.xsd">
    <ScrollView orientation="horizontal" swipe="onSwipe">
        <GridLayout width="100%" height="100%" class="gridClass" rows="*, *, *, *, auto" columns="*, *, *, *" row="0" col="0">
            <Image src="~/images/btn1.png" row="0" col="0" tap="onTap" />
            <Image src="~/images/btn2.png" row="0" col="1" tap="onTap" />
            <Image src="~/images/btn3.png" row="0" col="2" tap="onTap" />
            <Image src="~/images/btn4.png" row="0" col="3" tap="onTap" />

            <Image src="~/images/btn5.png" row="1" col="0" tap="onTap" />
            <Image src="~/images/btn6.png" row="1" col="1" tap="onTap" />
            <Image src="~/images/btn7.png" row="1" col="2" tap="onTap" />
            <Image src="~/images/btn8.png" row="1" col="3" tap="onTap" />

            <Image src="~/images/btn9.png" row="2" col="0" tap="onTap" />
            <Image src="~/images/btn10.png" row="2" col="1" tap="onTap" />
            <Image src="~/images/btn11.png" row="2" col="2" tap="onTap" />
            <Image src="~/images/btn12.png" row="2" col="3" tap="onTap" />

            <Image src="~/images/btn13.png" row="3" col="0" tap="onTap" />
            <Image src="~/images/btn14.png" row="3" col="1" tap="onTap" />
            <Image src="~/images/btn15.png" row="3" col="2" tap="onTap" />
            <Image src="~/images/btn16.png" row="3" col="3" tap="onTap" />

            <Label id="banner" text="ad placeholder" row="4" colSpan="4" height="70" backgroundColor="blue" />
        </GridLayout>
    </ScrollView>
</Page>

page1.js 

function loaded(args) {
  // do something on page load
}

function playAudio(args) {
    // play some audio
}

function onTap(args) {
   playAudio(args)
}

function onSwipe(args) {
    // transition to next page
}

exports.onTap = onTap;
exports.onSwipe = onSwipe;
exports.loaded = loaded;

Обновление

В итоге я использовал nativescript-слайды Плагин для решения проблемы, и он работает хорошо, спасибо за предложения.

Ответы [ 3 ]

0 голосов
/ 02 октября 2018

Самый простой способ иметь жест смахивания без головной боли - это TabView.Да, это не будут отдельные страницы.Если вам нужно хранить вещи отдельно, вы всегда можете поместить содержимое каждой вкладки в отдельные каталоги и импортировать их как пользовательские компоненты.

0 голосов
/ 02 октября 2018

Если вы открыты для использования TabView, здесь - это то, как вы можете скрыть TabBar в iOS. 

export function onLoaded(args: EventData) {
  const tabView = <TabView>args.object,
   tabBarController = tabView.ios;

  if (tabBarController) {
    setTimeout(() => {
     const frame = tabBarController.tabBar.frame;
     tabBarController.tabBar.frame = CGRectOffset(frame, 0, frame.size.height);
    }, 100);
   }
}
0 голосов
/ 01 октября 2018

Я вообще не вижу необходимости в ScrollView, GridLayout предназначен для получения доступной ширины и высоты, поэтому вам не нужно устанавливать высоту.Удалите их и попробуйте прикрепить событие смахивания к GridLayout.

...