2017-02-18 6 views
0

전체 화면을 사용하는 NativeScript 페이지를 만들려고했지만 장치에 작은 화면이있는 경우 스크롤하도록했습니다.NativeScript 만들기 GridLayout 내의 ScrollView 및 TextView가 함께 작동합니다 (iOS에만 해당)

위의 두 코드를 모두 시도했지만 TextView 자동 높이 크기가 제한되었습니다.

첫 번째 코드는 원하는 레이아웃입니다 (하지만 키보드가 열려있을 때 더있는 ScrollView가 없다) : 나는 GridLayout과하고있는 ScrollView가 함께 작업에 노력이 두 번째 코드에

<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> 

,하지만 난 어떤 성공도 없었다. 레이아웃에는 유용성 문제가 있습니다. iOS에서

진짜 문제

<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> 

키보드가 열려있을 때, 더 스크롤이 없다는 것입니다. 그래서 사용자가 화면의 모든 TextView를 처리 할 수 ​​있도록 scrollview가 필요합니다.

답변

2

키보드가 페이지 콘텐츠에 겹쳐서 발생합니다. 당신이 할 수있는 것은 GridLayout 아래에 초기 높이가 0 인 StackLayout 같은 다른 요소를 추가하고 그것을 열 때 키보드의 높이를 할당하는 것입니다. 이 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> 

는 당신이 더 많은 질문이 있으면 알려 주시기 바랍니다