2013-06-06 12 views
18

मैंने कुछ एनजी-व्यू एनिमेशन (कोणीय बनाम 1.1.5) को फोनगैप ऐप में जोड़ा है। वे रिपल का उपयोग करते हुए और मोबाइल फोन के ब्राउज़र (एंड्रॉइड क्रोम इस मामले में) को ऑनलाइन ऐप पर इंगित करते समय ब्राउज़र में बहुत अच्छा काम करते हैं, लेकिन जब फोनगैप के साथ स्थापित किया जाता है, तो एनिमेशन नहीं चलते हैं। मुझे यकीन नहीं है कि समस्या फोनगैप या कोणीय के साथ है या नहीं। सबसे पहले मैंने सोचा कि यह बहुत तेजी से एनिमेट कर रहा था इसलिए मैंने उन्हें 1.5 तक धीमा कर दिया लेकिन ऐप में कोई बदलाव नहीं आया।कोणीय एनिमेशन और फोनगैप मोबाइल पर नहीं चल रहा है

क्या यह एक फोन अंतर मुद्दा है, एक कोणीय मुद्दा है और/या हम इनका उपयोग कैसे कर सकते हैं?

सीएसएस परिभाषित एनीमेशन:

.view-enter, .view-leave { 
    -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s; 
    -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s; 
    -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s; 
    transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s; 
} 

.view-enter { 
    opacity:0; 

} 
.view-enter.view-enter-active { 

    opacity:1; 
} 

.view-leave { 

    opacity:1; 
} 
.view-leave.view-leave-active { 
    left:-100px; 
    opacity:0; 
} 

फिर इन फ़ोन के ब्राउज़र में महान काम करते हैं, बस जब नहीं यह phonegap एप्लिकेशन के अंदर है। ऐप बनाने के लिए एडोब बिल्ड का उपयोग करना। मैं सीएसएस को भी ला रहा हूं और पेजगैप बिल्ड (यह है) में वास्तविक सीएसएस फ़ाइल को शामिल करने के लिए पेज पर प्रदर्शित कर रहा हूं।

उपयोगकर्ता की टिप्पणियों में से एक, यहां HTML है। बाकी को कोणीय के डिफ़ॉल्ट एनिमेशन द्वारा नियंत्रित किया जाता है। ब्राउज़र में चलाने पर वे ठीक काम करते हैं लेकिन फोनगैप के अंदर नहीं चलते हैं। रूटिंग कार्य करता है, एनजी-व्यू बदल जाता है, लेकिन एनीमेशन कभी नहीं होता है।

<div class="container-fluid" id="viewer" ng-view ng-animate="{enter: 'view-enter', leave: 'view-leave'}" > 


    </div> 

Nexus 4

+0

क्या मंच? आईओएस या एंड्रॉइड? –

+0

मैं एक पूर्व निर्मित सीएसएस समाधान का उपयोग कर समाप्त हुआ - http://daneden.me/animate/ कम से कम आईओएस पर शानदार काम करता है। –

+0

@AdamWare मैं एंड्रॉइड 4.2 पर इसका परीक्षण कर रहा था, विशेष रूप से एक नेक्सस 4. – lucuma

उत्तर

0

पर परीक्षण किया गया यह निश्चित रूप से Android 4.2 के शेयर ब्राउज़र के साथ एक मुद्दा है। पहला संकेत यह है कि यह डेस्कटॉप और क्रोम में ठीक काम करता है, लेकिन फोनगैप में नहीं - InAppBrowser एंड्रॉइड के स्टॉक ब्राउज़र का उपयोग करता है।

एनिमेशन के लिए समर्थन (और सामान्य रूप से एचटीएमएल 5) एंड्रॉइड 4.2 में बहुत भयानक था। यहां उन quirks के handy rundown है।

उम्मीद है कि आप जून से अपने एंड्रॉइड संस्करण को अपग्रेड करने में सक्षम हैं!

1

पुराने एंड्रॉइड पर तैनाती करते समय आप CocoonJS (कॉर्डोवा के साथ काम करते हैं) या Crosswalk को देख सकते हैं ताकि ब्राउज़र से संबंधित धीमी गति से सभी प्रकार की गति तेज हो सके।

संबंधित मुद्दे