Ionic2 आईओएस संक्रमण टैप अवरुद्ध या दूसरे

Question

के लिए क्लिक करें मुझे आईओएस पर आईओएनआईसी 2 अंतिम टैपिंग व्यवहार के साथ कोई समस्या है।

पृष्ठ संक्रमण के बाद, कार्ड पर एक टैप या क्लिक 1-2 सेकंड के लिए काम नहीं करता है, इसलिए उपयोगकर्ता को दो बार टैप या क्लिक करना पड़ता है (या क्लिक करने से पहले एक पल प्रतीक्षा करें)। मैंने पहले ही कार्ड पर क्लिक को जोड़ने के बजाय कार्ड के अंदर <a> का उपयोग करने का प्रयास किया है। मैंने (click), (tap), [navpush] भी कोशिश की और मैंने कार्ड में tappable जोड़ने का प्रयास किया है।

<ion-content padding class="modules card-background-page"> 
    <ion-card class="module-card" *ngFor="let module of modules"> 
    <a (tap)="tapEvent($event)" (click)="clickEvent($event)" [navPush]="modulePage" [navParams]="{id: module.id}" > 
    <img src="{{module.thumbnail}}"/> 
    <div class="card-content"> 
     <div class="card-title"> 
      <strong>Module {{module.number}}</strong> 
     </div> 
     <div class="card-subtitle"> 
      <strong *ngIf="translate.currentLang!='fr'">{{module.subtitle_en}}</strong> 
      <strong *ngIf="translate.currentLang=='fr'">{{module.subtitle_fr}}</strong> 
     </div> 
    </div> 
    </a> 
    </ion-card> 
</ion-content> 

एंड्रॉइड पर यह ठीक काम करता है।

परीक्षण और त्रुटि के एक बहुत बाद मैं एंड्रॉयड संक्रमण का उपयोग करके इस मुद्दे को "निर्धारित":

IonicModule.forRoot(MyApp, { 
     pageTransition: 'md-transition' 
    }), 

तो समस्या आईओएस संक्रमण हो रहा है। कोई विचार यह वास्तव में कैसे ठीक करें? किसी को भी एक ही समस्या है? मुझे संक्रमण के बाद या साइड मेनू बंद करने के बाद बहुत कम पीछे टिपिंग करने में समस्याएं हैं। हालांकि ये इतनी आसानी से प्रतिकृति नहीं हैं।

पर iPhone 6S

Answer 1

समस्या आईओएस 10.1.1 वास्तविक संक्रमण के लिए इस्तेमाल किया एनीमेशन हो रहा है। NavCtrl पर पुश करते समय आप एनीमेशन के लिए समय (और आसान) समायोजित करके इसे हल कर सकते हैं। आप अंतिम पैरामीटर के रूप में वैकल्पिक विकल्प ऑब्जेक्ट प्रदान करके ऐसा करते हैं।

this.navCtrl.push('MyPage', null, { 
    duration: 200, 
    easing: 'cubic-bezier(0.36,0.66,0.9,1)' 
}); 

स्पष्टीकरण इस प्रकार है ...

मूल एनीमेशन सेटिंग 500 एमएस जो बहुत लंबा है। हालांकि वास्तविक दृश्य एनीमेशन वास्तव में उस समय तक नहीं लग रहा है क्योंकि मूल एनीमेशन का क्यूबिक-बेजियर वक्र पिछले 200-300ms (जो नीचे दी गई तस्वीर में देखा जा सकता है) में बहुत सपाट है।

यही कारण है कि आसानी को भी बदला जाना चाहिए।

मूल: क्यूबिक-बेज़ियर (0.36,0.66, 0.9, 1)

एप्लिकेशन बनाने के लिए: क्यूबिक-बेज़ियर (0.36,0.66, 0.04, 1) में बदला गया जब बैक बटन दृश्य में दबाया जाता है तो उसी एनीमेशन को वापस नेविगेट करते समय तेज़ रहें। यह NavBar के बैक बटन व्यवहार को ओवरराइड करके किया जा सकता है।

तो किसी को भी स्रोत भवन (या आयोनिक टीम के लिए एक पुल अनुरोध प्रदान करने के लिए चाहते हैं) के लिए अपने पृष्ठ घटक

@ViewChild(Navbar) navBar: Navbar; 

ionViewDidLoad() { 
    this.setBackButtonAction() 
} 

//Method that overrides the default back button action 
setBackButtonAction() { 
    this.navBar.backButtonClick =() => { 
    this.navCtrl.pop({ 
     duration: 200, 
     easing: 'cubic-bezier(0.36,0.66,0.9,1)' 
    }); 
    } 
} 

में जोड़ना। मूल मानों ios-transition.ts में स्थापित कर रहे हैं और वहाँ बदला जाना चाहिए

const DURATION = 500; 
const EASING = 'cubic-bezier(0.36,0.66,0.04,1)'; 

संपादित करें: मैं आयोनिक टीम https://github.com/ionic-team/ionic/pull/13029