आईओएस कोर एनीमेशन - एक परत

कोर एनीमेशन का उपयोग करके, मैं UIView (यानी यह CALayer) को इसके केंद्र पर फोल्ड करना चाहता हूं। यानी मैं लंगर बिंदु को सेट कर दूंगा (0.5,0.5) & परत को फोल्ड करें। गुना के रूप में परिप्रेक्ष्य का एक छोटा सा हो रहा है,आईओएस कोर एनीमेशन - एक परत

enter image description here

तो, क्या हो रहा है है, परत इसके केंद्र पर मुड़ा हुआ जा रहा है - यह छवि है कि मैं में फ़ोटोशॉप बनाया प्रभाव मैं देख रहा हूँ दे सकता है लागू किया गया है (कुख्यात m34!)। प्रारंभ में, एक्स-वाई विमान में दृश्य समानांतर है जो ज़ेड अक्ष के साथ सीधे उपयोगकर्ता को देखता है। जैसे-जैसे गुना हो रहा है, उसी आधे & एक ही समय में शीर्ष आधा वापस (कुछ परिप्रेक्ष्य के साथ, गहराई & 3 डी प्रभाव देने के लिए) एक्स-जेड विमान में पूरी परत (समांतर) है। ध्यान दें कि X-Z विमान में परत समानांतर होने के बाद, उपयोगकर्ता अब परत को देखने में सक्षम नहीं होगा। लेकिन यह ठीक है, यही वह प्रभाव है जिसे मैं ढूंढ रहा हूं। UIView इसके केंद्र पर तह से गायब हो रहा है।

iOS में ऐसा करने के बारे में कोई कैसे होगा? 2 अलग परतों का उपयोग किए बिना (नीचे & शीर्ष के लिए)? किसी भी मदद की बहुत सराहना की है ...

अद्यतन: @miamk बताते के रूप में, यह एक ही यूआई में "हमारा विकल्प" App या "Flipboard" उपयोग किया गया ऐप्लिकेशन प्रभाव है। मैं इस पर पिछले 8 घंटों के लिए अपने दिमाग को बाहर कर रहा हूं, अब तक फलहीन। किसी भी विचार की सराहना की है। धन्यवाद ...

अद्यतन: मैंने अधिक विशिष्ट उत्तरों प्राप्त करने के लिए इस पर बक्षीस की पेशकश की है। देखना चाहते हैं -

कोड नमूने।
ऐसे लोगों से सलाह लें जिन्होंने ऐसा कुछ किया है।
यहां तक कि एक विस्तृत फैशन (अलगो) में इसे हासिल करने का तरीका भी बहुत सराहना करता है।

स्रोत

2011-08-08 Srikar Appalaraju

यह अल गोर के हमारा चॉइस ऐप (छवियों का तह और खोलने) या फ्लिपबोर्ड के पृष्ठ को एनीमेशन बदलने के समान कुछ होगा, है ना? अच्छा सवाल है, हालांकि मुझे संदेह है कि मैं किसी भी मदद से हो सकता हूं। – MiguelB

हां, ऐसा कुछ! देखें कि क्या आप किसी भी विचार से आ सकते हैं? कोई फर्क नहीं पड़ता कि यह कितना निराला है ... –

ए CALayer एक विमान है, और इसे फोल्ड नहीं किया जा सकता है। जब तक आप पृष्ठ कर्ल प्रभाव की तरह, इसके लिए कोर छवि फ़िल्टर नहीं लिखते, लेकिन यदि निजी एपीआई और आपके लिए कोई विकल्प नहीं है।

आपको अपने विचार को दो दृश्यों में विभाजित करने की आवश्यकता है, और दो CALayer एस को एक साथ बदलकर नकली नकली करने की आवश्यकता है।

डिफ़ॉल्ट एक परतों को बदलने के नजरिए की जरूरत नहीं है करके, ताकि आप भी सेटअप यह करना होगा:

transform.m34 = 1.0/-2000;

ठीक की और भी स्पष्ट हो: देखने विभाजित दो में और उन्हें गुना:

आपका

+ UIView  - Root view 
    + UIImageView - The persons face 
    + UILabel  - The label with title 
    + UILabel  - The label with company name 
    + UILabel  - The label with a short description. 
    + UILabel  - The label with e-mail 
    + UILabel  - The label with web address 
    + UILabel  - The label with phone number

तो इस दृश्य हड़बड़ाना करने के लिए दो नए विचारों को लागू: छवि आप पोस्ट के अनुसार hiarchy देखने कुछ इस तरह दिखता फोल्डिंग के उद्देश्य के लिए rarchy, इस तरह:

+ UIView - Root view 
    + UIView  - Top half of the card 
     + UIImageView - The persons face 
     + UILabel  - The label with title 
     + UILabel  - The label with company name 
     + UILabel  - The label with a short description. 
    + UIView  - Bottom half of the view 
     + UILabel  - The label with e-mail 
     + UILabel  - The label with web address 
     + UILabel  - The label with phone number

