स्टाइलिंग UITableViewCells ढाल पृष्ठभूमि के साथ

Question

मैं अपने आईफोन अनुप्रयोगों की समग्र आकर्षकता में सुधार करने के तरीकों की तलाश में हूं। UITableView में अधिकांश कार्यक्षमता होती है। मुझे लगता है कि मैं UITableViewCells में सूक्ष्म ग्रेडियेंट जोड़कर शुरू कर सकता हूं, क्योंकि यह परिमाण के क्रम से ऐप के अनुभव में सुधार करने लगता है। उपयुक्त फोंट/आकार का चयन करना भी एक बड़ा सौदा करने में मदद करता है। इस मंच के लिए मेरा सवाल है, UITableViewCells में ग्रेडियेंट जोड़ने की सबसे अच्छी रणनीति क्या है? क्या आप कोर ग्राफिक्स/क्वार्ट्ज का उपयोग कर रहे हैं? क्या आप 1x1 पिक्सेल छवि का उपयोग कर रहे हैं और इसे खींच रहे हैं? मैं टंबलर आईफोन ऐप के निम्नलिखित स्क्रीनशॉट के साथ कुछ में दिलचस्प हूं: http://dl-client.getdropbox.com/u/57676/screenshots/tumblr.jpg

क्या आपके पास यूआईटीबल व्यूसेल की स्टिक आउट करने के बारे में कोई अच्छा उदाहरण है?

और प्रदर्शन कारणों से क्वार्ट्ज के साथ छवि का उपयोग करना बेहतर है? अगर क्वार्ट्ज, मैं कुछ नमूना कोड देखना पसंद करूंगा कि लोग कोशिकाओं में ग्रेडियेंट को कैसे आकर्षित कर रहे हैं।

धन्यवाद।

Answer 1

मैं टंबलर के लिए काम करता हूं, और जब मैंने आईफोन ऐप (he did) नहीं लिखा है, तो मेरे पास स्रोत है और यह आपको बता सकता है कि यह कैसा हुआ।

-tableView:cellForRowAtIndexPath: में

cell.backgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"postCellBackground.png"]]; 
cell.selectedBackgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"postCellBackgroundSelected.png"]]; 

सुंदर सरल, वास्तव में: सेल की पृष्ठभूमि विचारों के रूप में एक UIImageView में PNG छवियाँ।

दो छवियां 1x61 लंबवत ग्रेडियेंट हैं जो UIKit स्वचालित रूप से सेल की चौड़ाई को फिट करने के लिए क्षैतिज रूप से फैली हुई है।

Answer 2

मैं इसके लिए क्वार्ट्ज 2 डी का उपयोग करता हूं, लेकिन फ़ोटोशॉप में छवियों को सेट करना पूरी तरह से मान्य है।

प्रदर्शन के लिए, यदि आप प्रकार के अनुसार कोशिकाओं का पुन: उपयोग कर रहे हैं तो मुझे नहीं लगता कि यह एक मुद्दा होगा - लेकिन अगर आपको यह एक बाधा मिलती है तो आप एक बिटमैप संदर्भ में एक बार आकर्षित कर सकते हैं, एक छवि प्राप्त करें वह और हर जगह इसका उपयोग करें - हाइब्रिड समाधान का एक प्रकार।

Answer 3

UITableViewCell उनकी पृष्ठभूमि और चयनित पृष्ठभूमि के लिए अलग-अलग दृश्यों का समर्थन करता है, इसलिए इन गुणों का उपयोग करना समझ में आता है। ऐसा करने के लिए, आपको किसी छवि के साथ आने की आवश्यकता होगी जो कि आपके सेल का पूर्ण आकार है (UIImageView इसकी छवि को नहीं खींचता है), ताकि आप इसे एक बार डेस्कटॉप मशीन पर भी बना सकें और सहेज सकें फोन पर चक्र जो किसी छवि को फैलाने या गतिशील रूप से बनाने के लिए खर्च किए जाने होंगे। यद्यपि यदि आप उपयोगकर्ता को ढाल रंग बदलने की अनुमति देना चाहते हैं, तो आपको इसे गतिशील रूप से एक बार बनाना होगा।

Answer 4

मुझे लगता है कि कस्टम सेल के साथ UITableView को संभालने का सबसे आसान तरीका इंटरफ़ेस बिल्डर का उपयोग कर रहा है। यह यूआई डिज़ाइन को शुद्ध कोर द्वारा करने से कहीं अधिक आसान बनाता है। Here is एक महान ट्यूटोरियल (वीडियो के साथ!) इसे कैसे करें। अत्यधिक सिफारिशित। मैं UITableView कोडिंग के किसी अन्य विधि का उपयोग नहीं कर रहा हूं क्योंकि मैंने इसका पालन किया था।

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

Answer 5

आईफोन एसडीके 3.0 के रूप में, much simpler solution that relies on the new CAGradientLayer and doesn't require subclassing or images है।

Answer 6

Mirko's answer एक अच्छा विकल्प है यदि आप किसी छवि का उपयोग नहीं करना चाहते हैं।हालांकि पृष्ठभूमि में ढाल को जोड़ना सबसे अच्छा है, बजाय UITableViewcell को देखें। सेल

Answer 7

मार्को का उत्तर सादे तालिका दृश्य कक्षों के लिए और समूहबद्ध तालिका दृश्य कक्षों के लिए अच्छा काम करता है जो तालिका दृश्य के बीच में स्थित हैं, लेकिन यदि आप सेट करने का प्रयास करते हैं तो आप हाइलाइट प्रभाव खो देंगे नहीं समूहबद्ध तालिका में पहले/अंतिम सेल के लिए पृष्ठभूमि दृश्य, तो यह गोलाकार कोनों को तोड़ देगा। इसे ठीक करने के लिए आप एक UIColor colorWithPatternImage, उदा करने के लिए सेल पृष्ठभूमि रंग सेट कर सकते हैं:

cell.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"Gradient.png"]];