शुभ दोपहर, अभिभावक!

आज मैं जावा में ग्राफिक्स के साथ काम करने के कुछ पहलुओं और सूक्ष्मताओं पर आपका ध्यान आकर्षित करने की फिर से कोशिश करूंगा। मैंने पहले ही संक्षेप में पिछले लेख में घटकों और UI बनाने के लिए कुछ उपलब्ध टूल और विधियों का वर्णन किया है, लेकिन यह सिर्फ हिमशैल का टिप है। यही कारण है कि मैं ग्राफिक्स के साथ काम करने के लिए विशेष ध्यान (और लेख) देना चाहता हूं। बेशक, Graphics2D का मतलब है - जावा 3 डी एक बड़ा अलग विषय है (शायद यह भविष्य में चर्चा की जाएगी, लेकिन आज नहीं)।

इसलिए, पिछले लेख से आपको पहले से ही घटकों के निर्माण की कुछ मूल बातें पता होनी चाहिए - हम इस ज्ञान का विस्तार करने का प्रयास करेंगे।

MVC के दृष्टिकोण से किसी भी घटक को देखें, तो शुरू करने के लिए, इसमें 3 भाग होते हैं:
मॉडल - एक मॉडल जो घटक की स्थिति पर डेटा संग्रहीत करता है और जिसके आधार पर उपस्थिति का निर्माण किया जाता है
देखें - सीधे घटक का दृश्य प्रदर्शन
नियंत्रक - घटक (कीबोर्ड, माउस और अन्य इनपुट उपकरणों से घटनाओं) के प्रबंधन के लिए जिम्मेदार है

वास्तव में, सभी मानक स्विंग घटक MVC पैटर्न का उपयोग करके बनाए जाते हैं। उदाहरण के लिए, जेबटन में - बटनमॉडल बटन (नियंत्रक और मॉडल) के व्यवहार और स्थिति के लिए जिम्मेदार है, और बटनयूआई, इसके बाहरी प्रतिनिधित्व के लिए (देखें)। परिणामस्वरूप, जेबटन वर्ग के लिए लगभग कुछ भी नहीं बचा है। यह मुख्य रूप से घटकों (देखें) के बाहरी प्रतिनिधित्व के कार्यान्वयन से निपटेगा, और अगर हम स्पष्ट करते हैं - ग्राफिक्स 2 डी के बारे में, जिसके आधार पर, वास्तव में, संपूर्ण इंटरफ़ेस तैयार किया गया है।

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

कपड़ों से मिलते हैं

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

तो, आज हम Graphics2D द्वारा प्रदान किए गए मानक उपकरणों का विश्लेषण करेंगे, साथ ही साथ कुछ तकनीकों और किसी भी जटिलता के घटकों को प्रस्तुत करने के लिए ट्रिक्स।

यह स्पष्ट है कि एक समझदार विचार के बिना, कोई भी साधन कुछ भी करने में मदद नहीं करेगा, लेकिन यहां, अफसोस, मैं शक्तिहीन हूं। संभवतः एक डिजाइनर / यूएक्स विशेषज्ञ आपको इसकी मदद कर सकते हैं, अगर कल्पना के साथ सब कुछ वास्तव में खराब है। ईमानदारी से, अपने आप को "निचोड़" करना मुश्किल हो सकता है कि एक नया घटक कैसे दिखेगा। ऐसा होता है कि यह और भी जटिल है और सीधे काम कोड लिखने और इसे डीबग करने से अधिक समय लेता है।

किसी भी मामले में, चलो व्यापार के लिए नीचे उतरो ...

सामग्री की एक छोटी तालिका

1. आंकड़े
2. RenderingHints
3. भरण
4. संरेखण ड्राइंग
5. स्ट्रोक
6. छाया
7. सही कतरन
8. एनीमेशन
9. कुछ तरकीबें
10. WebLookAndFeel
11. निष्कर्ष में ...
12. साधन

आंकड़े

बिना आंकड़े के कहीं नहीं। किसी भी घटक, किसी भी सरलतम चीज के लिए, आपको भागों के आकृति को खींचने की आवश्यकता है। पिक्सेल के द्वारा इसे मैन्युअल रूप से करना एक सुखद कार्य नहीं है। विशेष रूप से यदि आपको रेंडरिंग में स्मूथिंग या कुछ अन्य प्रभाव जोड़ने की आवश्यकता है। भगवान का शुक्र है कि आपको इसे मैन्युअल रूप से करने की आवश्यकता नहीं होगी - सभी मानक आकार (Line2D, Rectangle2D, RoundRectangle2D, Ellipse2D, Arc2D, आदि) जो प्रतिपादन के लिए आवश्यक हो सकते हैं, पहले से ही लागू हैं - आपको एक विशिष्ट स्थान में ड्राइंग के लिए अपने निर्देशांक और आकार निर्दिष्ट करने की आवश्यकता है।

मानक आकृतियों के अतिरिक्त, कुछ विशिष्ट भी हैं (जैसे कि GeneralPath) जो आपको जल्दी से अपने आकार बनाने की अनुमति देते हैं।

कुछ व्यक्तिगत परियोजनाएँ भी हैं जिनके विभिन्न विशिष्ट रूप हैं:
http://java-sl.com/shapes.html
http://geosoft.no/graphics/
http://designervista.com/shapes/index.php
http://www.jfree.org/jcommon/

प्रत्येक व्यक्ति के आंकड़े का वर्णन करने का कोई मतलब नहीं है - आप उनके बारे में यहां या यहां विस्तार से पढ़ सकते हैं (दोनों विवरणों में उपयोग के उदाहरण भी हैं)।

मैं यहाँ थोड़ा स्पष्ट करना चाहता हूँ कि यह आंकड़ा कैसे निकाला जाता है और अंतिम परिणाम को क्या प्रभावित करता है। मान लीजिए कि आपके पास एक निश्चित आकार (शेप शेप) है:

• आप 2 अलग-अलग तरीकों का उपयोग कर सकते हैं - g2d.fill (आकार) और g2d.draw (आकार)। भरें - आकार के अंदर सभी पिक्सल को भरता है, आकृति की रूपरेखा खींचता है।
• पेंट वर्ग (g2d.setPaint (पेंट पेंट)) के स्थापित वंशज रंग या रंगों के लिए जिम्मेदार है जिसमें प्रतिपादन किया जाता है - यह क्षेत्र के प्रत्येक व्यक्ति पिक्सेल के लिए रंगों के साथ रेंडरर प्रदान करता है। इस मोड का सबसे सरल संस्करण कोई भी रंग (रंग) है - यह बस प्रत्येक पिक्सेल को एक ही रंग देता है। अधिक जटिल उदाहरण हैं, उदाहरण के लिए, ढाल और बनावट भरता है (ग्रेडिएंटपेंट, टेक्सचरपेंट, आदि)।
• मोटाई, आवृत्ति (या डैश), और आकृति की सीमा रेखा के कोनों और किनारों पर एसोसिएशन का प्रकार सेट स्ट्रोक (g2d.setStroke (स्ट्रोक)) से प्रभावित होता है।
• नीचे दिए गए अध्याय में दिए गए विभिन्न मापदंडों से आंकड़े, पाठ और साथ ही अन्य बिंदुओं की चौरसाई, रेंडरिंग गुणवत्ता प्रभावित होती है।

RenderingHints

