Ionic-framework: إخفاء علامات التبويب تلقائيًا عندما تكون لوحة المفاتيح مفتوحة

نعم ، أفترض أنك تعمل بنظام Android. مشكلة لوحة المفاتيح القديمة ...

رأيت حديثًا على PhoneGap من tlancina حول لوحة المفاتيح ويبدو أنها مشكلة صعبة جدًا بشكل عام!
يمكنني أن أؤكد أن شريط علامة التبويب السفلي يتم دفعه لأعلى عند فتح لوحة المفاتيح في تطبيقي تحت Android أيضًا. ولكن الأسوأ من ذلك هو تغطية حقول الإدخال القريبة من القاع. قال تيم ، يجب على المرء أن يحاول تجنب ذلك ، ولكن للأسف هناك قوائم طويلة للتعديل في مشروعي.
لقد أجلت موضوع لوحة المفاتيح بالكامل للانتظار وأرى كيف يتم تشغيله باللغة الأيونية.

إلى جانب ذلك ، tlancina ، هل يوجد برنامج تعليمي لأفضل الممارسات حول استخدام لوحة المفاتيح باللغة الأيونية (دمج المكون الإضافي للوحة المفاتيح الأيونية ، معالجات الأحداث init / setting)؟

أنا أواجه هذه المشكلة أيضًا.

نحن نواجه نفس المشكلة في مشروعنا أيضًا. أي خطط بخصوص هذا؟

مرحبًا يا رفاق ، أشعر أيضًا بالألم - هل من أخبار بأي فرصة؟

تحتاج أيضًا إلى هذه الميزة الرائعة ، وعلامات التبويب ، وقد يكون من الجيد أيضًا إخفاء رأس الصفحة حتى تتمكن من إخفاءها.

@ jgw96 لقد لاحظت أنك أضفت تسمية التحسين على هذا. نظرًا لأن التطبيقات الأصلية لا تتصرف بنفس الطريقة (تحريك علامات التبويب فوق لوحة المفاتيح) كما أن علامات التبويب تقصر أيضًا محتوى المحتوى الفعلي على سطرين فقط ، خاصة على الهواتف الصغيرة ، ألا ينبغي اعتبار ذلك مشكلة أكثر خطورة؟

بالنسبة للأشخاص الذين يبحثون عن حل مؤقت ، فإليك ما فعلته:

منشئ المكون:

platform.ready().then(() => {
            Keyboard.onKeyboardShow().subscribe(() => {
                document.body.classList.add('keyboard-is-open');
            });

            Keyboard.onKeyboardHide().subscribe(() => {
                document.body.classList.remove('keyboard-is-open');
            });
});

داخل CSS:

body.keyboard-is-open ion-tabbar {
  display: none;
}

body.keyboard-is-open scroll-content {
  margin-bottom: 0 !important;
}

لن يعمل هذا إذا كان لديك عدة علامات تبويب على الصفحة ، لكن أعتقد أنه يمكنك تحديدها باستخدام CSS الخاص بك مباشرةً.

أقوم حاليًا بتشغيل Ionic beta 11

أي تحديث على هذا؟

@ bvx89 شكرا.
من أجل أولئك الذين لديهم Rc0 هناك تغيير طفيف في css

body.keyboard-is-open .tabbar {
  display: none;
}

body.keyboard-is-open .scroll-content {
  margin-bottom: 0 !important;
}

لا يوجد حل رسمي بعد ذلك

فقط لذكر أن تمكين وضع ملء الشاشة على Android يعمل أيضًا على إصلاح هذه المشكلة بالنسبة لي.
يمكن القيام بذلك عن طريق الإعداد
<preference name="Fullscreen" value="true" />
في config.xml ، وإضافة cordova-plugin-fullscreen اختياريًا إذا كنت تستخدم نظام android android أقدم من v5.0.0.

