tjvantoll / nativescript-IQKeyboardManager

NativeScript wrapper for the popular IQKeyboardManager iOS framework
MIT License
100 stars 20 forks source link

Content move to top #51

Closed tahir-jamil closed 5 years ago

tahir-jamil commented 5 years ago

Hey i have use the iqkeyboard and its works fine as expected for the first time and when i close the keyboard and open again then it moves the content to the top

hear is the sample

https://www.youtube.com/watch?v=ZPQEZIsk5ng

Also the content is translate towards Y i only want to float the bottom bar not the page

hear is my layout


<GridLayout class="page page-content" rows="3*,auto">

  <GridLayout rows="" columns="" class="alignList">
    <GridLayout tkExampleTitle tkToggleNavButton>
      <RadListView [items]="items" [itemTemplateSelector]="templateSelector">
        <ng-template tkListItemTemplate let-item='item'>
        </ng-template>
        <ng-template tkTemplateKey="sender" let-item="item">
          <GridLayout width="100%" rows="*" columns="auto,auto" horizontalAlignment="center">
            <Image verticalAlignment="bottom" src="https://cdn1.iconfinder.com/data/icons/user-pictures/100/female1-512.png"
              class="img-size m-b-10" stretch="aspectFit"></Image>
            <Label col="1" width="80%" [text]="item.text" class="message-padding sender" textWrap="true"></Label>
          </GridLayout>
        </ng-template>
        <ng-template tkTemplateKey="receiver" let-item="item">
          <GridLayout width="100%" rows="*" columns="auto,auto" horizontalAlignment="center">
            <Image verticalAlignment="bottom" col="1" src="https://cdn1.iconfinder.com/data/icons/user-pictures/100/female1-512.png"
              class="img-size m-b-10" stretch="aspectFit"></Image>
            <Label col="0" width="80%" [text]="item.text" class="message-padding receiver" textWrap="true"></Label>
          </GridLayout>
        </ng-template>
      </RadListView>
    </GridLayout>
  </GridLayout>

> hear is the textField layout which i want on top of layout

  <GridLayout row="1" verticalAlignment="bottom" rows="*" columns="*,auto,auto" class="bottomtextfield" [height]="bottomTextField">
    <GridLayout rows="*" columns="*">
      <TextField hint="this is the text" class="p-l-50 textfield" text=""></TextField>
      <GridLayout class="circleSetting m-l-8" verticalAlignment="middle" horizontalAlignment="left" [width]="iconHeight + 10"
        [height]="iconHeight + 10">
        <Image src="res://machine" verticalAlignment="middle" horizontalAlignment="center" stretch="aspectFit" [width]="iconHeight"
          [height]="iconHeight"></Image>
      </GridLayout>
      <Label text="&#xe145;" verticalAlignment="middle" horizontalAlignment="right" class="md m-l-15 m-r-10  f-24 colomuted "></Label>
    </GridLayout>

    <Image src="res://upload" rowSpan="2" class="m-l-10 m-r-10" col="1" stretch="aspectFit" [width]="iconHeight"
      [height]="iconHeight"></Image>
    <Image src="res://send" rowSpan="2" (tap)="pushNewMessage()" class="m-l-5 m-r-15" col="2" stretch="aspectFit"
      [width]="iconHeight" [height]="iconHeight"></Image>

  </GridLayout>
</GridLayout>
tahir-jamil commented 5 years ago

its a nativescript angular issue please visit https://github.com/NativeScript/nativescript-angular/issues/1705

tahir-jamil commented 5 years ago

Hey gyes @Nickllive @simonettoa I have fround the fix

It happened when we use text field in side drawer on the root

So i just place a gridLayout around the side drawer and its fixed