एंटी-अलियासिंग मानक उपकरणों के सेट में शामिल है जो ग्राफिक्स 2 डी के साथ बंडल में आते हैं:
g2d.setRenderingHint (RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
यह भविष्य में खींची गई सभी आकृतियों को चौरसाई करने में सक्षम है।
याद रखने वाली मुख्य बात यह है कि अपने संचालन के बाद एंटी-अलियासिंग को बंद कर दें, यदि आप नहीं चाहते हैं कि जो कुछ भी प्रदान किया गया है वह एंटी-अलियासिंग का भी उपयोग करें - उदाहरण के लिए, यदि आप अपने बटन की पृष्ठभूमि प्रतिपादन को लागू करते हैं और डिफ़ॉल्ट रूप से खींचे गए पाठ को चौरसाई करना नहीं चाहते हैं।

इस पैरामीटर का मान (RenderingHints.KEY_ANTIALIASING) टेक्स्ट स्मूथिंग को भी प्रभावित करता है यदि इसमें डिफ़ॉल्ट चयन होता है।
पाठ को सुचारू करने के लिए अलग से सक्षम / अक्षम करना संभव है:
g2d.setRenderingHint (RenderingHints.KEY_TEXT_ANTIALIASING, RenderingHints.VALUE_TEXT_ANTIALIAS_ON);
जब यह पैरामीटर VALUE_TEXT_ANTIALIAS_DEFAULT के अलावा किसी अन्य चीज़ पर सेट है, तो यह RenderingHints.KEY_ANTIALIASING के मान को अनदेखा कर देगा।

यहां एक छोटा और सरल उदाहरण दिया गया है, जिसमें एंटी-अलियासिंग के साथ और इसके बिना रेंडरिंग के बीच अंतर दिखाया गया है:

(एक उदाहरण और स्रोत कोड यहां डाउनलोड किया जा सकता है )

यदि आप बारीकी से देखते हैं, तो आप RenderingHints में कई अन्य उपलब्ध सेटिंग्स भी देखेंगे:
KEY_ANTIALIASING - आकृति को चौरसाई करने के लिए सेटिंग्स (और पाठ)
KEY_RENDERING - गुणवत्ता / रेंडरिंग गति सेट करना
KEY_DITHERING - रंग को एक सीमित पैलेट के साथ मिलाना
KEY_TEXT_ANTIALIASING - टेक्स्ट एंटी-अलियासिंग सेटिंग
KEY_TEXT_LCD_CONTRAST - विशेष पाठ चौरसाई का उपयोग करते हुए पाठ कंट्रास्ट (100 से 250 तक)
KEY_FRACTIONALMETRICS - पाठ वर्ण प्रदान करने की "सटीकता" सेट करना
KEY_INTERPOLATION - एक ऐसी सेटिंग जो रेंडरिंग के दौरान इमेज पिक्सल्स के संशोधन के लिए जिम्मेदार है (उदाहरण के लिए, जब इमेज रोटेट होती है)
KEY_ALPHA_INTERPOLATION - अल्फा मानों की गुणवत्ता / प्रसंस्करण गति सेट करना
KEY_COLOR_RENDERING - गुणवत्ता / रंग प्रसंस्करण गति सेट करना
KEY_STROKE_CONTROL - अंतिम दृश्य को बेहतर बनाने के लिए आकृतियों की ज्यामिति को संशोधित करने की क्षमता निर्धारित करना

इनमें से अधिकांश सेटिंग्स आमतौर पर डिफ़ॉल्ट स्थिति में रहती हैं। हालांकि, वे कुछ विशिष्ट मामलों में बहुत उपयोगी हो सकते हैं।
उदाहरण के लिए, KEY_INTERPOLATION को VALUE_INTERPOLATION_BILINEAR पर सेट करते समय, आप संशोधित होने (रोटेशन / संपीड़न / शिफ्ट, आदि) में छवि गुणवत्ता के नुकसान से बच सकते हैं या टेक्स्ट रेंडरिंग कोड को प्रभावित किए बिना KEY_TEXT_LCD_CONTRAST को बदलकर अपनी पृष्ठभूमि पर पाठ के विपरीत सुधार कर सकते हैं।

किसी भी मामले में, आपको सावधानीपूर्वक इन सेटिंग्स का उपयोग करना चाहिए और अपने रेंडरिंग विधि के दायरे से "आगे" जाने से बचना चाहिए, उदाहरण के लिए, JTextField में शामिल एक ही एंटीलियासिंग से पाठ को चौरसाई और इसके संशोधन (और शायद बदलाव) हो जाएगा।

भरण

पेंट क्लास के कई सुलभ वंशज उपलब्ध हैं जो आपको अलग-अलग तरीकों से चित्रित आकार भरने / भरने की अनुमति देते हैं:

• रंग - सबसे सरल, आपको एक रंग के साथ आकृति को खींचने या भरने की अनुमति देता है।
• TexturePaint - आपको भरने / रेंडर करने के लिए बैकग्राउंड इमेज के रूप में मौजूदा BufferedImage का उपयोग करने की अनुमति देता है।
• ग्रेडिएंटपेंट - प्रारंभ और अंत रंगों के साथ एक बिंदु से दूसरे तक एक सरल रैखिक ढाल।
• LinearGradientPaint - एक बिंदु से दूसरे तक किसी भी संख्या में मध्यवर्ती रंगों के साथ एक और अधिक जटिल रैखिक ढाल उनके साथ पुनर्निर्धारित दूरी के साथ।
• RadialGradientPaint - एक गोलाकार ढाल जो वृत्त और त्रिज्या के केंद्र के साथ-साथ रंगों और उनके बीच की दूरी को दर्शाता है, LinearGradientPaint के समान।

स्पष्टता के लिए, एक घटक पर तीन समान भागों को भरने के लिए 3 अलग-अलग ग्रेडिएंट का उपयोग करके एक छोटा उदाहरण:

(एक उदाहरण और स्रोत कोड यहां डाउनलोड किया जा सकता है )

वैसे, शायद हर कोई नहीं जानता है कि किसी रंग को निर्दिष्ट करते समय किसी भी भराव / रेंडरिंग में, आप इसकी पारदर्शिता (अल्फा) का संकेत भी दे सकते हैं।
उदाहरण के लिए, नया रंग (255, 255, 255, 128) - 50% सफेद रंग के लिए पारदर्शी। इस मामले में अल्फा 128 है। यह 0 से 255 तक भिन्न हो सकता है। 0 पूरी तरह से पारदर्शी रंग है, 255 पूरी तरह से अपारदर्शी है (डिफ़ॉल्ट रूप से उपयोग किया जाता है)।

संरेखण ड्राइंग

इसलिए, हम व्यवस्थित रूप से और अधिक जटिल चीजों की ओर बढ़ रहे हैं ...
संरेखण (दूसरे शब्दों में - समग्र) आपको कैनवास पर पहले से ही पिक्सेल के साथ नए तैयार आकृतियों / छवियों के संरेखण के विभिन्न "मोड" निर्दिष्ट करने की अनुमति देता है।

मैं संरेखण के विभिन्न "मोड" के लिए सबसे सफल चित्रण पा सकता हूं, साथ ही साथ आरेखित आंकड़ों पर उनके वास्तविक प्रभाव का एक उदाहरण भी यहां मिल सकता है । प्रत्येक "मोड" का एक विस्तृत विवरण भी है।

व्यवहार में, व्यक्तिगत रूप से, सबसे अधिक बार मैं AlphaComposite.SRC_OVER विकल्प का उपयोग करता हूं और पहले से तैयार की गई चीजों के शीर्ष पर एक निश्चित पारदर्शिता में आगे के तत्वों को खींचने के लिए पारदर्शिता निर्दिष्ट करता हूं। छवियों के साथ काम करते समय कुछ मोड के आवेदन के काफी दिलचस्प उदाहरण भी हैं, लेकिन बाद में उस पर अधिक।

कम्पोजिट के अलावा, मानक लोगों का उपयोग करके और विभिन्न ज्यामितीय संचालन के साथ उन्हें मिलाकर अपने खुद के आकार बनाना भी संभव है। इस विषय पर एक छोटा सा उदाहरण:

(एक उदाहरण और स्रोत कोड यहां डाउनलोड किया जा सकता है )

यह आंकड़ा बनाने के लिए, इसमें केवल 2 लाइनें लगीं:

Area area = new Area ( new Ellipse2D.Double ( 0, 0, 75, 75 ) );
area.add ( new Area ( new Ellipse2D.Double ( 0, 50, 75, 75 ) ) );

सबसे दिलचस्प क्या है - नए आंकड़े की सीमा में दीर्घवृत्त (जो दीर्घवृत्त के विपरीत के अंदर गिर गए) की सीमाओं के आंतरिक भागों को शामिल नहीं किया गया है।

सामान्य तौर पर, क्षेत्र का उपयोग कई अलग-अलग चीजों के लिए किया जा सकता है: यह न केवल मौजूदा आकृतियों में नए जोड़ सकता है, बल्कि एक चौराहे का क्षेत्र भी बना सकता है या कुछ आकृतियों को दूसरों से बाहर कर सकता है, यह एक आकृति (सीमा) की सामान्य सीमाओं से सीखना संभव है। इसके अलावा, इसकी मदद से, आप किसी भी अन्य उपलब्ध सरल आकृतियों से जटिल आकार बना सकते हैं।

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

स्ट्रोक

... या TheShock ने "स्ट्रोक" का सुझाव दिया।

वास्तव में, स्ट्रोक ग्राफिक्स की ड्रॉ विधि के लिए किसी भी कॉल द्वारा खींची गई सीमा की शैली निर्धारित करने की क्षमता प्रदान करता है।
मानक JDK में, स्ट्रोक इंटरफ़ेस का केवल 1 कार्यान्वयन है - बेसिकस्ट्रोक। यह आपको लाइन की चौड़ाई निर्धारित करने की अनुमति देता है कि कैसे कोनों पर लाइनों को संयोजित किया जाता है और वे सिरों पर कैसे दिखते हैं, और धराशायी लाइनें भी बनाते हैं।

स्ट्रोक को कोड में सेट करने के लिए, निम्नलिखित करें:

g2d.setStroke ( new BasicStroke ( 2f ) );

यह उदाहरण बाद के सभी बॉर्डरबोर्ड को 2 पिक्सल चौड़ा करने के लिए मजबूर करेगा।
वैसे, डर नहीं है कि चौड़ाई और कुछ अन्य मापदंडों को फ्लोट में सेट किया जा सकता है (हालांकि पिक्सेल पूर्णांक होना चाहिए) - गैर-पूर्णांक संख्याएं रेंडर करते समय केवल "स्मीयर" लाइनें / रूपरेखा बनाएंगे, जो कुछ मामलों में भी काम में आ सकते हैं।

बेसिकस्ट्रोक की संभावनाओं के बारे में अधिक जानकारी मिल सकती है, उदाहरण के लिए, यहाँ ।

हालांकि JDK में स्ट्रोक का केवल एक कार्यान्वयन शामिल है, लेकिन अन्य परियोजनाएं और उदाहरण हैं जो इस उपकरण की वास्तविक क्षमताओं का वर्णन करते हैं, लेकिन बाद में इस पर और अधिक।

छाया

Java2D में छाया का कोई मानक कार्यान्वयन नहीं है, लेकिन छाया के "प्रभाव" को प्राप्त करने के लिए कुछ तरीके हैं - मैं इस अध्याय में उनके बारे में बात करूंगा।
आइए सरल विकल्पों के साथ शुरू करें ...

मूल आकृति के एक मामूली बदलाव / संशोधन द्वारा प्राप्त छाया

दूसरी छवि में - इस प्रकार की छाया का एक संकीर्ण और भक्षक संस्करण।
(एक उदाहरण और स्रोत कोड यहां डाउनलोड किया जा सकता है )

इस तरह से प्राप्त छाया केवल तभी लागू होती है जब यह मूल आकार के किनारे से अधिक 1-3 पिक्सेल तक नहीं फैलती है, अन्यथा यह अप्राकृतिक लगने लगती है। इसके अलावा, इस पद्धति के लिए एक बोझिल कोड की आवश्यकता होती है - किसी भी व्यक्ति के लिए, आपको बार-बार छाया की जांच और चयन करना होगा।

Iterative छाया
बार-बार संशोधित आकृति प्रदान करके प्राप्त छाया। इसके अलावा, प्रत्येक बाद के पुनरावृत्ति में, आकृति का आकार बढ़ता है (विकल्पों में से एक के रूप में) और पारदर्शिता घट जाती है (या रंग बदलता है)।

(एक उदाहरण और स्रोत कोड यहां डाउनलोड किया जा सकता है )

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

धीरे-धीरे छाया
यह विकल्प आकृति के किनारों के साथ ढाल भरने के उपयोग पर आधारित है।
वास्तव में, हमारे पास आयत के मामले में किनारों के चारों ओर 8 भाग हैं जिसमें एक भराव आवश्यक है:

4 मामलों में - LinearGradientPaint, अन्य 4 मामलों में - RadialGradientPaint। परिणाम एक ऐसी साफ-सुथरी छाया है:

(एक उदाहरण और स्रोत कोड यहां डाउनलोड किया जा सकता है )

आप ढाल के स्थान को भी बदल सकते हैं और अन्य दिलचस्प विकल्प प्राप्त कर सकते हैं, उदाहरण के लिए:

(एक उदाहरण और स्रोत कोड यहां डाउनलोड किया जा सकता है )

इस विकल्प का लाभ छाया रेंडरिंग की गति और गुणवत्ता है। हालाँकि, कोड का आकार फिर से पीड़ित है, जैसा कि आप उदाहरण से देख सकते हैं।

प्रतिपादन करते समय स्ट्रोक को संशोधित करके प्राप्त छाया
अधिक सटीक होने के लिए, एक चक्र में कई बार एक चर रंग / पारदर्शिता और स्ट्रोक के साथ आंकड़ा खींचा जाता है, जो आपको एक प्रकार की छाया बनाने की अनुमति देता है:

(एक उदाहरण और स्रोत कोड यहां डाउनलोड किया जा सकता है )

चूंकि आकृति का आकार बिल्कुल छाया के प्रतिपादन को प्रभावित नहीं करता है, इसलिए इस तकनीक का उपयोग किसी भी सबसे मुश्किल आंकड़े के लिए किया जा सकता है:

(एक उदाहरण और स्रोत कोड यहां डाउनलोड किया जा सकता है )

इसके अलावा, छाया रेंडरिंग को आसानी से एक अलग स्वतंत्र विधि में स्थानांतरित किया जा सकता है:

private void drawShade ( Graphics2D g2d, RoundRectangle2D rr, Color shadeColor, int width )
{
Composite comp = g2d.getComposite ();
Stroke old = g2d.getStroke ();
width = width * 2;
for ( int i = width; i >= 2; i -= 2 )
{
float opacity = ( float ) ( width - i ) / ( width - 1 );
g2d.setColor ( shadeColor );
g2d.setComposite ( AlphaComposite.getInstance ( AlphaComposite.SRC_OVER, opacity ) );
g2d.setStroke ( new BasicStroke ( i ) );
g2d.draw ( rr );
}
g2d.setStroke ( old );
g2d.setComposite ( comp );
}

छवि छाया
छवियों के लिए, हम पिछले किसी भी तरीके से छाया प्रदान करने के लिए एक आंकड़ा प्राप्त नहीं कर पाएंगे, अगर यह सिर्फ आयताकार नहीं है, लेकिन उदाहरण के लिए गोल या यहां तक ​​कि अनाकार भी। इस मामले में एक छाया बनाने के लिए, हम दूसरी तरफ थोड़ा संपर्क करेंगे - अल्फाकम्पोसिट की मदद से हम मूल छवि की एक-रंग की प्रतिलिपि बनाएंगे और इसे छाया के रूप में उपयोग करेंगे:

(एक उदाहरण और स्रोत कोड यहां डाउनलोड किया जा सकता है )

बेशक, कुछ मामलों में, ऐसी छाया करेगी, लेकिन फिर भी, मैं छाया के पास अधिक चिकनी / ढाल किनारों को प्राप्त करना चाहूंगा। इस समस्या को हल करने में, फ़िल्टर करने से हमें मदद मिलेगी। अधिक सटीक रूप से, हम इसकी अधिक यथार्थवादी उपस्थिति के लिए छवि के परिणामस्वरूप "छाया" के लिए एक विशेष फिल्टर का उपयोग करते हैं:

(एक उदाहरण और स्रोत कोड यहां डाउनलोड किया जा सकता है )

सच कहूं तो, इस उदाहरण के लिए, मैंने यहां दिए गए फिल्टर का तैयार संस्करण लिया। लेकिन अतिरिक्त धन के बिना भी, आप पहले उदाहरण में प्राप्त छाया को जल्दी और आसानी से "धुंधला" कर सकते हैं और इसे छवि के नीचे रख सकते हैं।

वैसे, इस छाया का उपयोग आंकड़े के लिए भी किया जा सकता है, यदि आप उन्हें पहली बार एक अलग छवि पर लागू करते हैं, जिसके आधार पर फ़िल्टर काम करेगा। यह काफी लागू हो सकता है, उदाहरण के लिए, यदि आंकड़ा (यों) अनुप्रयोग के निष्पादन के दौरान गतिशील रूप से नहीं बदलते हैं - बस इसे एक बार "कैप्चर" करें और रेंडर करते समय परिणामी छवि का उपयोग करें। हालांकि, मैं व्यक्तिगत रूप से इसकी संसाधन लागतों को देखते हुए वास्तव में इस विकल्प को पसंद नहीं करता, इसलिए मैंने इसे सूची से हटा दिया।

सही कतरन

मैं आपको अलग से एक और महत्वपूर्ण पहलू के बारे में बताना चाहूंगा जो कि ग्राफिक्स के साथ काम करते समय और "सही" घटकों को बनाने के लिए आवश्यक है - क्लिप के साथ काम करना, या - प्रतिपादन के दौरान अनावश्यक भागों को काट देना।

इस उपकरण का उपयोग करने के लिए, यह उस फॉर्म को निर्दिष्ट करने के लिए पर्याप्त है जिसके द्वारा "क्लिपिंग" उत्पन्न होगी:

g.setClip ( x, y, width, height );
g.setClip ( new Rectangle ( x, y, width, height ) );
g.setClip ( new Rectangle2D.Double ( x, y, width, height ) );

इन तीनों तरीकों से एक ही आयताकार क्लिपिंग क्षेत्र की स्थापना होगी।

ऐसे कई मामले हैं जहां यह उपकरण काम में आ सकता है।
सबसे पहले, किसी भी घटक को प्रस्तुत करते समय, एक निश्चित कतरन रूप हमेशा पूर्वनिर्धारित होता है (आमतौर पर यह घटक की सीमा होती है) - यह घटक को अपनी सीमाओं के "क्रॉल आउट" करने की अनुमति नहीं देता है। अपना विशिष्ट क्लिपिंग क्षेत्र सेट करते समय इसे ध्यान में रखा जाना चाहिए। बस, आप इसे इस तरह से कर सकते हैं:

Shape oldClip = g.getClip ();
Shape newClip = new Rectangle ( x, y, width, height );
Area clip = new Area ( oldClip );
clip.intersect ( new Area ( newClip ) );
g.setClip ( clip );

वास्तव में, आप मौजूदा क्लिपिंग क्षेत्र को नए के साथ जोड़ते हैं। इस तरह आप घटक सीमाओं के रूप में प्रतिबंध नहीं खोएंगे, बल्कि एक नया भी जोड़ सकते हैं जिसकी आपको आवश्यकता है।

यदि आप छाया बनाने के अध्याय पर वापस जाते हैं, और बिंदु 4 पर अधिक सटीक होते हैं - तो छाया के भाग को काटकर इसे बेहतर बनाया जा सकता है:

public static void drawShade ( Graphics2D g2d, Shape shape, Color shadeColor, int width,
Shape clip, boolean round )
{
Shape oldClip = g2d.getClip ();
if ( clip != null )
{
Area finalClip = new Area ( clip );
finalClip.intersect ( new Area ( oldClip ) );
g2d.setClip ( finalClip );
}

Composite comp = g2d.getComposite ();
float currentComposite = 1f;
if ( comp instanceof AlphaComposite )
{
currentComposite = ( ( AlphaComposite ) comp ).getAlpha ();
}

Stroke old = g2d.getStroke ();
width = width * 2;
for ( int i = width; i >= 2; i -= 2 )
{
float opacity = ( float ) ( width - i ) / ( width - 1 );
g2d.setColor ( shadeColor );
g2d.setComposite ( AlphaComposite
.getInstance ( AlphaComposite.SRC_OVER, opacity * currentComposite ) );
g2d.setStroke (
new BasicStroke ( i, round ? BasicStroke.CAP_ROUND : BasicStroke.CAP_BUTT,
BasicStroke.JOIN_ROUND ) );
g2d.draw ( shape );
}
g2d.setStroke ( old );
g2d.setComposite ( comp );

if ( clip != null )
{
g2d.setClip ( oldClip );
}
}

इस प्रकार, इस विधि के लिए वांछित कतरन क्षेत्र को अतिरिक्त रूप से स्थानांतरित करना संभव हो जाता है - विधि स्वयं बाकी काम करेगी।

जैसा कि कुछ परीक्षण दिखाते हैं, गैर-खींचने योग्य भागों (उदाहरण के लिए, स्क्रीन से क्या होता है) को काटने से काम की गति में कोई महत्वपूर्ण वृद्धि नहीं होती है। हालाँकि, यह समझ में आता है, क्योंकि सभी गणना जैसे "क्या, कहाँ और कैसे आकर्षित करें" और रेंडरिंग अभी भी काम करती है, भले ही क्लिप 1 "उपलब्ध" पिक्सेल पर सेट हो। तो "मैनुअल" अनुकूलन ऐसे मामले में बहुत अधिक उपयोगी होगा।

क्लिप, अधिकांश भाग के लिए, जटिल भागों को प्रदान करने और सीमाओं को सही ढंग से प्रतिबंधित करने की सुविधा के लिए बनाया गया था ताकि पड़ोसी घटक एक दूसरे को ओवरलैप न करें।

एनीमेशन

इसलिए, प्राप्त ज्ञान के हिस्से को संयोजित करने और कुछ और दिलचस्प करने का समय है।

एनीमेशन स्वयं को समझने में काफी सरल है और समय के साथ प्रदान की गई वस्तुओं में केवल एक बदलाव का प्रतिनिधित्व करता है। हालांकि, व्यवहार में बहुत अधिक प्रश्न और समस्याएं हैं।

एनीमेशन के प्रकार के आधार पर, बहुत सारे अतिरिक्त कोड की आवश्यकता हो सकती है जो "घटनाओं के विकास" के लिए जिम्मेदार है और परिवर्तनों को प्रदर्शित करता है। यह भी महत्वपूर्ण है कि रिडरिंग करते समय ऑप्टिमाइज़ेशन के बारे में न भूलें - अर्थात्, एनिमेटेड घटक के केवल उन क्षेत्रों को फिर से बनाना उचित है जिसमें परिवर्तन हुए थे। ऐसा करने के लिए, बस रेपेंट (नए आयत (x, y, चौड़ाई, ऊंचाई)) विधि को कॉल करें।

आइए एनीमेशन कार्यान्वयन के एक छोटे से उदाहरण पर विचार करें - हम जेलेबेल के पाठ के माध्यम से चलने वाले चकाचौंध का प्रभाव पैदा करेंगे। ऐसा करने के लिए, हमें पहले यह तय करने की आवश्यकता है कि कार्यान्वयन के लिए हमें क्या स्पष्ट रूप से समझना चाहिए।

आइए "हाइलाइट" के आधार के रूप में एक ढाल (केंद्र में हल्के भूरे रंग से किनारे पर रंग) (काले रंग के लिए) से भरा सर्कल लें। हमें एक अलग टाइमर की भी आवश्यकता है, जो इस चक्र को घटक के शुरू से अंत तक स्थानांतरित करने के लिए जिम्मेदार है।

तो, इस तरह से कुछ घटक प्रस्तुत करना होगा:

private boolean animating = false ;
private int animationX = 0;
private int animationLength = 140;

private float [] fractions = { 0f, 1f };
private Color[] colors = new Color[]{ new Color ( 200, 200, 200 ), new Color ( 0, 0, 0 ) };

protected void paintComponent ( Graphics g )
{
// ,
BufferedImage bi =
new BufferedImage ( getWidth (), getHeight (), BufferedImage.TYPE_INT_ARGB );
Graphics2D g2d = bi.createGraphics ();
g2d.setFont ( g.getFont () );

//
super.paintComponent ( g2d );

//
if ( animating )
{
g2d.setRenderingHint ( RenderingHints.KEY_ANTIALIASING,
RenderingHints.VALUE_ANTIALIAS_ON );

g2d.setComposite ( AlphaComposite.getInstance ( AlphaComposite.SRC_IN ) );
g2d.setPaint ( new RadialGradientPaint ( animationX - animationLength / 2,
getHeight () / 2, animationLength / 2, fractions, colors ) );
g2d.fillRect ( animationX - animationLength, 0, animationLength, getHeight () );
}

//
g2d.dispose ();
g.drawImage ( bi, 0, 0, null );
}

मुख्य बिंदु एक अलग छवि बनाने में छिपा हुआ है जिस पर पाठ खींचा गया है, साथ ही हाइलाइट को प्रस्तुत करते समय समग्र स्थापित करना।

छवि आवश्यक है ताकि केवल उन पिक्सल्स जिनमें पाठ हो उस पर कब्जा कर लिया जाए, अन्यथा, ग्राफ़िक्स AlphaComposite.SRC_IN विधि पर मानक प्रतिपादन के साथ, यह निर्दिष्ट ढाल के साथ पूरे भरे हुए आयत को भर देगा, क्योंकि चार्ट पर पाठ के अलावा, खींचा गया पैनल पहले से ही मौजूद होगा। (पैनल) बैकग्राउंड।

इसलिए, अब यह हमारे लिए एक टाइमर लागू करने के लिए बना हुआ है जो काम करता है, कहते हैं, जब कर्सर JLabel क्षेत्र में प्रवेश करता है:

private static class AnimatedLabel extends JLabel
{
public AnimatedLabel ( String text )
{
super ( text );
setupSettings ();
}

private void setupSettings ()
{
//
setOpaque ( false );
//
setFont ( getFont ().deriveFont ( Font .BOLD ).deriveFont ( 30f ) );

// ,
addMouseListener ( new MouseAdapter()
{
public void mouseEntered ( MouseEvent e )
{
startAnimation ();
}
} );
}

private Timer animator = null ;
private boolean animating = false ;
private int animationX = 0;
private int animationLength = 140;

private float [] fractions = { 0f, 1f };
private Color[] colors = new Color[]{ new Color ( 200, 200, 200 ), new Color ( 0, 0, 0 ) };

private void startAnimation ()
{
// ,
if ( animator != null && animator.isRunning () )
{
return ;
}

//
animating = true ;
animationX = 0;
animator = new Timer ( 1000 / 48, new ActionListener()
{
public void actionPerformed ( ActionEvent e )
{
//
if ( animationX < getWidth () + animationLength )
{
animationX += 10;
AnimatedButton. this .repaint ();
}
else
{
animator.stop ();
}
}
} );
animator.start ();
}

protected void paintComponent ( Graphics g )
{
//
}
}

मुझे संदेह है कि कोड के इस भाग में आपको कुछ भी समझाने की आवश्यकता है (टिप्पणियों में वर्णित के अलावा)।

नतीजतन, हमें ऐसा मज़ेदार प्रभाव मिलता है।

बेशक, यह उदाहरण केवल हिमशैल के टिप है। अच्छी कल्पना के साथ, आप कई दिलचस्प स्थिर या एनिमेटेड चीजें बना सकते हैं।

कुछ तरकीबें

कभी-कभी यह मानक उपकरण को जानने के लिए पर्याप्त नहीं होता है जो आपको आवश्यक है। हमें विभिन्न "ट्रिकी" चीजों का आविष्कार करना होगा। मैं आपके साथ कई अलग-अलग उदाहरणों में जो कुछ भी नेट और "आविष्कारित साइकिल" पर पा सकता हूं, साझा करना चाहूंगा। तो, चलो व्यापार के लिए नीचे उतरो ...

एज स्मूथिंग
माना कि हमें एक निश्चित आकार के अनुसार छवि को क्रॉप करने की आवश्यकता है, लेकिन मानक साधन जैसे क्लिप जब रेंडरिंग एक परिणामी परिणाम देगा। इस स्थिति में, आपको AlphaComposite का उपयोग करना चाहिए:

ImageIcon icon = new ImageIcon ( iconPath );

BufferedImage roundedImage = new BufferedImage ( icon.getIconWidth (), icon.getIconHeight (),
BufferedImage.TYPE_INT_ARGB );
Graphics2D g2d = roundedImage.createGraphics ();
g2d.setRenderingHint ( RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON );
g2d.setPaint ( Color.WHITE );
g2d.fillRoundRect ( 0, 0, icon.getIconWidth (), icon.getIconHeight (), 10, 10 );
g2d.setComposite ( AlphaComposite.getInstance ( AlphaComposite.SRC_IN ) );
g2d.drawImage ( icon.getImage (), 0, 0, null );
g2d.dispose ();

ImageIcon roundedIcon = new ImageIcon ( roundedImage );

इस प्रकार, हम पहले कोनों में चिकनी गोल गोल आयत बनाते हैं, और फिर एक स्टैंसिल के रूप में इसका उपयोग करते हुए, हम शीर्ष पर छवि को ओवरले करते हैं।

कस्टम स्ट्रोक का उपयोग करना
बहुत पहले, मुझे अपनी खुद की स्ट्रोक क्लास लिखने पर एक बहुत दिलचस्प लेख मिला।
कुछ मामलों में, एक समान स्ट्रोक बहुत प्रतिपादन की सुविधा दे सकता है।

ब्लर / शैडो फिल्टर का उपयोग करना
उसी संसाधन पर आप ब्लर पर एक बहुत ही दिलचस्प लेख भी पा सकते हैं।
यह उन लोगों के लिए उपयोगी हो सकता है जो छवियों के साथ काम करते हैं।

ग्लाइफ़ेक्टर का उपयोग करना
ग्राफिक्स के साथ काम करते समय "तनावपूर्ण" क्षणों में से एक पाठ का प्रतिपादन है, खासकर अगर यह पाठ बदल सकता है। पाठ को सही ढंग से स्थिति देने के लिए, आपको उसके आकार की गणना करना होगा और उनके आधार पर आकर्षित करना होगा।
ऐसी गणना के लिए दो उपकरण हैं:
1. फॉन्टमेट्रिक्स
इसे ग्राफिक्स 2 डी उदाहरण (g2d.getFontMetrics ()) से सीधे प्राप्त किया जा सकता है।
यह आपको स्थापित फ़ॉन्ट के विभिन्न आकार और ऊँचाई को परिभाषित करने की अनुमति देता है।
2. ग्लिफ़वेक्टर
यह विकल्प उन मामलों में अधिक उपयोगी होगा जहां आपको पाठ को Y- समन्वय पर केंद्रित करने की आवश्यकता होती है, क्योंकि यह आपको एक निश्चित पाठ के आकार को सटीक रूप से जानने की अनुमति देता है:

FontMetrics fm = g2d.getFontMetrics ();
GlyphVector gv = g2d.getFont ().createGlyphVector ( fm.getFontRenderContext (), "Text" );
Rectangle visualBounds = gv.getVisualBounds ().getBounds ();

इसके अलावा, आप ग्लाइफ़ेक्टर से बहुत सी उपयोगी जानकारी प्राप्त कर सकते हैं, उदाहरण के लिए, पाठ की बाहरी सीमा (सीधे इसका आकार):

Shape textOutline = gv.getOutline ();

अपना खुद का टूलटिप प्रबंधक बनाएं
स्विंग में बहुत सी भद्दा चीजें हैं, हालांकि, घटकों के यूआई को बदलकर या उनके लेआउट के साथ काम करके आसानी से सुचारू किया जा सकता है। कुछ मामलों में, चीजें इतनी सरल नहीं हैं।

सभी J- घटकों के लिए लागू टूलटिप्स की प्रणाली सिर्फ ऐसे मामलों पर लागू होती है। चूंकि दिखाए गए सभी टूलटिप्स एक अलग सख्ती से आयताकार पॉपअप (हल्के या भारी वजन पर निर्भर करते हैं, इस पर निर्भर करते हैं कि टूलटिप खिड़की के भीतर गिरती है) - हम इस क्षेत्र और आकार से सीमित हैं, जो बहुत दुखद है। और यह स्वच्छ वेब इंटरफेस और गोल आकार के युग में है!

बेशक, आप मानक टूलटिपमैनगर को तोड़ सकते हैं, खिड़कियां बनाने के लिए स्थान ढूंढ सकते हैं, उन्हें नई सुविधाओं के माध्यम से वांछित आकार में सेट कर सकते हैं, लेकिन सबसे पहले, यह अभी भी सभी ओएस पर काम नहीं करता है, और दूसरी बात, यह एक बहुत अच्छा और इष्टतम विकल्प नहीं है।

इसलिए, मैं ग्लासपैन का उपयोग करने के विचार के साथ आया, जो सभी मानक खिड़कियों में मौजूद है, टूलटिप डिस्प्ले क्षेत्र के रूप में (और बाद में सभी प्रकार की आंतरिक खिड़कियों पर)।

विचार में ही कई भाग शामिल हैं:
1. एक अलग प्रबंधक ( TooltipManager.java ), जो यदि आवश्यक हो, तो एक विशिष्ट विंडो के लिए एक GlassPane का निर्माण करेगा, जिस पर टूलटिप खुलता है और इसे याद करता है। टूलटिप का आगे का निर्माण सीधे ग्लासपैन में होगा।
2. GlassPane ( TooltipGlassPane.java ) एक पारदर्शी पैनल है जो किसी भी ईवेंट को छोड़ देता है और सही समय पर टूलटिप्स प्रदर्शित करता है
3. टूलटिप स्वयं ( CustomTooltip.java ) एक मानक J- घटक है जो किसी भी सामग्री को सुखद डिज़ाइन में प्रदर्शित करता है, जो GlassPane के स्थान पर निर्भर करता है

परिणामस्वरूप, प्रदर्शित टूलटाइप कुछ इस तरह दिखाई देगा:


आप इस विचार का पूरा कार्यान्वयन नीचे वर्णित पुस्तकालय में देख सकते हैं। बहुत बड़ी मात्रा में कोड होने के कारण मैंने इसका हवाला नहीं दिया। विचार लागू करने वाली कक्षाओं के नाम ऊपर दिए गए हैं और परियोजना में कक्षाओं के नाम के अनुरूप हैं।

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

मुझे लगता है कि हर कोई जिलेट घटक को जानता है, जो कि शुरू में संपादन के लिए प्रदान नहीं करता था। इसलिए, अब मैं दिखाऊंगा कि आप इस कमी को कैसे ठीक कर सकते हैं।

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

public interface ListEditor
{
public void installEditor ( JList list, Runnable startEdit );

public boolean isCellEditable ( JList list, int index, Object value );

public JComponent createEditor ( JList list, int index, Object value );

public Rectangle getEditorBounds ( JList list, int index, Object value , Rectangle cellBounds );

public void setupEditorActions ( JList list, Object value , Runnable cancelEdit,
Runnable finishEdit );

public Object getEditorValue ( JList list, int index, Object oldValue );

public boolean updateModelValue ( JList list, int index, Object value , boolean updateSelection );

public void editStarted ( JList list, int index );

public void editFinished ( JList list, int index, Object oldValue, Object newValue );

public void editCancelled ( JList list, int index );
}

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

public abstract class AbstractListEditor implements ListEditor
{
protected int editedCell = -1;

public void installEditor ( final JList list, final Runnable startEdit )
{
// ,
list.addMouseListener ( new MouseAdapter()
{
public void mouseClicked ( MouseEvent e )
{
if ( e.getClickCount () == 2 && SwingUtilities.isLeftMouseButton ( e ) )
{
startEdit.run ();
}
}
} );
list.addKeyListener ( new KeyAdapter()
{
public void keyReleased ( KeyEvent e )
{
if ( e.getKeyCode () == KeyEvent.VK_F2 )
{
startEdit.run ();
}
}
} );
}

public boolean isCellEditable ( JList list, int index, Object value )
{
return true ;
}

public Rectangle getEditorBounds ( JList list, int index, Object value , Rectangle cellBounds )
{
//
return new Rectangle ( 0, 0, cellBounds.width, cellBounds.height + 1 );
}

public boolean updateModelValue ( JList list, int index, Object value , boolean updateSelection )
{
//
ListModel model = list.getModel ();
if ( model instanceof DefaultListModel )
{
( ( DefaultListModel ) model ).setElementAt ( value , index );
list.repaint ();
return true ;
}
else if ( model instanceof AbstractListModel )
{
final Object[] values = new Object[ model.getSize () ];
for ( int i = 0; i < model.getSize (); i++ )
{
if ( editedCell != i )
{
values[ i ] = model.getElementAt ( i );
}
else
{
values[ i ] = value ;
}
}
list.setModel ( new AbstractListModel()
{
public int getSize ()
{
return values.length;
}

public Object getElementAt ( int index )
{
return values[ index ];
}
} );
return true ;
}
else
{
return false ;
}
}

public void editStarted ( JList list, int index )
{
//
editedCell = index;
}

public void editFinished ( JList list, int index, Object oldValue, Object newValue )
{
//
editedCell = -1;
}

public void editCancelled ( JList list, int index )
{
//
editedCell = -1;
}

public boolean isEditing ()
{
//
return editedCell != -1;
}
}

अब, इस अमूर्त वर्ग के आधार पर, इसे लागू करना काफी सरल होगा, उदाहरण के लिए, सूची के लिए एक पाठ संपादक - यह कुछ इस तरह दिखेगा - WebStringListEditor.java ।

अंतिम क्षण शेष है - सूची में संपादक को स्थापित करने की विधि। इसे एक अलग वर्ग में रखें और इसे सुविधा के लिए स्थिर बनाएं:

public class ListUtils
{
public static void installEditor ( final JList list, final ListEditor listEditor )
{
// ,
final Runnable startEdit = new Runnable()
{
public void run ()
{
//
final int index = list.getSelectedIndex ();
if ( list.getSelectedIndices ().length != 1 || index == -1 )
{
return ;
}

//
final Object value = list.getModel ().getElementAt ( index );
if ( !listEditor.isCellEditable ( list, index, value ) )
{
return ;
}

//
final JComponent editor = listEditor.createEditor ( list, index, value );

//
editor.setBounds ( computeCellEditorBounds ( index, value , list, listEditor ) );
list.addComponentListener ( new ComponentAdapter()
{
public void componentResized ( ComponentEvent e )
{
checkEditorBounds ();
}

private void checkEditorBounds ()
{
Rectangle newBounds =
computeCellEditorBounds ( index, value , list, listEditor );
if ( newBounds != null && !newBounds.equals ( editor.getBounds () ) )
{
editor.setBounds ( newBounds );
list.revalidate ();
list.repaint ();
}
}
} );

//
list.add ( editor );
list.revalidate ();
list.repaint ();

//
if ( editor.isFocusable () )
{
editor.requestFocus ();
editor.requestFocusInWindow ();
}

//
final Runnable cancelEdit = new Runnable()
{
public void run ()
{
list.remove ( editor );
list.revalidate ();
list.repaint ();

listEditor.editCancelled ( list, index );
}
};
final Runnable finishEdit = new Runnable()
{
public void run ()
{
Object newValue = listEditor.getEditorValue ( list, index, value );
boolean changed =
listEditor.updateModelValue ( list, index, newValue, true );

list.remove ( editor );
list.revalidate ();
list.repaint ();

if ( changed )
{
listEditor.editFinished ( list, index, value , newValue );
}
else
{
listEditor.editCancelled ( list, index );
}
}
};
listEditor.setupEditorActions ( list, value , cancelEdit, finishEdit );

//
listEditor.editStarted ( list, index );
}
};
listEditor.installEditor ( list, startEdit );
}

private static Rectangle computeCellEditorBounds ( int index, Object value , JList list,
ListEditor listEditor )
{
//
Rectangle cellBounds = list.getCellBounds ( index, index );
if ( cellBounds != null )
{
Rectangle editorBounds = listEditor.getEditorBounds ( list, index, value , cellBounds );
return new Rectangle ( cellBounds.x + editorBounds.x, cellBounds.y + editorBounds.y,
editorBounds.width, editorBounds.height );
}
else
{
return null ;
}
}
}

बस इतना ही, अब हम संपादक को किसी भी उपलब्ध सूची में कोड की एक पंक्ति के साथ स्थापित कर सकते हैं:


मुख्य बात यह है कि यदि आप मॉडल में गैर-स्ट्रिंगिंगमी का उपयोग करते हैं, तो संपादक से / के लिए मूल्यों को स्थापित करने / प्राप्त करने के तरीकों को बदलना न भूलें। ऐसा करने के लिए, यह WebStringListEditor.java में दो तरीकों (बेशक, आवश्यक संपादक की जटिलता पर निर्भर करता है) को ओवरराइड करने के लिए पर्याप्त है - createEditor और getEditorValue।

वेब लुक और फील

चूंकि मैं स्विंग और ग्राफिक्स (विशेष रूप से हाल ही में) के साथ काम करने के लिए बहुत समय समर्पित करता हूं, इसलिए मुझे एक अलग यूआई लाइब्रेरी, उन्नत घटकों और उपयोगिताओं को बनाने के विचार के साथ आया, जो अक्सर कोड में विभिन्न स्थानों में बहुत आवश्यक होते हैं। और थोड़ा-थोड़ा करके इस विचार को एक अलग पुस्तकालय के रूप में साकार किया जाने लगा - WebLookAndFeel ।

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

वैसे, यह देखते हुए कि मेरी नाक में हमारे वाणिज्यिक उत्पाद के दूसरे संस्करण का विकास है, इस विचार को एक बार फिर इस तरह की कार्यक्षमता और क्षमताओं के लिए आवश्यक आवश्यकता से प्रेरित किया गया था।

दरअसल, पुस्तकालय में इस आलेख में वर्णित अधिकांश तकनीकों के साथ-साथ ग्राफिक्स के साथ काम करने के बारे में कई अन्य रोचक और उपयोगी चीजें शामिल हैं:

• वास्तव में वेब लाफ - एक अलग पूर्ण प्लेटफ़ॉर्म शुद्ध-जावा लाफ
• अतिरिक्त घटकों का एक सेट (वेब ​​लाएफ़ के रूप में भी स्टाइल किया गया है) - फाइलशोसर / कलरचॉज़र / गैलरी / कैलेंडर और कई अन्य (एक महान कई!)
• इसके लिए उपयोगिता कक्षाओं का एक सेट: ग्राफिक्स, फ़ाइलें, पाठ, चित्र और कई अन्य पहलुओं के साथ काम करना (उदाहरण के लिए, URL द्वारा फ़ाइलों को डाउनलोड करने के लिए सरल करना, चित्र पढ़ना, उनके साथ विभिन्न ऑपरेशन, आदि)

यहाँ भी कुछ तकनीकी "लाभ" और विशेषताएं हैं:

• पूरी तरह से क्रॉस-प्लेटफ़ॉर्म और आसानी से अनुकूलन योग्य दिखने वाला (सीधे - विंडोज एक्सपी / विस्टा / 7, मैक ओएस एक्स 10.6.7, उबंटू 9/11 पर परीक्षण किया गया)
• न्यूनतम मेमोरी आवश्यकताएं (-Xms16m -Xmx16m पर चलाना आसान है और यहां तक ​​कि छवियों के साथ भारी संचालन भी किया जाएगा, लाफ और विभिन्न उपयोगिताओं के काम का उल्लेख नहीं करने के लिए)
• सिंगल-जार बंडल - अर्थात, आपकी जरूरत की हर चीज एक सिंगल जार लाइब्रेरी में शामिल है जो सभी ऑपरेटिंग सिस्टम के लिए काम करती है
• JDK 1.6 अपडेट 20 और नए की आवश्यकता है (मैं अभी तक JDK 7 के बारे में कुछ नहीं कह सकता हूं - मैंने इसकी कोशिश नहीं की है, लेकिन सिद्धांत रूप में कोड में किसी भी तरह की चीजों और परीक्षण सुविधाओं का उपयोग नहीं किया गया है)

आप एक अलग साइट पर इसके बारे में अधिक पढ़ सकते हैं।

कई लोगों के लिए, यह लाइब्रेरी एक तरह की "साइकिल" की तरह लग सकती है और कोई यह तर्क दे सकता है कि इस तरह की कार्यक्षमता पहले से ही अन्य प्रसिद्ध कंपनियों में मौजूद है ...
इसके लिए मैं दो बातें कह सकता हूं:
सबसे पहले , अन्य पुस्तकालय अपने घटकों को सबसे अच्छा प्रदान करते हैं, एक विशेष यूआई के लिए स्टाइल की संभावना के साथ (और अक्सर बैसाखी के साथ)। उसी लाइब्रेरी में WebLaF की सामान्य उपस्थिति के लिए पहले से ही तैयार अतिरिक्त घटकों का एक सेट होता है, जो समय के साथ विस्तारित होगा।
दूसरी बात - कुछ अलग चीजें नहीं हैं, जिन्हें मैंने जोड़ा और बस पुस्तकालय में जोड़ने जा रहा हूं। मुझे नेटवर्क की विशालता में ColorChooser का एक भी समझदार कार्यान्वयन नहीं मिला है , जो भयावह JColorChooser को बदल सकता है। कोई अन्य JFileChooser कार्यान्वयन बिल्कुल नहीं हैं। बेशक वहाँ एक SWT है, लेकिन इसके साथ ईमानदार होने के लिए अन्य समस्याएं, कठिनाइयाँ और सीमाएँ हैं, जिनके बारे में मैं गहराई से जाने और इस विकल्प को नहीं फेंकने का सुझाव देता हूँ - यह सब, हम स्विंग के बारे में बात कर रहे हैं।

इसलिए, इंटरफ़ेस और घटकों को "महसूस" करने के अवसर के लिए, मैंने लाइब्रेरी को पूर्ण घटकों के एक छोटे प्रदर्शन के साथ एक वर्ग जोड़ा:

(एक उदाहरण और स्रोत कोड यहां डाउनलोड किया जा सकता है )

पुस्तकालय का पूर्ण स्रोत कोड और वितरण किट साइट पर उपलब्ध है।
http://weblookandfeel.com/download/

फिलहाल, लाइब्रेरी अभी तक पूरी नहीं हुई है और कोड में लुकएंड फ़ील, "अनपेक्षित" स्थानों में मामूली खामियां हैं, साथ ही साथ कुछ कार्यक्षमता और उपस्थिति बहुत "विवादास्पद" बनी हुई है और अभी भी इसे बदल दिया जाएगा। सबसे अच्छा पक्ष।

उपरोक्त सभी के संबंध में, मुझे इस विषय पर कोई टिप्पणी, सुझाव और रचनात्मक आलोचना सुनने में खुशी होगी :)