هل سيتم إصلاح هذا في الإصدار التالي إلى جانب بقية مشكلات لوحة المفاتيح التي سيتم إصلاحها (اقرأ شيئًا يوضح ذلك حول مشكلات لوحة المفاتيح في سلسلة رسائل أخرى) أو هل وقع هذا بين الشقوق؟

تضمين التغريدة
لدي نفس المشكلة ، هل سيتم إصلاح هذا في الإصدار التالي؟

إنه لا يعمل بالنسبة لي في RC3.
لم يتم إطلاق onKeyboardShow () مطلقًا ...

+1 ， لدي نفس المشكلة.

كوردوفا CLI: 6.3.1
إصدار أيوني CLI: 2.1.8.0
إصدار ليب التطبيق الأيوني: 2.1.4
إصدار iOS: غير مثبت
إصدار ios-sim: غير مثبت
نظام التشغيل: Windows 8.1
إصدار العقدة: v6.4.0
إصدار Xcode: غير مثبت

لدي هذه المشكلة نفسها ، والحل البديل الذي نشره RaymondAtivie لا يعمل بشكل صحيح تمامًا. لم تعد علامات التبويب مرئية ، ولكن يبدو أن هناك حدًا علويًا لا يزال مرئيًا. هل يوجد شخص آخر لديه نفس المشكلة؟ لقد حاولت الإضافة
box-shadow: none; border-top: none;
ولا يزال ينتهي مع نفس الحد العلوي المرئي من شريط التبويب. أيه أفكار؟

لقد قمت بحل هذه المشكلة عن طريق تحويل ion-content option fullscreen="true"
ووضع نمط مخفي للطابار

      var tabbars =     document.getElementsByClassName('tabbar');
      for(var i=0; i<tabbars.length; i++) {
        var node = <HTMLElement>tabbars[i];
        node.style.display = hide === true && 'none' || 'block';
      }

لقد جربت هذا ولا يزال يظهر نفس الحد العلوي على الرغم من تعيين شريط tab على عرض false.

تضمين التغريدة
<ion-header *ngIf="isShowHeader()">

توجد علامة التبويب الأيونية في الجزء السفلي ، لذا فإن إخفاء الرأس لا يؤثر عليها كثيرًا. لقد أرفقت لقطة شاشة لما أتحدث عنه. تظهر لوحة المفاتيح ، وعلامات التبويب الموجودة في الأسفل مخفية ، ولكن لا يزال يظهر أن هناك بعض السطر العلوي الذي يبقى في مكانه إذا قمت بالتمرير حوله.

يبدو هذا الشريط وكأنه جزء من النموذج
هل يمكنك مشاركة كود html الخاص بك؟

برزت في النهاية. لم يكن لدي ما يدعو للقلق بشأن رأس نظرًا لأن علامات التبويب الخاصة بي موجودة في الأسفل ، لكنني كنت بحاجة إلى النظر إلى التذييل (duh!). لقد قمت بتطبيق فئة شرطية على التذييل لإخفائها إذا كان لدى الجسم فئة لوحة المفاتيح المفتوحة و BAM ، مرة أخرى في العمل. شكرا للمساعدة!

تضمين التغريدة

هل ترغب في رؤية هذه الميزة أيضًا.
أعتقد أيضًا أن ion-footer يجب أن يدعم الرؤية عند فتح / إغلاق لوحة المفاتيح

لقد قمت بإصلاح بسيط (بالطبع ليس مثاليًا). .scroll-content له margin-bottom من 56px ، نفس الارتفاع به علامات التبويب. أتحقق من لوحة المفاتيح:

public keyboardCheck() {
        return this.keyboard.isOpen();
}

ثم قم بإرفاق هذه الفئة بـ ion-content ، أحد الأبوين لـ .scroll-content :

.keyboard-open .scroll-content {
    margin-bottom: 0px !important;
}

وأضف هذا إلى ion-content :

<ion-content padding [ngClass]="{'keyboard-open': keyboardCheck()}">

لقد قمت أيضًا بإخفاء علامات التبويب عندما تكون لوحة المفاتيح مفتوحة باستخدام نفس الطريقة في tabs.html :