बहुत मुश्किल नहीं है। अब ऊपर और नीचे आधे समूह के लिए उपयोग किए जाने वाले केवल दो विचारों को एनिमेट करें।

मैं आपके लिए कोड नहीं लिखूंगा, लेकिन इसे आसान बनाने के लिए एक और महत्वपूर्ण युक्ति: दृश्य के एंकर पॉइंट को एनिमेट करने के लिए बदलें! आप उन्हें अपने स्वयं के केंद्रों से घूमना नहीं चाहते हैं, बल्कि घूर्णन के केंद्र को एक दूसरे के खिलाफ किनारों के साथ संरेखित करने के लिए स्थानांतरित करना चाहते हैं।

topView.layer.anchorPoint = CGPointMake(0.5f, 1.0f); 
bottomView.layer.anchorPoint = CGPointMake(0.5f, 0.0f);

स्रोत

2011-08-09 08:03:30 PeyloW

मुझे अपने विचार को 2 परतों में विभाजित करने और उस पर एनीमेशन चलाने का विचार मिलता है। लेकिन मूल परत का क्या होता है? मेरे 'कैलियर' को 2 परतों में कैसे विभाजित करें? एनीमेशन पूर्ण होने के बाद, कैसे पुनर्स्थापित करें? आपने जो कोड पोस्ट किया है, परिप्रेक्ष्य देना है, मुझे यह पता है। असली भाग जिसकी मुझे मदद की ज़रूरत थी, मेरी परत को 2 भाग में विभाजित करना था ... –

@ श्रीकर - मैं हर समय परतों को विभाजित और विलय नहीं करता। मैं बस दो 'UIView' के लिए जाना होगा कि सिर्फ एक दूसरे के बगल में बाहर हो जाना चाहिए। कम फज़ – PeyloW

इस पर चर्चा करने के लिए समय निकालने के लिए पहला धन्यवाद.अब वापस आना, आप जो कहते हैं वह बदसूरत हो सकता है, क्योंकि मैं इसे 'UITableViewCell' पर करना चाहता हूं। मैं अपनी टेबल ViewCell को फोल्ड और गायब करना चाहता हूं। आपके दृष्टिकोण के साथ मुझे अपनी सामग्री को 2 सेल्स में विभाजित करने के लिए बहुत सारे कोड प्रदान करने होंगे। कोई बेहतर तरीका ज़रूर होगा? –

गिटूब पर इस भयानक परियोजना पर थोड़ा सा शोध और ठोकर खाई: AFKPageFlipper। यह बहुत हालिया है, क्या आप इसके बारे में जानते थे? यह अनिवार्य रूप से फ्लिपबोर्ड की एनीमेशन पूरी तरह से सरल और सरल कोर एनीमेशन के साथ किया गया है।

इसे देखें, यह आश्चर्यजनक रूप से कोड के माध्यम से पालन करना आसान है, और यह आपको केवल अपनी दिशा को लागू करने के तरीके पर कुछ दिशा दे सकता है।

स्रोत

2011-08-08 18:24:09 MiguelB

क्या आप एक लिंक प्रदान कर सकते हैं? –

@ बैरीवार्क मैंने किया। इसे किसी कारण से संपादित किया गया था जिसे मैं समझ में नहीं आता हूं। आप अभी भी संशोधन से पहले लिंक देख सकते हैं। – MiguelB

@ स्ट्राइकर लिंक क्यों हटाएं? – MiguelB

क्या कार्यप्रवाह इस तरह का के बारे में: देखने से

प्राप्त छवि

UIGraphicsBeginImageContext(self.bounds.size); 
[self.layer renderInContext:UIGraphicsGetCurrentContext()]; 
UIImage *viewImage = UIGraphicsGetImageFromCurrentImageContext(); 
UIGraphicsEndImageContext();

फिर

CGImageCreateWithImageInRect(CGImageRef, CGRect);

इस पत्ते का उपयोग कर 2 छवियों (ऊपर और नीचे रेक्ट) बनाने आप जिन संपत्तियों को आप चाहते हैं उन्हें करने के लिए आपको आवश्यक संपत्तियों के साथ। गतिशील रूप से बनाई गई शीर्ष और निचली छवियां जिन्हें एनिमेटेड किया जा सकता है।

स्रोत

2011-08-17 14:06:38 Zimmen

तो क्या मैं मूल दृश्य छुपाता हूं? और छिपे हुए दृश्य के शीर्ष पर इन 2 छवियों (शीर्ष, नीचे) को रखें ताकि यह एक के रूप में दिखाई दे और फिर गुना एनीमेशन निष्पादित करें? –

आईओएस कोर एनीमेशन - एक परत

उत्तर

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