JavaFX में दृश्य बिल्डर का उपयोग कर एंकरपैन में पृष्ठभूमि-छवि को कैसे जोड़ा जाए?

Question

दृश्य बिल्डर का उपयोग कर AnchorPane पर पृष्ठभूमि छवि को कैसे जोड़ें?

मैं के रूप में यह कोशिश की है:

-fx-background-image url('C:/Users/Documents/page_background.gif') 

मैं Scene Builder में इस सेट कैसे।

और उत्पन्न FXML:

<AnchorPane id="LoginAnchorPane" fx:id="LoginAnchorPane" prefHeight="400.0" prefWidth="600.0" style="-fx-background-image: url('C:/Users/Documents/page_background.gif');" xmlns="http://javafx.com/javafx/8.0.60" xmlns:fx="http://javafx.com/fxml/1" fx:controller="javafx_lsdu.LoginController"> 

Answer 1

आप के रूप में दृश्य बिल्डर में यह सीधे सेट करने का प्रयास कर सकते हैं:

-fx-background-image: url('file:C:/Users/Documents/page_background.gif') 

यह योजना/प्रोटोकॉल निर्दिष्ट करने की आवश्यकता है।

लेकिन सीएसएस फ़ाइल में सीएसएस स्टाइल को अलग करने के लिए सुझाए गए तरीके।

application.css

.anchor { 
    -fx-background-image:url('file:/C:/Users/Documents/page_background.gif'); 
} 

फिर FXML फ़ाइल में आप इस स्टाइलशीट जोड़ें: उदाहरण के लिए यदि आप अपने सीएसएस फ़ाइल में एक सीएसएस शैली श्रेणी बना सकते हैं (यह "application.css" कहते हैं) जड़ और आप AnchorPane को anchor शैली स्तरीय जोड़ें:

<AnchorPane prefHeight="545.0" prefWidth="712.0" styleClass="anchor" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8.0.60"> 
    <stylesheets> 
    <URL value="@application.css" /> 
    </stylesheets> 
</AnchorPane> 

नोट: स्टाइलशीट रूट नोड में जोड़ा जाना चाहिए (उदाहरण के AnchorPane में जड़ है)।

Answer 2

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

1) मैंने फ़ोटोशॉप के साथ अपनी पृष्ठभूमि तस्वीर संपादित की, आकार को मेरे एंकरपैन, 800 x 600 पिक्सेल के समान आकार प्राप्त करने के लिए। मैंने फ़ोटोशॉप, एक ही आकार में एक नई खाली फ़ाइल भी बनाई। फ़ाइल, नई, खाली फ़ाइल। तब मैंने अपनी पृष्ठभूमि तस्वीर की प्रतिलिपि बनाई और इसे खाली फ़ाइल के शीर्ष पर चिपकाया, ताकि मुझे अस्पष्टता 50% (पारदर्शिता) सेट करने में सक्षम बनाया जा सके। मुझे यह पसंद है, यह मेरी पृष्ठभूमि तस्वीर "मुलायम" बनाता है।

2) मैंने अपनी नेटबीन परियोजना के स्रोत (स्रोत) फ़ोल्डर में अपनी 50% अस्पष्टता (50% पारदर्शी) पृष्ठभूमि चित्र की प्रतिलिपि बनाई। Src फ़ोल्डर एक साधारण विंडोज एक्सप्लोरर फ़ोल्डर है।

3) पृष्ठभूमि फ़ोल्डर से पृष्ठभूमि जेपीजी छवि को छवि फ़ोल्डर के रूप में एक छवि दृश्य के रूप में खींचें और ड्रॉप करें, एंकरपैन आइकन (नोड) पर जो दस्तावेज़, पदानुक्रम में है। दृश्य बिल्डर के बाएं हाथ की ओर। यदि ImageView कहीं और गिरता है, तो इसे उस स्थान पर खींचें जहां यह संबंधित है, आप इसे एंकरपैन में चाहते हैं, यह पृष्ठभूमि है।

4) आपकी पृष्ठभूमि छवि के साथ छवि दृश्य दृश्य (हाइलाइट) दृश्य बिल्डर, इंस्पेक्टर, लेआउट: छवि दृश्य के दाईं ओर पैनल पर सेटिंग्स को ठीक करें। एंकर फलक बाधाओं (स्पाइडर वेब चीज) को 0 से ऊपर और ऊपर सेट करें, और आकार, फिट चौड़ाई 800, फिट ऊंचाई 600 को ठीक करें।

पाई जितना आसान हो। कोडिंग की कोई आवश्यकता नहीं है, सीन बिल्डर स्वचालित रूप से आपके लिए कोड लिखता है। एक सीएसएस फ़ाइल की कोई ज़रूरत नहीं है। क्या खुशी है, आप देख सकते हैं कि आप क्या कर रहे हैं। Wysiwyg, जो आप देखते हैं वह आपको मिलता है।