<ion-tabs [ngClass]="{'remove-tabs': keyboardCheck()}">

.remove-tabs .tabbar {
    display: none;
}

فعلت هذا فقط للصفحة التي كنت بحاجة إلى الإصلاح.

يعمل على كل من iOS و Android.

تم حلها

هذا هو الحل المناسب باستثناء المغلق.

""
استيراد {مكون} من "@ angular / core" ؛
استيراد {لوحة المفاتيح} من "اللغة الأيونية"
استيراد {HomePage} من '../home/home' ؛
استيراد {AboutPage} من '../about/about' ؛
استيراد {ContactPage} من "../contact/contact" ؛

@مكون({
templateUrl: "tabs.html"
})
تصدير فئة TabsPage {
// هذا يخبر مكون علامات التبويب بالصفحات
// يجب أن تكون الصفحة الجذر لكل علامة تبويب
tab1Root: أي = الصفحة الرئيسية ؛
tab2Root: أي = AboutPage ؛
tab3Root: any = ContactPage؛
valueforngif = صحيح ؛

المُنشئ (لوحة المفاتيح العامة: لوحة المفاتيح) {}
ionViewDidEnter () {
Keyboard.onKeyboardShow (). Subscribe (() => {this.valueforngif = false})
Keyboard.onKeyboardHide (). subscribe (() => {this.valueforngif = true})
}}

