अकसर किये गए सवाल: ICON / SPLASH SCREEN (कॉर्डोवा 5.x / 2015)
मैं अपना जवाब एक सामान्य FAQ के रूप में प्रस्तुत करता हूं जो आपको आइकनों / स्प्लैश स्क्रीन के साथ काम करते समय कई समस्याओं को हल करने में मदद कर सकता है। आपको मेरी तरह पता चल सकता है कि प्रलेखन हमेशा बहुत स्पष्ट नहीं है और न ही आज तक। यह उपलब्ध होने पर संभवतः StackOverflow प्रलेखन में जाएगा।
पहला: सवाल का जवाब देना
मैं फोनगैप के साथ आईओएस और एंड्रॉइड के लिए कस्टम ऐप आइकन कैसे जोड़ सकता हूं?
कॉर्डोवा के आपके संस्करण मेंicon
टैग बेकार है। यह कॉर्डोवा 3.0.0 में भी प्रलेखित नहीं है। आपको प्रलेखन संस्करण का उपयोग करना चाहिए जो आपके द्वारा उपयोग किए जा रहे क्ली को फिट करता है और नवीनतम को नहीं!
आइकन टैग मैं क्या प्रलेखन के विभिन्न संस्करणों में देख सकते हैं के अनुसार संस्करण 3.5.0 से पहले सभी पर Android के लिए काम नहीं करता। 3.4.0 में वे अभी भी फ़ाइलों को मैन्युअल रूप से कॉपी करने की सलाह देते हैं
नए संस्करणों में : config.xml
नए कॉर्डोवा संस्करणों के लिए आपका रूप बेहतर है। हालाँकि अभी भी कई चीजें हैं जिन्हें आप जानना चाहते हैं। यदि आप यहां अपग्रेड करने का निर्णय लेते हैं तो संशोधित करने के लिए कुछ उपयोगी चीजें हैं:
- आपको
gap:
नामस्थान की आवश्यकता नहीं है
- आपको
<preference name="SplashScreen" value="screen" />
Android की आवश्यकता है
यहां उन सवालों के अधिक विवरण दिए गए हैं जो आप आइकन और स्प्लैश स्क्रीन से निपटने की कोशिश करते समय पूछ सकते हैं:
क्या मैं कॉर्डोवा / फोनगैप के पुराने संस्करण का उपयोग कर सकता हूं
नहीं, आइकन / स्प्लैशस्क्रीन सुविधा कॉर्डोवा के पूर्व संस्करणों में नहीं थी, इसलिए आपको हाल के संस्करण का उपयोग करना होगा। पूर्व संस्करणों में, केवल Phonegap Build ने आइकन / स्प्लैश स्क्रीन को हैंडल किया था इसलिए स्थानीय रूप से निर्माण करना और आइकन को हैंडल करना केवल हुक के साथ ही संभव था। मैं इस सुविधा का उपयोग करने के लिए न्यूनतम संस्करण नहीं जानता, लेकिन 5.1.1 के साथ यह कॉर्डोवा / फोनगैप क्ली दोनों में ठीक काम करता है। कॉर्डोवा 3.5 के साथ यह मेरे लिए काम नहीं किया।
संपादित करें : Android के लिए आपको कम से कम 3.5.0 का उपयोग करना चाहिए
मैं आइकन के बारे में निर्माण प्रक्रिया को कैसे डीबग कर सकता हूं?
Cli एक CP कमांड का उपयोग करता है। यदि आप एक अमान्य आइकन पथ प्रदान करते हैं, तो यह एक cp
त्रुटि दिखाएगा :
sebastien@sebastien-xps:cordova (dev *+$%)$ cordova run android --device
cp: no such file or directory: /home/sebastien/Desktop/Stample-react/cordova/res/www/stample_splash.png
संपादित करें : cordova build <platform> --verbose
जहां आपके आइकन कॉपी किए जाते हैं, वहां देखने के लिए आपके पास cp कमांड उपयोग के लॉग प्राप्त करने के लिए उपयोग है
आइकन को कॉन्फिगर के हिसाब से फोल्डर में जाना चाहिए। मेरे लिए यह कई सबफ़ोल्डर्स में जाता है:platforms/android/build/intermediates/res/armv7/debug/drawable-hdpi-v4/icon.png
फिर आप एपीके को पा सकते हैं, और इसे आइकनों की जांच के लिए ज़िप संग्रह के रूप में खोल सकते हैं। उन्हें एक res/drawable*
फ़ोल्डर में होना चाहिए क्योंकि यह Android के लिए एक विशेष फ़ोल्डर है।
मुझे अपने प्रोजेक्ट में आइकन / स्प्लैश स्क्रीन कहां से डालनी चाहिए?
कई उदाहरणों में आप पाएंगे कि आइकन / स्प्लैश स्क्रीन एक res
फ़ोल्डर के अंदर घोषित किए गए हैं । यह res
आउटपुट एपीके में एक विशेष एंड्रॉइड फ़ोल्डर है, लेकिन इसका मतलब यह नहीं है कि आपको res
अपने प्रोजेक्ट में एक फ़ोल्डर का उपयोग करना होगा।
आप अपने आइकन को कहीं भी रख सकते हैं, लेकिन आपके द्वारा उपयोग किया जाने वाला पथ परियोजना की जड़ के सापेक्ष होना चाहिए , और www
इसलिए ध्यान नहीं रखना चाहिए! यह प्रलेखित है, लेकिन स्पष्ट रूप से नहीं क्योंकि सभी उदाहरण उपयोग कर रहे हैं res
और आपको नहीं पता कि यह फ़ोल्डर कहां है :(
मेरा मतलब है अगर आप आइकन को पूरी तरह से अपने पथ में www/icon.png
शामिल www
करते हैं।
मंगल २०१६ को संपादित करें : मेरे संस्करणों को अपग्रेड करने के बाद, अब ऐसा लगता है कि आइकन www
फ़ोल्डर के सापेक्ष हैं लेकिन दस्तावेज़ीकरण नहीं बदला गया है ( मुद्दा )
<icon src="icon.png"/>
काम करता है ?
नहीं, यह नहीं है! ।
एंड्रॉइड पर, ऐसा लगता है कि यह पहले काम करता था (जब घनत्व विशेषता अभी तक समर्थित नहीं थी?) लेकिन अब नहीं। इस कॉर्डोवा मुद्दे को देखें
IOS पर, ऐसा लगता है कि इस वैश्विक घोषणा का उपयोग अधिक विशिष्ट घोषणाओं को ओवरराइड कर सकता है, इसलिए ध्यान रखें और --verbose
जैसा कि अपेक्षित है, सब कुछ सुनिश्चित करने के लिए निर्माण करें।
क्या मैं सभी घनत्वों के लिए एक ही आइकन / स्प्लैश स्क्रीन फ़ाइल का उपयोग कर सकता हूं।
हाँ तुम कर सकते हो। तुम भी दोनों आइकन के लिए एक ही फ़ाइल का उपयोग कर सकते हैं, और स्क्रीन छप (बस परीक्षण करने के लिए!)। मैंने बिना किसी समस्या के 65kb की "बड़ी" आइकन फ़ाइल का उपयोग किया है।
प्लेटफ़ॉर्म टैग बनाम प्लेटफ़ॉर्म विशेषता का उपयोग करते समय क्या अंतर है
<icon src="icon.png" platform="android" density="ldpi" />
के समान है
<platform name="android">
<icon src="www/stample_icon.png" density="ldpi" />
</platform>
क्या मुझे फोन गैप का उपयोग करते हुए गैप: नेमस्पेस का उपयोग करना चाहिए?
मेरे अनुभव में फोनगैप या कॉर्डोवा के नए संस्करण दोनों किसी भी gap:
xml नाम स्थान का उपयोग किए बिना आइकन घोषणाओं को समझने में सक्षम हैं ।
हालाँकि मैं अभी भी यहाँ एक मान्य उत्तर की प्रतीक्षा कर रहा हूँ: कॉर्डोवा / फोनगैप प्लगइन वी.एस. config.xml जोड़ें
जहाँ तक मैं समझता हूँ, gap:
नाम स्थान के साथ कुछ सुविधाएँ पहले PhonegapBuild में, उसके बाद Phonegap में और फिर Cordova (?) में पोर्ट की जा सकती हैं।
की <preference name="SplashScreen" value="screen" />
आवश्यकता है?
कम से कम Android के लिए हाँ यह है। मैंने अतिरिक्त स्पष्टीकरण के साथ एक मुद्दा खोला ।
क्या आइकन घोषणा आदेश मायने रखता है?
हाँ यह करता है! एंड्रॉइड पर इसका कोई प्रभाव नहीं हो सकता है लेकिन मेरे परीक्षणों के अनुसार आईओएस पर इसका प्रभाव है। यह अप्रत्याशित और अनैच्छिक व्यवहार है इसलिए मैंने एक और मुद्दा खोला ।
क्या मुझे जरूरत है cordova-plugin-splashscreen
?
यदि आप स्प्लैश स्क्रीन को काम करना चाहते हैं, तो हां, इसकी पूरी आवश्यकता है। प्रलेखन स्पष्ट नहीं है ( मुद्दा ) और हमें लगता है कि प्लगइन केवल एक स्प्लैश स्क्रीन जावास्क्रिप्ट एपीआई की पेशकश करने के लिए आवश्यक है।
मैं तेजी से सभी चौड़ाई / ऊंचाई / घनत्व के लिए छवियों का आकार कैसे बदल सकता हूं
ऐसा करने में आपकी मदद करने के लिए उपकरण हैं। मेरे लिए सबसे अच्छा एक http://makeappicon.com/ है, लेकिन इसके लिए एक ईमेल पता प्रदान करना होगा।
अन्य संभावित समाधान हैं:
क्या आप मुझे एक उदाहरण विन्यास दे सकते हैं?
हाँ। यहाँ मेरा असली हैconfig.xml
<?xml version='1.0' encoding='utf-8'?>
<widget id="co.x" version="0.2.6" xmlns="http://www.w3.org/ns/widgets" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:cdv="http://cordova.apache.org/ns/1.0" xmlns:gap="http://phonegap.com/ns/1.0">
<name>x</name>
<description>
x
</description>
<author email="info@x.co" href="https://x.co">
x
</author>
<content src="index.html" />
<preference name="permissions" value="none" />
<preference name="webviewbounce" value="false" />
<preference name="StatusBarOverlaysWebView" value="false" />
<preference name="StatusBarBackgroundColor" value="#0177C6" />
<preference name="detect-data-types" value="true" />
<preference name="stay-in-webview" value="false" />
<preference name="android-minSdkVersion" value="14" />
<preference name="android-targetSdkVersion" value="22" />
<preference name="phonegap-version" value="cli-5.1.1" />
<preference name="SplashScreenDelay" value="10000" />
<preference name="SplashScreen" value="screen" />
<plugin name="cordova-plugin-device" spec="1.0.1" />
<plugin name="cordova-plugin-console" spec="1.0.1" />
<plugin name="cordova-plugin-whitelist" spec="1.1.0" />
<plugin name="cordova-plugin-crosswalk-webview" spec="1.2.0" />
<plugin name="cordova-plugin-statusbar" spec="1.0.1" />
<plugin name="cordova-plugin-screen-orientation" spec="1.3.6" />
<plugin name="cordova-plugin-splashscreen" spec="2.1.0" />
<access origin="http://*" />
<access origin="https://*" />
<access launch-external="yes" origin="tel:*" />
<access launch-external="yes" origin="geo:*" />
<access launch-external="yes" origin="mailto:*" />
<access launch-external="yes" origin="sms:*" />
<access launch-external="yes" origin="market:*" />
<platform name="android">
<icon src="www/stample_icon.png" density="ldpi" />
<icon src="www/stample_icon.png" density="mdpi" />
<icon src="www/stample_icon.png" density="hdpi" />
<icon src="www/stample_icon.png" density="xhdpi" />
<icon src="www/stample_icon.png" density="xxhdpi" />
<icon src="www/stample_icon.png" density="xxxhdpi" />
<splash src="www/stample_splash.png" density="land-hdpi"/>
<splash src="www/stample_splash.png" density="land-ldpi"/>
<splash src="www/stample_splash.png" density="land-mdpi"/>
<splash src="www/stample_splash.png" density="land-xhdpi"/>
<splash src="www/stample_splash.png" density="land-xhdpi"/>
<splash src="www/stample_splash.png" density="land-xhdpi"/>
<splash src="www/stample_splash.png" density="port-hdpi"/>
<splash src="www/stample_splash.png" density="port-ldpi"/>
<splash src="www/stample_splash.png" density="port-mdpi"/>
<splash src="www/stample_splash.png" density="port-xhdpi"/>
<splash src="www/stample_splash.png" density="port-xxhdpi"/>
<splash src="www/stample_splash.png" density="port-xxxhdpi"/>
</platform>
<platform name="ios">
<icon src="www/stample_icon.png" width="180" height="180" />
<icon src="www/stample_icon.png" width="60" height="60" />
<icon src="www/stample_icon.png" width="120" height="120" />
<icon src="www/stample_icon.png" width="76" height="76" />
<icon src="www/stample_icon.png" width="152" height="152" />
<icon src="www/stample_icon.png" width="40" height="40" />
<icon src="www/stample_icon.png" width="80" height="80" />
<icon src="www/stample_icon.png" width="57" height="57" />
<icon src="www/stample_icon.png" width="114" height="114" />
<icon src="www/stample_icon.png" width="72" height="72" />
<icon src="www/stample_icon.png" width="144" height="144" />
<icon src="www/stample_icon.png" width="29" height="29" />
<icon src="www/stample_icon.png" width="58" height="58" />
<icon src="www/stample_icon.png" width="50" height="50" />
<icon src="www/stample_icon.png" width="100" height="100" />
<splash src="www/stample_splash.png" width="320" height="480"/>
<splash src="www/stample_splash.png" width="640" height="960"/>
<splash src="www/stample_splash.png" width="768" height="1024"/>
<splash src="www/stample_splash.png" width="1536" height="2048"/>
<splash src="www/stample_splash.png" width="1024" height="768"/>
<splash src="www/stample_splash.png" width="2048" height="1536"/>
<splash src="www/stample_splash.png" width="640" height="1136"/>
<splash src="www/stample_splash.png" width="750" height="1334"/>
<splash src="www/stample_splash.png" width="1242" height="2208"/>
<splash src="www/stample_splash.png" width="2208" height="1242"/>
</platform>
<allow-intent href="*" />
<engine name="browser" spec="^3.6.0" />
<engine name="android" spec="^4.0.2" />
</widget>
उदाहरणों का एक अच्छा स्रोत स्टार्टर किट हैं। जैसे फोनगैप-स्टार्ट या आयोनिक स्टार्टर