Кнопки iOS становятся неактивными после создания плавающего макета - PullRequest
Новая
       2

Кнопки iOS становятся неактивными после создания плавающего макета

0 голосов
/ 26 апреля 2019

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

Я перепробовал несколько способов, и все они с одинаковым результатом, кнопка iOS стала неактивной без причины.

Итак, у меня есть AbsoluteLayout внутри, у меня GridLayout зафиксировано сверху как пользовательская панель действий, а затем ScrollView со 100% шириной и высотой, внутри прокрутки есть некоторый контент. Проблема в том, что, как только я помещаю кнопку в GridLayout, она становится недоступной только для iOS, потому что в Android работает просто отлично.

Позвольте мне показать вам мой пример с кодом: 

<Page actionBarHidden="true">
        <AbsoluteLayout>
            <GridLayout rows="50, *" backgroundColor="red" top="0" left="0" height="50" id="bar">
                <Button text="click" @tap="goToDetailPage" id="buttondelsous"></Button>
            </GridLayout>
            <ScrollView backgroundColor="blue" width="100%" height="100%" top="0" id="content">
                <WrapLayout>
                    <StackLayout>
                        <Label text="this is behind"></Label>
                    </StackLayout>
                </WrapLayout>
            </ScrollView>
        </AbsoluteLayout>
    </Page>

Что касается стилей, заставляющих пользовательскую панель действий находиться перед просмотром прокрутки, то у меня есть: 

#bar {
        z-index: 5;
        width: 100%;
    }

    #content {
        z-index: 2;
    }

На Android это выглядит так:

Android example

Точно так же на iOS, но кнопка «Нажать» не работает, как будто она была позади чего-то ..

Есть идеи о том, как исправить тот или иной подход, чтобы получить то, что мне нужно? Помните, что за действием я должен иметь возможность размещать контент (например, фоновое изображение, которое я не хочу размещать в самом теге Page, но в другом макете)

Спасибо!

1 Ответ

2 голосов
/ 26 апреля 2019

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

должно выглядеть как 

<Page actionBarHidden="true">
  <AbsoluteLayout>
    <ScrollView backgroundColor="blue" width="100%" height="100%" top="0" id="content">
      <WrapLayout>
        <StackLayout>
          <Label text="this is behind"></Label>
        </StackLayout>
      </WrapLayout>
    </ScrollView>
    <!-- I'm listed second so I will be on top even though I have row="0" -->
    <GridLayout rows="50, *" backgroundColor="red" top="0" left="0" height="50" id="bar">
      <Button text="click" @tap="goToDetailPage" id="buttondelsous"/>
    </GridLayout>
  </AbsoluteLayout>
</Page>
...