this my tabs.html

    ```
 <ion-tabs *ngIf="valueforngif">
  <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home"></ion-tab>
  <ion-tab [root]="tab2Root" tabTitle="About" tabIcon="information-circle" [tabsHideOnSubPages]="true"></ion-tab>
  <ion-tab [root]="tab3Root" tabTitle="Contact" tabIcon="contacts"></ion-tab>
</ion-tabs>

لطيف @ efnan34 ، على الرغم من أنك لا تحتاج إلى توفيره في المنشئ.

يتسبب هذا في إغلاق لوحة المفاتيح تلقائيًا عند فتحها ... هل هذا بسبب عودة التركيز إلى علامات التبويب لإخفائها مما يؤدي بدوره إلى إغلاق لوحة المفاتيح؟

ionViewDidEnter(){
    Keyboard.onKeyboardShow().subscribe(()=>{this.valueforngif=false})
    Keyboard.onKeyboardHide().subscribe(()=>{this.valueforngif=true})
}

@ bvx89 الحل الخاص بك هو الوحيد الذي يمكنني الحصول عليه للعمل مع Ionic 2.1.0. هناك خطأ تم تسجيله من أجل أيوني أصلي ولم يتم اكتشاف التغييرات ، لذا لم تنجح الحلول الأخرى بالنسبة لي. نتطلع إلى إصلاح رسمي لهذا

أواجه نفس المشكلة @ كيلمور
الا يوجد حل رسمي لهذا بعد؟

مرحبا
يعمل الحل أعلاه على Ionic 2.1.0 أيضًا ولكن يمكن استخدام Attrb نتيجة أفضل [مخفي] بدلاً من * ngif. أنا باستخدام هذا الحل في مشروعي ، إنه يعمل بشكل جيد

طاب يومك

أعلاه سوف يتسبب في حدوث وميض على بعض أجهزة Android وهو حقًا خيار سيء.

هذا سوف يعمل .. جرب هذا

var originalHeight = document.documentElement.clientHeight ؛
var originalWidth = document.documentElement.clientWidth ؛
$ (window) .resize (function () {
// التحكم في مفتاح الوضع الأفقي / العمودي
إذا (document.documentElement.clientHeight == originalWidth &&
document.documentElement.clientWidth == originalHeight) {
originalHeight = document.documentElement.clientHeight ؛
originalWidth = document.documentElement.clientWidth ؛
}
// تحقق مما إذا كان الارتفاع المتاح أصغر (تظهر لوحة المفاتيح) حتى نخفي التذييل.
if (document.documentElement.clientHeight <originalHeight) {
$ ('. footer'). إخفاء () ؛
} آخر {
$ ('. footer'). show ()؛
}
}) ؛

هذه هي طريقة حل هذه المشكلة:

tab.ts

import { Component, ElementRef, Renderer, ViewChild } from '@angular/core';
import { Events, Tabs } from 'ionic-angular';

import { AboutPage } from '../about/about';
import { ContactPage } from '../contact/contact';
import { HomePage } from '../home/home';

@Component({
  templateUrl: 'tabs.html'
})
export class TabsPage {
  @ViewChild('myTabs') tabRef: Tabs;
  mb: any;
  tab1Root = HomePage;
  tab2Root = AboutPage;
  tab3Root = ContactPage;

  constructor(private elementRef: ElementRef, private renderer: Renderer, private event: Events) {

  }
  ionViewDidLoad() {
    let tabs = this.queryElement(this.elementRef.nativeElement, '.tabbar');
    this.event.subscribe('hideTabs', () => {
      this.renderer.setElementStyle(tabs, 'display', 'none');
      let SelectTab = this.tabRef.getSelected()._elementRef.nativeElement;
      let content = this.queryElement(SelectTab, '.scroll-content');
      this.mb = content.style['margin-bottom'];
      this.renderer.setElementStyle(content, 'margin-bottom', '0')
    });
    this.event.subscribe('showTabs', () => {
      this.renderer.setElementStyle(tabs, 'display', '');
      let SelectTab = this.tabRef.getSelected()._elementRef.nativeElement;
      let content = this.queryElement(SelectTab, '.scroll-content');
      this.renderer.setElementStyle(content, 'margin-bottom', this.mb)
    })
  }
  queryElement(elem: HTMLElement, q: string): HTMLElement {
    return <HTMLElement>elem.querySelector(q);
  }
}

page.ts محددة

import { Component } from '@angular/core';
import { NavController, Events } from 'ionic-angular';

import { Keyboard } from '@ionic-native/keyboard';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  constructor(public navCtrl: NavController, private event: Events, private keyboard: Keyboard) {

  }
  ionViewDidLoad() {
    this.keyboard.onKeyboardShow().subscribe(() => this.event.publish('hideTabs'));
    this.keyboard.onKeyboardHide().subscribe(() => this.event.publish('showTabs'));
  }
}

الاعتمادات ل dPary

آمل حقًا أن تقوموا جميعًا باختبار مناسب للجهاز لأن كل هذه الحلول التي تخفي علامات التبويب تتسبب في إعادة العرض على الأجهزة مما يؤدي إلى وميض مرئي للغاية وفي بعض الحالات تعطل. على أي حال ، كل التوفيق.

نعم ، أنا مع cozzbie ، كل هذا مجرد بعض الاختراقات. نحن بحاجة إلى حل رسمي حقيقي من قبلmanucorporat فريقionitron

+1 نحن بحاجة إلى حل رسمي ، ولا يعد أي من هذه الإصلاحات مثاليًا للاستخدام الإنتاجي.

الإصدار الحالي من الأيوني يفعل ذلك من تلقاء نفسه

21 Nis 2017 17:12 Tarihinde "Ruben Callewaert" [email protected]
يزدي:

+1 نحن بحاجة إلى حل رسمي ، ولا يعد أيًا من هذه الإصلاحات مثاليًا
استخدام الإنتاج.

-
أنت تتلقى هذا لأنه تم ذكرك.
قم بالرد على هذا البريد الإلكتروني مباشرة ، وقم بعرضه على GitHub
https://github.com/driftyco/ionic/issues/7047#issuecomment-296201358 ،
أو كتم الخيط
https://github.com/notifications/unsubscribe-auth/AVskkCpgFZZRbrd56ILc5nIPZICRTclUks5ryLlCgaJpZM4I-H1S
.

هل هذا حقا يعتني به. ما زلت أرى شريط علامات التبويب. تشغيل أحدث إصدار كما في هذه الكتابة الأيونية الزاوي 3.2.0.

كان يعمل بشكل جيد للغاية مع الإصدار 2.xx ولكن الآن قمت بفحص الإصدار 3.xx
هناك أشياء خاطئة. لا تخفي ما تريده على الشاشة حتى
الكتابة على لوحة المفاتيح. للأسف لدينا حل آخر أو خفضت
الإصدار الأيوني الخاص بك لأي 2.xx

12 مايو 2017 ÖÖ 3:32 tarihinde "vazad28" [email protected] yazdı:

هل هذا حقا يعتني به. ما زلت أرى شريط علامات التبويب. تشغيل أحدث
الإصدار كما في هذه الكتابة 3.2.0 الزاوية الأيونية.

-
أنت تتلقى هذا لأنه تم ذكرك.
قم بالرد على هذا البريد الإلكتروني مباشرة ، وقم بعرضه على GitHub
https://github.com/driftyco/ionic/issues/7047#issuecomment-300952251 ،
أو كتم الخيط
https://github.com/notifications/unsubscribe-auth/AVskkNkEdzsMkkrhGW0l9OUW2BKly-PSks5r46ingaJpZM4I-H1S
.

مجرد فكرة هنا. يؤدي إخفاء علامات التبويب باستخدام أي من الاختراقات المذكورة أعلاه إلى تحديث العرض على الأجهزة ، فما رأيك في إسقاط ارتفاع منطقة علامة التبويب إلى الصفر بدلاً من الاختباء؟ مجرد فكرة ولكن أنا منخرط للغاية الآن لتجربتها.

+1 لإصلاح رسمي! تتسبب أساليب " display: none " في حدوث وميض غير مقبول ، وتظهر علامات التبويب مرة واحدة ثم تختفي ... (أي شخص لديه أي أفكار حول كيفية التخلص من الوميض؟ لست فوق الاختراق إذا كان يبدو جيدًا للمستخدم)

أي شيء جديد بخصوص هذه القضية؟ ما زلت أنتظر إصلاحًا رسميًا قبل أن أفقد الأمل وأبدأ في تنفيذ شيء من شأنه أن يؤثر على جودة واجهة المستخدم

patrickmcd ، سيد الإبهام ، أتساءل فقط هل حاولت الإقلاع عن هذه العادة؟

@ viking2917 ، يمكنك تجربة الاختراق الذي اقترحته ومحاولة إجبار ارتفاع علامات التبويب على الصفر. التي يمكن أن تعمل. لم أجربها حتى الآن رغم ذلك.

لسوء الحظ ، سيؤدي إخفاء علامات التبويب باستخدام CSS إلى حدوث عدد من المشكلات. يقوم Ionic بحساب بعض القيم مثل الهامش على ion-content ويأخذ في الاعتبار وجود علامات التبويب (المخفية).

لقد اضطررنا إلى إزالة الحل بسبب حدوث بعض مشاكل تحديد الموضع مع المكونات الأخرى.

@ Khalid-Nowaf أنا ببساطة لا أقدر التعليقات غير المرغوب فيها التي تقضي على الوقت بعيدًا عن فريق Ionic وبعيدًا عن ~ 2000 مراقب لهذا الريبو.

تعليق @ Floyd1256 غير مرغوب فيه بريد عشوائي. لا يضيف شيئًا إلى المحادثة. إنه مجرد تعليق آخر "زائد واحد / هل نحن موجودون حتى الآن" والذي يعمل فقط على ملء البريد الوارد لدينا.

إن أصواتي المعارضة هي محاولات لدفع الآخرين نحو سلوك أكثر مراعاة. قبل التعليق ، يجب أن نتذكر أننا نجري محادثة مع حوالي 2000 شخص وقتهم ثمين . لا ينبغي أن نتعامل مع هذه المساحة بشكل متقلب كما لو كانت دردشة شخصية مع الأصدقاء. يجب أن نسأل أنفسنا ما إذا كان تعليقنا سيساعد الآخرين أو يعيقهم ، سواء كان يدفع بالمحادثة أم مجرد ضجيج ، وما إذا كان من الضروري حقًا أن نقول أو يمكن التعبير عنه بشكل أفضل من خلال رد فعل Github ، وما إذا كان سيسرع أو يبطئ التنمية.

يبدو أن هناك فرعًا يعالج هذه المشكلة مع البعض الآخر https://github.com/ionic-team/ionic/tree/keyboard-fixes
هذا الالتزام على وجه الخصوص يبدو واعدًا جدًا

ليس لدي الشجاعة للذهاب أكثر من الأيونية v1.

أقوم بإجراء هذا التصحيح (أضع وحدة تحكم في العرض المتأثر ، حيث إن لدي واحدًا فقط مع هذا التحرير والسرد).

/ * HACK Al mostrar el teclado el tabbar se pone encima de él en android /var bottom_stored = 0 ؛window.addEventListener ('native.keyboardshow' ، الوظيفة (هـ) {angular.element (document.getElementsByClassName ('tab-nav')). addClass ('إخفاء') ؛bottom_stored = angular.element (document.getElementsByClassName ('has-tabs')). css ('bottom') ؛angular.element (document.getElementsByClassName ('has-tabs')). css ('bottom'، '0px')؛النطاق $.}) ؛window.addEventListener ('native.keyboardhide' ، الوظيفة (هـ) {angular.element (document.getElementsByClassName ('tab-nav')). removeClass ('إخفاء') ؛angular.element (document.getElementsByClassName ('has-tabs')). css ('bottom'، bottom_stored) ؛النطاق $.}) ؛/ هاك * /

هذا يعمل

في حالتي ، يحدث هذا فقط عندما أستخدم android ، فإن أفضل حل هو تغيير خاصية على علامة android في config.xml

<platform name="android"> <edit-config file="AndroidManifest.xml" mode="merge" target="/manifest/application/activity"> <activity android:windowSoftInputMode="adjustPan" /> </edit-config>

ما عليك سوى إضافة الأسطر التالية ، لذا فإن إصدار android في AndroidManifest.xml يحتوي على الضبط الموجود في android: windowSoftInputMode ، سيؤدي ذلك إلى قيام لوحة المفاتيح

لنهج Jatapiaro الموضح أعلاه ، لقد قمت بتثبيت المكون الإضافي التالي من كوردوفا:

cordova plugin add cordova-custom-config

ثم قمت للتو بإضافة ما يلي إلى ملف config.xml

<platform name="android">
    <preference name="android-manifest/application/activity/<strong i="10">@android</strong>:windowSoftInputMode" value="adjustPan" />
    ...
</platform>

يعمل على Android و iOS

إليك ما فعلته لإخفاء لوحة المفاتيح ديناميكيًا:

في ملف TS الخاص بي:

@ViewChild('foot') foo_ter: ElementRef;
  constructor(private platform: Platform, private keyboard: Keyboard) {
    this.platform.ready().then(() => {
      this.keyboard.onKeyboardShow().subscribe(() => {
        this.foo_ter.nativeElement.hidden = true;
      });
      this.keyboard.onKeyboardHide().subscribe(() => {
        this.foo_ter.nativeElement.hidden = false;
      });
    });
  }

ثم في ملف HTML الخاص بي ، أقوم بإنشاء متغير قالب يسمى #footer وهو ما أشير إليه في TS أعلاه مثل هذا:

<ion-footer no-border style="padding:5%;" #footer>
  <ion-item no-lines>
   Don't have an account?
    <button ion-button style="text-align:center;" bold item-end clear no-lines clear (click)="signup()">
      Sign Up
    </button>
  </ion-item>
</ion-footer>

آمل أن يعمل معك أيضًا :-) RaymondAtivie

لقد أعطيته بهذه الطريقة في Ionic V3. يعمل بشكل جيد.
ملف TS
ionViewDidEnter () {
إذا (this.keyboard.isOpen ())
this.showTabs = خطأ ؛
آخر
this.showTabs = صحيح ؛
}

ملف HTML

داسدا

asd

ليس الجواب صحيحا

هل هناك أي تحديث على الحل الرسمي لذلك؟

اعتبارًا من اليوم .. مع Ionic v
لم أتمكن من تشغيل @ ionic-native / keyboard. كما ذكر العديد من الآخرين .. حدث onKeyboardShow () لا ينفجر أبدًا.
تم أيضًا إهمال المكون الإضافي cordova-keyboard-plugin.

إذن ما نجح معي هو ...
cordova plugin add cordova-plugin-ionic-keyboard --save
بعد هذا .. أضفت window.addEventListener كما هو موضح في الملف التمهيدي

لا تنس إزالة برنامج Event Listener في حالة تركك لصفحة علامة التبويب والعودة إليها مرة أخرى ..

مطبعية
// MyTabs.ts
showListener () {
console.log ("لوحة المفاتيح مرئية") ؛
document.body.classList.add ("لوحة المفاتيح مفتوحة") ؛
}
hideListener () {
console.log ("إخفاء لوحة المفاتيح") ؛
document.body.classList.remove ("لوحة المفاتيح مفتوحة") ؛
}

ionViewDidEnter () {
window.addEventListener ('keyboardWillShow'، this.showListener) ؛
window.addEventListener ('keyboardDidHide'، this.hideListener) ؛
}

ionViewWillLeave () {
window.removeEventListener ('keyboardWillShow'، this.showListener) ؛
window.removeEventListener ('keyboardDidHide'، this.hideListener) ؛
}
""

في البداية عملت بالنسبة لي. عندما أنقر لأول مرة على أحد المدخلات عندما تظهر لوحة المفاتيح ، كان شريط علامات التبويب مخفيًا. بعد النقر فوق إدخال آخر ، ظهر شريط التبويب مرة أخرى. لذلك في حالتي ، تم إخفاء شريط التبويب فقط عند النقر فوق حقل الإدخال في البداية.

أي اقتراح؟ تضمين التغريدة

مرحبًا بالجميع ، على الرغم من أنه ليس مثل "إخفاء" شريط علامات التبويب ، فقد نجح هذا الحل بشكل جيد بالنسبة لي من خلال السماح للوحة المفاتيح بإخفاء شريط علامات التبويب بدلاً من دفعه لأعلى.

في ملف config.xml الرئيسي ، قم بتحرير نظام android الأساسي ليشمل ما يلي:

    <platform name="android">
        ...
        <edit-config file="AndroidManifest.xml" mode="merge" target="/manifest/application/activity">
            <activity android:windowSoftInputMode="adjustPan" />
        </edit-config>
    </platform>

ما يفعله هذا هو تعديل القيمة الافتراضية التي يكتبها كوردوفا على AndroidManifest.xml للتحكم في سلوك إدخال لوحة المفاتيح العامة لتطبيقك.

... وإذا قمت بالتحقق من AndroidManifest.xml في الإصدار التالي ، فسترى أنه تم تغيير الإعداد الافتراضي لـ android: windowSoftInputMode = "AdjustResize" إلى "AdjustPan" ، مما يتيح إخفاء شريط علامات التبويب.

codymbeardsley شكرا جزيلا لك! هذا الحل يعمل بالنسبة لي. على الأقل بالنسبة لنظام Android ، فهو حل جيد. عندما تكون لوحة المفاتيح مفتوحة ، بدلاً من الضغط على شريط الأدوات ، تقوم لوحة المفاتيح فقط بإخفاء التذييل !

يعمل بشكل مثالي!
شكرا لك codymbeardsley

شكرا على القضية! تم قفل هذه المشكلة لمنع التعليقات غير ذات الصلة بالمشكلة الأصلية. إذا استمرت المشكلة في أحدث إصدار من Ionic ، فيرجى إنشاء مشكلة جديدة والتأكد من ملء النموذج بالكامل.