निष्कर्ष में ...

मुझे उम्मीद है कि अब जावा में ग्राफिक्स के संदर्भ में आपका ज्ञान थोड़ा संरचित हो गया है और व्यवहार में अधिक मूर्त और लागू हो गया है।

मुझे उम्मीद है कि ऊपर प्रस्तुत WebLookAndFeel लाइब्रेरी का सोर्स कोड ग्राफिक्स के साथ काम में महारत हासिल करने में आपकी मदद कर सकता है। इस लेख में शामिल किए गए लोगों की तुलना में कई और दिलचस्प बातें हैं (उदाहरण के लिए, प्रत्येक मानक स्विंग घटकों, लुकएंड फ़ील, वैश्विक प्रबंधकों, आदि के लिए यूआई कक्षाओं के कार्यान्वयन), इसलिए मैं आपको उन्हें अध्ययन करने की सलाह देता हूं (यदि आप समय और इच्छा रखते हैं) जरूर)।

मैं लेखों के प्रकाशन में पर्याप्त रूप से लंबे ब्रेक के लिए माफी माँगता हूँ - सामग्री का संग्रह, अफसोस, मुझे अपेक्षा से अधिक समय लगा, WebLaF लाइब्रेरी को अधिक या कम प्रयोग करने योग्य रूप में लाने का उल्लेख नहीं करने के लिए।

