CODEWITHSUNDEEP
ionic-framework
saifaldeen
saifaldeen

Reputation: 173

Ionic footer moves up when i write on mobile

I have a simple application consists of a textbox and a footer, the problem i faced that when i write in the textbox , the footer moves up like this

enter image description here

What i want is to make the footer fixed at the bottom , and the keyboard appears above the footer .

Here's the code

 <body ng-app="starter">

    <ion-pane>
  
      <ion-content>

          <input type="text" />

      </ion-content>


        <div class="bar bar-footer bar-balanced">
            <div class="title">Footer</div>
        </div>
      

      
    </ion-pane>
  </body>

Upvotes: 0

Views: 2605

Answers (2)

saifaldeen
saifaldeen

Reputation: 173

After 3 days i found the solution , YourProject\platforms\android\AndroidManifest

Set the android:windowSoftInputMode to adjustPan

Upvotes: 2

Amr.Ayoub
Amr.Ayoub

Reputation: 728

you're not implementing it right

use ion-footer-bar directive 

    <ion-content class="has-footer">
      Some content!
    </ion-content>
    <ion-footer-bar align-title="left" class="bar-assertive">
      <div class="buttons">
        <button class="button">Left Button</button>
      </div>
      <h1 class="title">Title!</h1>
      <div class="buttons" ng-click="doSomething()">
        <button class="button">Right Button</button>
      </div>
    </ion-footer-bar>

http://ionicframework.com/docs/api/directive/ionFooterBar/

Upvotes: 1

Related Questions