菜鸟教程小白 发表于 2022-12-12 14:40:03

ios - ionic3 允许键盘向上推 View


                                            <p><p>我使用的是 Ionic 版本 3.9.2</p>

<p>我想在 iOS 上将 View 向上推,这样我的页脚就不会被隐藏。</p>

<p> <a href="/image/Sj7vn.png" rel="noreferrer noopener nofollow"><img src="/image/Sj7vn.png" alt="enter image description here"/></a> </p>

<p>不想让键盘盖住我的页脚</p>

<p> <a href="/image/1Q2HI.png" rel="noreferrer noopener nofollow"><img src="/image/1Q2HI.png" alt="enter image description here"/></a> </p>

<p>在 Android 上,我可以使用 android:windowSoftInputMode="adjustResize"来神奇地缩小 View 。有什么办法可以做到这一点?
<a href="/image/PhmCl.png" rel="noreferrer noopener nofollow"><img src="/image/PhmCl.png" alt="enter image description here"/></a> </p></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p>您可以使用 <a href="https://ionicframework.com/docs/native/keyboard/" rel="noreferrer noopener nofollow">Ionic Keyboard Plugin</a> 的 <code>onKeyboardShow()</code> 和 <code>onKeyboardHide()</code>知道何时调整屏幕大小以排除键盘。</p>

<p>尝试进行以下更改,看看它是否符合您的要求。您需要调整 keyboard_height 和 easing 才能正常工作</p>

<p><strong>app.html</strong></p>

<pre><code>&lt;ion-nav .... =&#34;nav_style&#34;&gt;&lt;/ion-nav&gt;
</code></pre>

<p><strong>app.component.ts</strong></p>

<pre><code>keyboard_height: number = 200;
nav_style: string = null;

constructor(private keyboard: Keyboard, private platform: Platform, ...){
    if(this.platform.is(&#39;ios&#39;)){
      this.keyboard.onKeyboardShow(() =&gt; {
            this.nav_style = &#39;calc(100%-&#39; + this.keyboard_height + &#39;px)&#39;;
      });
      this.keyboard.onKeyboardHide(() =&gt; {
            this.nav_style = null;
      });
    }
}
</code></pre>

<p><strong>app.scss</strong></p>

<pre><code>ion-nav{
    transition: height 0.2s ease-out
}
</code></pre></p>
                                   
                                                <p style="font-size: 20px;">关于ios - ionic3 允许键盘向上推 View ,我们在Stack Overflow上找到一个类似的问题:
                                                        <a href="https://stackoverflow.com/questions/50635830/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/50635830/
                                                        </a>
                                                </p>
                                       
页: [1]
查看完整版本: ios - ionic3 允许键盘向上推 View