अगला लेख सबसे अधिक संभावना है कि आप अपने खुद के लुकएंडफील (उदाहरण और चित्रों के साथ), और साथ ही व्यक्तिगत जे-घटकों की यूआई की कुछ विशेषताओं को लिखने के लिए समर्पित होंगे।

साधन

विषय पर विभिन्न तृतीय-पक्ष संसाधन:
(लेख में सूचीबद्ध लोगों सहित)

MVC
http://lib.juga.ru/article/articleview/163/1/68/

आकृतियाँ
http://java.sun.com/developer/technorArticles/GUI/ java2d / java2dpart1.html
http://www.datadisk.co.uk/html_docs/java/graphics_java2d.htm

विस्तारित आकृतियाँ
http://java-sl.com/shapes.html
http://geosoft.no/graphics/
http : //designervista.com/shapes/index.php
http://www.jfree.org/j असामान्य /

समग्र
http://download.oracle.com/javase/tutorial/2d/advanced/compositing.html

BasicStroke
http: // /www.projava.net/Glava9/Index13.htm

विस्तारित स्ट्रोक
http://www.jhlabs.com/java/java2d/strokes/

धुंधला
http://www.jhlabs.com/ip/blurring.html

WebLookAndFeel में उपयोग की गई लाइब्रेरी हैं:

java-image- scaling
http://code.google.com/p/java-image-scaling/

TableLayout
http: // java। नेट / प्रोजेक्ट्स / टेबल-आउट

डेटा टिप्स
दुर्भाग्य से, वर्तमान में इस लाइब्रेरी के लिए कोई संसाधन उपलब्ध नहीं हैं

जेरिको एचटीएमएल पार्सर
http://jericho.htmlparser.net/docs/index.html

और आइकन सेट:

फॉग आइकन्स
http://code.google। com / p / fugue-icons-src /

Fatcow आइकन्स
http://www.fatcow.com/free-icons

विशेष धन्यवाद ...

पठनीय कोड हाइलाइटिंग के लिए सोर्स कोड हाइलाइटर प्रोजेक्ट :
http://virtser.net/blog/post/source-code-highlighter.aspx

और छवियों को संग्रहीत करने के लिए इमेज होस्टिंग :
http://hostingkartinok.com/

Update1, लिंक को थोड़ा ठीक किया और चित्र अद्यतन
2: विभिन्न अशुद्धियों और समस्याओं के समाधान के साथ अद्यतित लाइब्रेरी वितरण अद्यतन 3 का
सामना करना पड़ा: लेख में गलत त्रुटियां और कुटिल छवियां