使NativeScript ScrollView和GridView內部的GridView一起工作（僅限iOS）

Question

我試圖創建一個佔用整個屏幕的NativeScript頁面，但如果設備屏幕較小，讓用戶滾動它即可。

我已經嘗試使用上述兩種代碼，但是在做這件事時，TextView自動高度尺寸受到了限制。

第一個代碼是所需的佈局（但是沒有滾動視圖當鍵盤打開）：

<Page class="page" 
    xmlns="http://www.nativescript.org/tns.xsd" loaded="onLoaded" navigatedTo="onNavigatingTo"> 
    <GridLayout rows="auto,*, auto, *,auto, *, auto" height="100%" columns="*, *" width="100%" height="100%"> 
     <Label class="label-bold" class='primeiros' row="0" col="0" text="O que foi positivo?" textWrap="true"></Label> 
     <Label class="label-bold" class='primeiros' row="0" col="1" text="O que foi positivo?" textWrap="true"></Label> 
     <TextView row="1" col="0" backgroundColor='gold' class='primeiros' returnPress="adicionar" textWrap="true" class="input" text="{{ lista.positivo }}"></TextView> 
     <TextView row="1" col="1" backgroundColor='gold' class='primeiros' returnPress="adicionar" textWrap="true" class="input" text="{{ lista.negativo }}"></TextView> 
     <Label class="label-bold" row="2" colSpan="2" text="Minhas ações a respeito:" textWrap="true"></Label> 
     <TextView returnPress="adicionar" row="3" colSpan="2" text="{{ lista.acoes }}"></TextView> 
     <Label class="label-bold" row="4" colSpan="2" text="Minha oração sobre esse dia:" textWrap="true"></Label> 
     <TextView returnPress="adicionar" row="5" colSpan="2" text="{{ lista.oracao }}"></TextView> 
     <Button text="Concluir Este Dia" row="6" colSpan="2" class="btn btn-primary" tap="concluirDia" /> 
    </GridLayout> 
</Page> 

在我試圖網格佈局和滾動型共同努力，本次代碼，但我沒有成功。佈局有可用性問題。

<Page class="page" 
    xmlns="http://www.nativescript.org/tns.xsd" navigatedTo="onNavigatingTo"> 
    <GridLayout row="*"> 
     <StackLayout row="0" height="100%"> 
      <ScrollView> 
       <GridLayout rows="auto,*, auto, *,auto, *, auto" height="100%" columns="*, *" width="100%" height="100%"> 
        <Label class="label-bold" class='primeiros' row="0" col="0" text="O que foi positivo?" textWrap="true"></Label> 
        <Label class="label-bold" class='primeiros' row="0" col="1" text="O que foi positivo?" textWrap="true"></Label> 
        <TextView row="1" col="0" backgroundColor='gold' class='primeiros' returnPress="adicionar" textWrap="true" class="input" text="{{ lista.positivo }}"></TextView> 
        <TextView row="1" col="1" backgroundColor='gold' class='primeiros' returnPress="adicionar" textWrap="true" class="input" text="{{ lista.negativo }}"></TextView> 
        <Label class="label-bold" row="2" colSpan="2" text="Minhas ações a respeito:" textWrap="true"></Label> 
        <TextView returnPress="adicionar" row="3" colSpan="2" text="{{ lista.acoes }}"></TextView> 
        <Label class="label-bold" row="4" colSpan="2" text="Minha oração sobre esse dia:" textWrap="true"></Label> 
        <TextView returnPress="adicionar" row="5" colSpan="2" text="{{ lista.oracao }}"></TextView> 
        <Button text="Concluir Este Dia" row="6" colSpan="2" class="btn btn-primary" tap="concluirDia" /> 
       </GridLayout> 
      </ScrollView> 
    </StackLayout> 
</GridLayout> 

真正的問題在iOS上是當鍵盤打開，沒有滾動。所以我需要滾動視圖，以便用戶可以處理屏幕上的所有TextView。

Answer 1

發生這種情況是因爲鍵盤與您的頁面內容重疊。你可以做的是在GridLayout下添加一個像StackLayout這樣初始高度爲0的元素，並在打開時分配鍵盤的高度。這個link解釋瞭如何獲得iOS上鍵盤的高度。 併爲您的網頁代碼，我會做這樣的事情：

<Page class="page" xmlns="http://www.nativescript.org/tns.xsd" navigatedTo="onNavigatingTo"> 
<ScrollView> 
    <GridLayout rows="auto,*, auto, *,auto, *, auto" height="100%" columns="*, *" width="100%"> 
    <Label class="label-bold" class='primeiros' row="0" col="0" text="O que foi positivo?" textWrap="true"></Label> 
    <Label class="label-bold" class='primeiros' row="0" col="1" text="O que foi positivo?" textWrap="true"></Label> 
    <TextView row="1" col="0" backgroundColor='gold' class='primeiros' returnPress="adicionar" textWrap="true" class="input" 
     text="{{ lista.positivo }}"></TextView> 
    <TextView row="1" col="1" backgroundColor='gold' class='primeiros' returnPress="adicionar" textWrap="true" class="input" 
     text="{{ lista.negativo }}"></TextView> 
    <Label class="label-bold" row="2" colSpan="2" text="Minhas ações a respeito:" textWrap="true"></Label> 
    <TextView returnPress="adicionar" row="3" colSpan="2" text="{{ lista.acoes }}"></TextView> 
    <Label class="label-bold" row="4" colSpan="2" text="Minha oração sobre esse dia:" textWrap="true"></Label> 
    <TextView returnPress="adicionar" row="5" colSpan="2" text="{{ lista.oracao }}"></TextView> 
    <Button text="Concluir Este Dia" row="6" colSpan="2" class="btn btn-primary" tap="concluirDia" /> 
    </GridLayout> 
    <StackLayout [height]="keyboardHeight" width="100%"></StackLayout> 
</ScrollView> 

讓我們知道，如果您有更多問題