| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8"> |
| <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> |
| <meta name="format-detection" content="telephone=no"> |
| <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" /> |
| <meta name="description" content="Learn how to customize icons for your Cordova application. "> |
| |
| <title> |
| |
| |
| Customize app icons - Apache Cordova |
| |
| |
| </title> |
| |
| <link rel="SHORTCUT ICON" href="/favicon.ico"/> |
| |
| |
| |
| |
| |
| |
| <link rel="canonical" href="https://cordova.apache.org/docs/en/8.x/config_ref/images.html"> |
| |
| <!-- CSS --> |
| <link rel="stylesheet" type="text/css" href="/static/css/main.css"> |
| <link rel="stylesheet" type="text/css" href="/static/css/lib/syntax.css"> |
| |
| <!-- Fonts --> |
| <!-- For attribution information, see www/attributions.html --> |
| <link href='https://fonts.googleapis.com/css?family=Raleway:700,400,300,700italic,400italic,300italic' rel='stylesheet' type='text/css'> |
| |
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> |
| <!--[if lt IE 9]> |
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> |
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> |
| <![endif]--> |
| <script type="text/javascript"> |
| var disqus_developer = 1; // this would set it to developer mode |
| </script> |
| |
| <!-- JS --> |
| <script defer type="text/javascript" src="/static/js/lib/jquery-2.1.1.min.js"></script> |
| <script defer type="text/javascript" src="/static/js/lib/bootstrap.min.js"></script> |
| |
| <!-- Matomo --> |
| <script> |
| var _paq = window._paq = window._paq || []; |
| /* tracker methods like "setCustomDimension" should be called before "trackPageView" */ |
| _paq.push(['trackPageView']); |
| _paq.push(['enableLinkTracking']); |
| (function() { |
| var u="https://analytics.apache.org/"; |
| _paq.push(['setTrackerUrl', u+'matomo.php']); |
| _paq.push(['setSiteId', '16']); |
| var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; |
| g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s); |
| })(); |
| </script> |
| <!-- End Matomo Code --> |
| |
| |
| </head> |
| |
| <body> |
| <header> |
| <a class="scroll-point pt-top" name="top"></a> |
| <nav class="navbar navbar-inverse navbar-fixed-top"> |
| <div class="container-fluid"> |
| <div class="navbar-header"> |
| <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> |
| <span class="sr-only">Toggle navigation</span> |
| <span class="icon-bar"></span> |
| <span class="icon-bar"></span> |
| <span class="icon-bar"></span> |
| </button> |
| <a class="navbar-brand" href="/"><img id="logo_top" src="/static/img/cordova-logo-newbrand.svg"/></a> |
| </div> |
| <div id="navbar" class="navbar-collapse collapse"> |
| <div class="nav_bar_center"> |
| <ul class="nav navbar-nav"> |
| <li class="active"> |
| <a href="/docs/en/latest/">Documentation</a> |
| </li> |
| <li > |
| <a href="/plugins">Plugins</a> |
| </li> |
| <li > |
| <a href="/blog" id="blog_button">Blog<span class="badge" id="new_blog_count"></span></a> |
| </li> |
| <li > |
| <a href="/contribute">Contribute</a> |
| </li> |
| <li > |
| <a href="/contribute/team.html">Team</a> |
| </li> |
| <li> |
| <a href="/#getstarted">Get Started</a> |
| </li> |
| <li> |
| <form class="navbar-form navbar-right" id="header-search-form" role="search"> |
| <div class="input-group"> |
| |
| </div> |
| </form> |
| </li> |
| </ul> |
| </div> |
| </div><!--/.navbar-collapse --> |
| </div> |
| </nav> |
| <div id="_fixed_navbar_spacer" style="padding-top:50px"></div> |
| </header> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <div class="docs"> |
| |
| <!-- Table of Contents --> |
| <div class="hidden-xs hidden-sm site-toc-container"> |
| <ul class="site-toc"> |
| |
| |
| <li> |
| |
| <span class="toc-section-heading"> |
| Introduction |
| </span> |
| |
| |
| |
| |
| |
| |
| <ul class="site-toc"> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/overview/index.html"> |
| Overview |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| </ul> |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <span class="toc-section-heading"> |
| Create apps |
| </span> |
| |
| |
| |
| |
| |
| |
| <ul class="site-toc"> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/cli/index.html"> |
| Create your first app |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/cli/template.html"> |
| Templates for apps |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/support/index.html"> |
| Platform support |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <span class="toc-section-heading"> |
| Develop for platforms |
| </span> |
| |
| |
| |
| |
| |
| |
| <ul class="site-toc"> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/platforms/android/index.html"> |
| Android |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/platforms/ios/index.html"> |
| iOS |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/platforms/windows/index.html"> |
| Windows |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/platforms/osx/index.html"> |
| OS X |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| </ul> |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/platform_plugin_versioning_ref/index.html"> |
| Manage versions and platforms |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="this-page" href="/docs/en/8.x/config_ref/images.html"> |
| Customize icons |
| </a> |
| |
| <span class="entry-highlight"></span> |
| |
| |
| |
| |
| <div id="page-toc" class="page-toc"></div> |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/cordova/storage/storage.html"> |
| Store data |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/appdev/privacy/index.html"> |
| Manage privacy |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/appdev/security/index.html"> |
| Manage security |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/appdev/whitelist/index.html"> |
| Whitelisting |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| </ul> |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <span class="toc-section-heading"> |
| Create plugins |
| </span> |
| |
| |
| |
| |
| |
| |
| <ul class="site-toc"> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/hybrid/plugins/index.html"> |
| Create a plugin |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <span class="toc-section-heading"> |
| Develop for platforms |
| </span> |
| |
| |
| |
| |
| |
| |
| <ul class="site-toc"> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/platforms/android/plugin.html"> |
| Android |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/platforms/ios/plugin.html"> |
| iOS |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/platforms/windows/plugin.html"> |
| Windows |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| </ul> |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/plugin_ref/plugman.html"> |
| Use Plugman |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| </ul> |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <span class="toc-section-heading"> |
| Advanced Topics |
| </span> |
| |
| |
| |
| |
| |
| |
| <ul class="site-toc"> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/hybrid/webviews/index.html"> |
| Embed Cordova in native apps |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/next/index.html"> |
| Next Steps |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| </ul> |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <span class="toc-section-heading"> |
| Reference |
| </span> |
| |
| |
| |
| |
| |
| |
| <ul class="site-toc"> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/config_ref/index.html"> |
| Config.xml |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/cordova/events/events.html"> |
| Events |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-cli/index.html"> |
| CLI Reference |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/guide/appdev/hooks/index.html"> |
| Hooks |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/plugin_ref/spec.html"> |
| Plugin.xml |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <span class="toc-section-heading"> |
| Plugin APIs |
| </span> |
| |
| |
| |
| |
| |
| |
| <ul class="site-toc"> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-battery-status/index.html"> |
| Battery Status |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-camera/index.html"> |
| Camera |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-device/index.html"> |
| Device |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-dialogs/index.html"> |
| Dialogs |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-file/index.html"> |
| File |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-geolocation/index.html"> |
| Geolocation |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-inappbrowser/index.html"> |
| Inappbrowser |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-media/index.html"> |
| Media |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-media-capture/index.html"> |
| Media Capture |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-network-information/index.html"> |
| Network Information |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-screen-orientation/index.html"> |
| Screen Orientation |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-splashscreen/index.html"> |
| Splashscreen |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-statusbar/index.html"> |
| Statusbar |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-vibration/index.html"> |
| Vibration |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| |
| <li> |
| |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-whitelist/index.html"> |
| Whitelist |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| </li> |
| |
| </ul> |
| |
| |
| </li> |
| |
| </ul> |
| |
| |
| </li> |
| |
| </ul> |
| |
| </div> |
| |
| <!-- Page content --> |
| <div class="page-content-container"> |
| <div class="page-content"> |
| <div class="content-header"> |
| |
| <!-- ToC Dropdown (for XS and SM sizes only) --> |
| <div class="toc-dropdown dropdown visible-xs-block visible-sm-block"> |
| <button class="btn btn-default dropdown-toggle" type="button" id="tocDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> |
| Table of Contents |
| <span class="caret"></span> |
| </button> |
| <ul class="dropdown-menu"> |
| |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/overview/index.html"> |
| Overview |
| </a> |
| </li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/cli/index.html"> |
| Create your first app |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/cli/template.html"> |
| Templates for apps |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/support/index.html"> |
| Platform support |
| </a> |
| </li> |
| |
| |
| |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/platforms/android/index.html"> |
| Android |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/platforms/ios/index.html"> |
| iOS |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/platforms/windows/index.html"> |
| Windows |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/platforms/osx/index.html"> |
| OS X |
| </a> |
| </li> |
| |
| |
| |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/platform_plugin_versioning_ref/index.html"> |
| Manage versions and platforms |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="this-page" href="/docs/en/8.x/config_ref/images.html"> |
| Customize icons |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/cordova/storage/storage.html"> |
| Store data |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/appdev/privacy/index.html"> |
| Manage privacy |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/appdev/security/index.html"> |
| Manage security |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/appdev/whitelist/index.html"> |
| Whitelisting |
| </a> |
| </li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/hybrid/plugins/index.html"> |
| Create a plugin |
| </a> |
| </li> |
| |
| |
| |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/platforms/android/plugin.html"> |
| Android |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/platforms/ios/plugin.html"> |
| iOS |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/platforms/windows/plugin.html"> |
| Windows |
| </a> |
| </li> |
| |
| |
| |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/plugin_ref/plugman.html"> |
| Use Plugman |
| </a> |
| </li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/hybrid/webviews/index.html"> |
| Embed Cordova in native apps |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/next/index.html"> |
| Next Steps |
| </a> |
| </li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/config_ref/index.html"> |
| Config.xml |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/cordova/events/events.html"> |
| Events |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-cli/index.html"> |
| CLI Reference |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/guide/appdev/hooks/index.html"> |
| Hooks |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/plugin_ref/spec.html"> |
| Plugin.xml |
| </a> |
| </li> |
| |
| |
| |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-battery-status/index.html"> |
| Battery Status |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-camera/index.html"> |
| Camera |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-device/index.html"> |
| Device |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-dialogs/index.html"> |
| Dialogs |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-file/index.html"> |
| File |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-geolocation/index.html"> |
| Geolocation |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-inappbrowser/index.html"> |
| Inappbrowser |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-media/index.html"> |
| Media |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-media-capture/index.html"> |
| Media Capture |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-network-information/index.html"> |
| Network Information |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-screen-orientation/index.html"> |
| Screen Orientation |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-splashscreen/index.html"> |
| Splashscreen |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-statusbar/index.html"> |
| Statusbar |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-vibration/index.html"> |
| Vibration |
| </a> |
| </li> |
| |
| |
| |
| |
| <li> |
| <a class="" href="/docs/en/8.x/reference/cordova-plugin-whitelist/index.html"> |
| Whitelist |
| </a> |
| </li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| </ul> |
| </div> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a class="edit" href="https://github.com/apache/cordova-docs/tree/master/www/docs/en/8.x/config_ref/images.md"><span class="glyphicon glyphicon-pencil" aria-hidden="true"></span> </a> |
| |
| |
| |
| <!-- Version dropdown --> |
| <div class="dropdown"> |
| <button class="btn btn-default dropdown-toggle" type="button" id="versionDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> |
| 8.x |
| |
| <span class="caret"></span> |
| </button> |
| <ul class="dropdown-menu" aria-labelledby="versionDropdown"> |
| |
| <!-- List versions available in this language --> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/dev/" class="missing-page"> |
| |
| |
| dev |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/latest/" class="missing-page"> |
| |
| |
| 12.x |
| |
| (Latest) |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/11.x/" class="missing-page"> |
| |
| |
| 11.x |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/10.x/" class="missing-page"> |
| |
| |
| 10.x |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/9.x/" class="missing-page"> |
| |
| |
| 9.x |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/8.x/" class="missing-page"> |
| |
| <span class="selected"> |
| |
| 8.x |
| |
| |
| </span> |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/7.x/" class="missing-page"> |
| |
| |
| 7.x |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/6.x/" class="missing-page"> |
| |
| |
| 6.x |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/5.4.0/" class="missing-page"> |
| |
| |
| 5.4.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/5.1.1/" class="missing-page"> |
| |
| |
| 5.1.1 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/5.0.0/" class="missing-page"> |
| |
| |
| 5.0.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/4.0.0/" class="missing-page"> |
| |
| |
| 4.0.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/3.6.0/" class="missing-page"> |
| |
| |
| 3.6.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/3.5.0/" class="missing-page"> |
| |
| |
| 3.5.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/3.4.0/" class="missing-page"> |
| |
| |
| 3.4.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/3.3.0/" class="missing-page"> |
| |
| |
| 3.3.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/3.2.0/" class="missing-page"> |
| |
| |
| 3.2.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/3.1.0/" class="missing-page"> |
| |
| |
| 3.1.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/3.0.0/" class="missing-page"> |
| |
| |
| 3.0.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/2.9.0/" class="missing-page"> |
| |
| |
| 2.9.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/2.8.0/" class="missing-page"> |
| |
| |
| 2.8.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/2.7.0/" class="missing-page"> |
| |
| |
| 2.7.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/2.6.0/" class="missing-page"> |
| |
| |
| 2.6.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/2.5.0/" class="missing-page"> |
| |
| |
| 2.5.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/2.4.0/" class="missing-page"> |
| |
| |
| 2.4.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/2.3.0/" class="missing-page"> |
| |
| |
| 2.3.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/2.2.0/" class="missing-page"> |
| |
| |
| 2.2.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/2.1.0/" class="missing-page"> |
| |
| |
| 2.1.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/2.0.0/" class="missing-page"> |
| |
| |
| 2.0.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/1.9.0/" class="missing-page"> |
| |
| |
| 1.9.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/1.8.1/" class="missing-page"> |
| |
| |
| 1.8.1 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/1.8.0/" class="missing-page"> |
| |
| |
| 1.8.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/1.7.0/" class="missing-page"> |
| |
| |
| 1.7.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/1.6.1/" class="missing-page"> |
| |
| |
| 1.6.1 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/1.6.0/" class="missing-page"> |
| |
| |
| 1.6.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| <li> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <a href="/docs/en/1.5.0/" class="missing-page"> |
| |
| |
| 1.5.0 |
| |
| |
| |
| </a> |
| </li> |
| |
| </ul> |
| </div> |
| </div> |
| |
| |
| |
| |
| |
| |
| |
| |
| <!-- Show warnings for special versions --> |
| <!-- dev warning --> |
| |
| |
| <!-- outdated warning --> |
| |
| <div class="alert docs-alert alert-danger" role="alert"> |
| <button type="button" class="close" data-dismiss="alert" aria-label="Close"> |
| <span aria-hidden="true">×</span> |
| </button> |
| This version of the documentation is outdated! |
| <a href="/docs/en/latest/"> |
| Click here for the latest released version. |
| </a> |
| </div> |
| |
| |
| <!-- plugin version warning --> |
| |
| |
| <div id="page-toc-source"> |
| <svg xmlns="http://www.w3.org/2000/svg" hidden="" style="display: none !important"><symbol id="browser" viewBox="461.6 9.3 30 30"><path d="M476.7 10.3c-7.7 0-14 6.3-14 14s6.3 14 14 14 14-6.3 14-14-6.3-14-14-14m9.8 9h-5.1c-.3-2.1-.8-4-1.4-5.5 2.8.9 5.1 2.9 6.5 5.5m-6.8 5-.1 3h-5.8l-.1-3 .1-3h5.8l.1 3m-3 11h-.9c-.6-1.1-1.4-3.1-1.8-6h5.3c-.4 2.9-1.1 4.8-1.8 6h-.8m-2.7-16c.4-2.9 1.1-4.8 1.8-6h1.8c.6 1.1 1.4 3.1 1.8 6H474zm-.6-5.5c-.6 1.5-1.1 3.4-1.4 5.5h-5.1c1.3-2.6 3.6-4.6 6.5-5.5m-7.3 7.5h5.7l-.1 3 .1 3h-5.7c-.3-1-.4-2-.4-3s.1-2 .4-3m.8 8h5.1c.3 2.1.8 4 1.4 5.5-2.9-.9-5.2-2.9-6.5-5.5m13.1 5.5c.6-1.5 1.1-3.4 1.4-5.5h5.1a11.4 11.4 0 0 1-6.5 5.5m7.2-7.5h-5.7l.1-3-.1-3h5.7c.3 1 .4 2 .4 3 .1 1.1-.1 2.1-.4 3" /></symbol><symbol id="android" viewBox="0 0 553 553"><path d="M76.8 179.1a33 33 0 0 0-24.3 10 32.6 32.6 0 0 0-10 24V356a33 33 0 0 0 10 24.2 33 33 0 0 0 24.3 10 32 32 0 0 0 24-10 33.3 33.3 0 0 0 9.9-24.2V213c0-9.3-3.3-17.2-10-23.9a32.6 32.6 0 0 0-24-10zM352 50.8l23.6-43.5c1.5-2.9 1-5-1.7-6.6-2.9-1.4-5-.7-6.6 2l-24 43.8c-21-9.3-43.3-14-66.8-14s-45.7 4.7-66.8 14L185.8 2.7c-1.6-2.7-3.8-3.4-6.7-2-2.6 1.5-3.2 3.7-1.6 6.6L201 50.8c-24 12.2-43 29.2-57.2 51a128.9 128.9 0 0 0-21.2 71.7H430c0-26-7.1-49.8-21.3-71.6a146.3 146.3 0 0 0-56.8-51zm-136.5 63.4a12.5 12.5 0 0 1-9.1 3.8 12.7 12.7 0 0 1-12.6-13c0-3.5 1.2-6.6 3.6-9.1 2.5-2.6 5.5-3.8 9-3.8s6.6 1.2 9.1 3.8c2.6 2.5 3.9 5.6 3.9 9.1 0 3.6-1.3 6.6-3.9 9.2zm140.1 0a12 12 0 0 1-9 3.8c-3.5 0-6.5-1.3-9-3.8a12.4 12.4 0 0 1-4-9.2c0-3.5 1.4-6.6 4-9.1a12 12 0 0 1 9-3.8 12 12 0 0 1 9 3.8c2.5 2.5 3.7 5.6 3.7 9.1 0 3.6-1.2 6.6-3.7 9.2zM124 406.8c0 10.2 3.5 18.8 10.6 26 7 7 15.7 10.6 26 10.6H185l.4 75.4c0 9.5 3.3 17.6 10 24.3s14.6 10 23.9 10c9.5 0 17.6-3.4 24.2-10s10-14.8 10-24.3v-75.4h45.8v75.4c0 9.5 3.4 17.6 10 24.3s14.7 10 24.3 10c9.5 0 17.6-3.4 24.2-10s10-14.8 10-24.3v-75.4h25a35 35 0 0 0 25.5-10.7 35 35 0 0 0 10.7-25.9V185.4H124v221.4zm352.3-227.7a33 33 0 0 0-24 9.8 32.5 32.5 0 0 0-10 24.1v143c0 9.5 3.4 17.6 10 24.2s14.7 10 24 10c9.5 0 17.6-3.3 24.2-10s10-14.7 10-24.2V213a32 32 0 0 0-10-24 33.3 33.3 0 0 0-24.2-9.9z" /></symbol><symbol id="ios" viewBox="0 0 512 512"><path d="M410 334s-10 29-30 59c-5 9-29 43-58 43-21 0-35-15-62-15-33 0-46 15-67 15-11 1-22-5-34-16-77-73-81-181-52-225 18-29 48-47 81-48 26 0 54 17 65 17 8 0 50-20 74-18 33 3 56 15 73 38-49 24-66 117 10 150zM329 56c8 32-27 93-79 90-3-43 34-87 79-90z" /></symbol><symbol id="electron" viewBox="0 0 256 256"><path d="M100.5 71.69c-26-4.74-46.57.22-54.76 14.41-6.12 10.6-4.37 24.64 4.24 39.65a2.67 2.67 0 1 0 4.63-2.65c-7.76-13.52-9.27-25.64-4.25-34.33 6.8-11.79 25.15-16.21 49.19-11.83a2.67 2.67 0 0 0 .95-5.25zm-37 72.3c10.52 11.56 24.18 22.4 39.76 31.4 37.72 21.78 77.88 27.6 97.67 14.1a2.67 2.67 0 1 0-3-4.4c-17.72 12.07-55.86 6.54-92-14.32-15.12-8.73-28.35-19.23-38.48-30.36A2.67 2.67 0 1 0 63.5 144z" /><path d="M194.62 140.75c17.03-20.11 22.97-40.35 14.8-54.5-6.02-10.43-18.74-15.94-35.65-16.16a2.67 2.67 0 0 0-.07 5.34c15.2.2 26.17 4.94 31.1 13.48 6.79 11.76 1.49 29.8-14.25 48.4a2.67 2.67 0 1 0 4.07 3.44zm-43.76-68.17c-15.4 3.3-31.79 9.75-47.52 18.83-38.94 22.49-64.35 55.64-60.82 79.68a2.67 2.67 0 1 0 5.28-.78c-3.14-21.34 20.94-52.77 58.2-74.28 15.27-8.81 31.14-15.06 45.98-18.24a2.67 2.67 0 1 0-1.12-5.21z" /><path d="M87.77 187.75c8.9 24.86 23.47 40.17 39.85 40.17 11.94 0 23-8.14 31.61-22.48a2.67 2.67 0 1 0-4.57-2.75c-7.75 12.89-17.26 19.9-27.04 19.9-13.6 0-26.6-13.66-34.83-36.63a2.67 2.67 0 1 0-5.02 1.8zm81.32-4.86c4.61-14.73 7.09-31.72 7.09-49.42 0-44.18-15.47-82.27-37.49-92.05a2.67 2.67 0 0 0-2.16 4.88c19.64 8.72 34.31 44.86 34.31 87.17 0 17.17-2.4 33.63-6.84 47.83a2.67 2.67 0 1 0 5.1 1.59zm50.23-2.61a12.76 12.76 0 1 0-25.53 0 12.76 12.76 0 0 0 25.53 0zm-5.34 0a7.43 7.43 0 1 1-14.86 0 7.43 7.43 0 0 1 14.86 0zM48.5 193.04a12.76 12.76 0 1 0 0-25.52 12.76 12.76 0 0 0 0 25.52zm0-5.33a7.43 7.43 0 1 1 0-14.86 7.43 7.43 0 0 1 0 14.86z" /><path d="M127.62 54.44a12.76 12.76 0 1 0 0-25.52 12.76 12.76 0 0 0 0 25.52zm0-5.33a7.43 7.43 0 1 1 0-14.86 7.43 7.43 0 0 1 0 14.86zm1.95 93.38a9.23 9.23 0 0 1-10.98-7.07 9.24 9.24 0 0 1 7.08-10.98 9.24 9.24 0 0 1 3.9 18.05z" /></symbol></svg> |
| |
| <h1>Customize Icons</h1> |
| |
| <p>This section shows how to configure an application's icon for various platforms. Documentation about splash screen images can be found in the Cordova-Plugin-Splashscreen documentation <a href="../reference/cordova-plugin-splashscreen/">Splashscreen plugin docs</a>.</p> |
| |
| <h2>Configuring Icons in the CLI</h2> |
| |
| <p>When working in the CLI you can define application icon(s) via the <code><icon></code> element (<code>config.xml</code>). |
| If you do not specify an icon, the Apache Cordova logo is used.</p> |
| |
| <div class="language-xml highlighter-rouge"><div class="highlight"><pre class="highlight"><code> <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon.png"</span> <span class="na">platform=</span><span class="s">"ios"</span> <span class="na">width=</span><span class="s">"57"</span> <span class="na">height=</span><span class="s">"57"</span> <span class="na">density=</span><span class="s">"mdpi"</span> <span class="nt">/></span> |
| </code></pre></div></div> |
| |
| <table> |
| <thead> |
| <tr> |
| <th>Attributes</th> |
| <th>Description</th> |
| </tr> |
| </thead> |
| <tbody> |
| <tr> |
| <td>src</td> |
| <td><em>Required</em> <br /> Location of the image file, relative to your project directory</td> |
| </tr> |
| <tr> |
| <td>platform</td> |
| <td><em>Optional</em> <br /> Target platform</td> |
| </tr> |
| <tr> |
| <td>width</td> |
| <td><em>Optional</em> <br /> Icon width in pixels</td> |
| </tr> |
| <tr> |
| <td>height</td> |
| <td><em>Optional</em> <br /> Icon height in pixels</td> |
| </tr> |
| <tr> |
| <td>density</td> |
| <td><em>Optional</em> <br /> <svg class="platform-icon android"><use href="#android"></use></svg> <br /> Specified icon density</td> |
| </tr> |
| <tr> |
| <td>target</td> |
| <td><em>Optional</em> <br /> <svg class="platform-icon windows"><use href="#windows"></use></svg> <br /> Destination filename for the image file and all its' MRT companions</td> |
| </tr> |
| </tbody> |
| </table> |
| |
| <p>The following configuration can be used to define a single default icon |
| which will be used for all platforms.</p> |
| <div class="language-xml highlighter-rouge"><div class="highlight"><pre class="highlight"><code> <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/icon.png"</span> <span class="nt">/></span> |
| </code></pre></div></div> |
| <p>For each platform, you can also define a pixel-perfect icon set to fit |
| different screen resolutions.</p> |
| |
| <h2>Android</h2> |
| <div class="language-xml highlighter-rouge"><div class="highlight"><pre class="highlight"><code> <span class="nt"><platform</span> <span class="na">name=</span><span class="s">"android"</span><span class="nt">></span> |
| <span class="c"><!-- |
| ldpi : 36x36 px |
| mdpi : 48x48 px |
| hdpi : 72x72 px |
| xhdpi : 96x96 px |
| xxhdpi : 144x144 px |
| xxxhdpi : 192x192 px |
| --></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/android/ldpi.png"</span> <span class="na">density=</span><span class="s">"ldpi"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/android/mdpi.png"</span> <span class="na">density=</span><span class="s">"mdpi"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/android/hdpi.png"</span> <span class="na">density=</span><span class="s">"hdpi"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/android/xhdpi.png"</span> <span class="na">density=</span><span class="s">"xhdpi"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/android/xxhdpi.png"</span> <span class="na">density=</span><span class="s">"xxhdpi"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/android/xxxhdpi.png"</span> <span class="na">density=</span><span class="s">"xxxhdpi"</span> <span class="nt">/></span> |
| <span class="nt"></platform></span> |
| </code></pre></div></div> |
| <h3>See Also</h3> |
| <ul> |
| <li><a href="https://www.google.com/design/spec/style/icons.html">Android icon guide</a></li> |
| <li><a href="http://developer.android.com/guide/practices/screens_support.html">Android - Supporting multiple screens</a></li> |
| </ul> |
| |
| <h2>Browser</h2> |
| <p>Icons are not applicable to the Browser platform.</p> |
| |
| <h2>iOS</h2> |
| <div class="language-xml highlighter-rouge"><div class="highlight"><pre class="highlight"><code> <span class="nt"><platform</span> <span class="na">name=</span><span class="s">"ios"</span><span class="nt">></span> |
| <span class="c"><!-- iOS 8.0+ --></span> |
| <span class="c"><!-- iPhone 6 Plus --></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-60@3x.png"</span> <span class="na">width=</span><span class="s">"180"</span> <span class="na">height=</span><span class="s">"180"</span> <span class="nt">/></span> |
| <span class="c"><!-- iOS 7.0+ --></span> |
| <span class="c"><!-- iPhone / iPod Touch --></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-60.png"</span> <span class="na">width=</span><span class="s">"60"</span> <span class="na">height=</span><span class="s">"60"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-60@2x.png"</span> <span class="na">width=</span><span class="s">"120"</span> <span class="na">height=</span><span class="s">"120"</span> <span class="nt">/></span> |
| <span class="c"><!-- iPad --></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-76.png"</span> <span class="na">width=</span><span class="s">"76"</span> <span class="na">height=</span><span class="s">"76"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-76@2x.png"</span> <span class="na">width=</span><span class="s">"152"</span> <span class="na">height=</span><span class="s">"152"</span> <span class="nt">/></span> |
| <span class="c"><!-- Spotlight Icon --></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-40.png"</span> <span class="na">width=</span><span class="s">"40"</span> <span class="na">height=</span><span class="s">"40"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-40@2x.png"</span> <span class="na">width=</span><span class="s">"80"</span> <span class="na">height=</span><span class="s">"80"</span> <span class="nt">/></span> |
| <span class="c"><!-- iOS 6.1 --></span> |
| <span class="c"><!-- iPhone / iPod Touch --></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon.png"</span> <span class="na">width=</span><span class="s">"57"</span> <span class="na">height=</span><span class="s">"57"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon@2x.png"</span> <span class="na">width=</span><span class="s">"114"</span> <span class="na">height=</span><span class="s">"114"</span> <span class="nt">/></span> |
| <span class="c"><!-- iPad --></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-72.png"</span> <span class="na">width=</span><span class="s">"72"</span> <span class="na">height=</span><span class="s">"72"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-72@2x.png"</span> <span class="na">width=</span><span class="s">"144"</span> <span class="na">height=</span><span class="s">"144"</span> <span class="nt">/></span> |
| <span class="c"><!-- iPad Pro --></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-167.png"</span> <span class="na">width=</span><span class="s">"167"</span> <span class="na">height=</span><span class="s">"167"</span> <span class="nt">/></span> |
| <span class="c"><!-- iPhone Spotlight and Settings Icon --></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-small.png"</span> <span class="na">width=</span><span class="s">"29"</span> <span class="na">height=</span><span class="s">"29"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-small@2x.png"</span> <span class="na">width=</span><span class="s">"58"</span> <span class="na">height=</span><span class="s">"58"</span> <span class="nt">/></span> |
| <span class="c"><!-- iPad Spotlight and Settings Icon --></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-50.png"</span> <span class="na">width=</span><span class="s">"50"</span> <span class="na">height=</span><span class="s">"50"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-50@2x.png"</span> <span class="na">width=</span><span class="s">"100"</span> <span class="na">height=</span><span class="s">"100"</span> <span class="nt">/></span> |
| <span class="c"><!-- iPad Pro --></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/ios/icon-83.5@2x.png"</span> <span class="na">width=</span><span class="s">"167"</span> <span class="na">height=</span><span class="s">"167"</span> <span class="nt">/></span> |
| <span class="nt"></platform></span> |
| </code></pre></div></div> |
| <h3>See Also</h3> |
| <ul> |
| <li><a href="https://developer.apple.com/library/content/qa/qa1686/_index.html">App Icons on iPad and iPhone</a></li> |
| </ul> |
| |
| <h2>Windows</h2> |
| |
| <p>For Windows the recommended approach to define application icons is to use the <code>target</code> attribute.</p> |
| |
| <div class="language-xml highlighter-rouge"><div class="highlight"><pre class="highlight"><code> <span class="nt"><platform</span> <span class="na">name=</span><span class="s">"windows"</span><span class="nt">></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/storelogo.png"</span> <span class="na">target=</span><span class="s">"StoreLogo"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/smalllogo.png"</span> <span class="na">target=</span><span class="s">"Square30x30Logo"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square44x44Logo.png"</span> <span class="na">target=</span><span class="s">"Square44x44Logo"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square70x70Logo.png"</span> <span class="na">target=</span><span class="s">"Square70x70Logo"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square71x71Logo.png"</span> <span class="na">target=</span><span class="s">"Square71x71Logo"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square150x150Logo.png"</span> <span class="na">target=</span><span class="s">"Square150x150Logo"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square310x310Logo.png"</span> <span class="na">target=</span><span class="s">"Square310x310Logo"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Wide310x150Logo.png"</span> <span class="na">target=</span><span class="s">"Wide310x150Logo"</span> <span class="nt">/></span> |
| <span class="nt"></platform></span> |
| </code></pre></div></div> |
| |
| <p>where <code>src</code> is the path to the icon which needs to be added.</p> |
| |
| <p>The Windows platform handles MRT icons automatically, so if you specify <code>src="res/windows/storelogo.png"</code> the following files will be copied into the application's <code>images</code> folder: <code>res/windows/storelogo.scale-100.png</code>, <code>res/windows/storelogo.scale-200.png</code>, etc.</p> |
| |
| <p>TODO Define what MRT is.</p> |
| |
| <p>The <code>target</code> attribute specifies the base name for the resultant icons. For every icon file, its destination filename is calculated as <code>target + '.' + MRT_qualifiers + extension(src)</code>. For the icons to display properly in the application, every <code>target</code> value should be one of the icon filenames defined in the application's <code>.appxmanifest</code> file.</p> |
| |
| <p>Summarizing the above… using the <code>target</code> attribute it is possible to:</p> |
| |
| <ul> |
| <li>define a group of icons for different device scale factors using a single <code><icon ...></code> element, for example: |
| <div class="language-xml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/AppListIcon.png"</span> <span class="na">target=</span><span class="s">"Square44x44Logo"</span> <span class="nt">/></span> |
| </code></pre></div> </div> |
| <p>which is equivalent to the following lines:</p> |
| <div class="language-xml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square44x44Logo.scale-100.png"</span> <span class="na">width=</span><span class="s">"44"</span> <span class="na">height=</span><span class="s">"44"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square44x44Logo.scale-150.png"</span> <span class="na">width=</span><span class="s">"66"</span> <span class="na">height=</span><span class="s">"66"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square44x44Logo.scale-200.png"</span> <span class="na">width=</span><span class="s">"88"</span> <span class="na">height=</span><span class="s">"88"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square44x44Logo.scale-240.png"</span> <span class="na">width=</span><span class="s">"106"</span> <span class="na">height=</span><span class="s">"106"</span> <span class="nt">/></span> |
| </code></pre></div> </div> |
| </li> |
| <li>define icons with scale factors other than <code>scale-100</code> and <code>scale-240</code> (and any other MRT qualifiers)</li> |
| </ul> |
| |
| <p>Although it is not recommended, it is also possible to define icons using the <code>width</code> and <code>height</code> attributes:</p> |
| |
| <div class="language-xml highlighter-rouge"><div class="highlight"><pre class="highlight"><code> <span class="nt"><platform</span> <span class="na">name=</span><span class="s">"windows"</span><span class="nt">></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/logo.png"</span> <span class="na">width=</span><span class="s">"150"</span> <span class="na">height=</span><span class="s">"150"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/smalllogo.png"</span> <span class="na">width=</span><span class="s">"30"</span> <span class="na">height=</span><span class="s">"30"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/storelogo.png"</span> <span class="na">width=</span><span class="s">"50"</span> <span class="na">height=</span><span class="s">"50"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square44x44Logo.scale-100.png"</span> <span class="na">width=</span><span class="s">"44"</span> <span class="na">height=</span><span class="s">"44"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square44x44Logo.scale-240.png"</span> <span class="na">width=</span><span class="s">"106"</span> <span class="na">height=</span><span class="s">"106"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square70x70Logo.scale-100.png"</span> <span class="na">width=</span><span class="s">"70"</span> <span class="na">height=</span><span class="s">"70"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square71x71Logo.scale-100.png"</span> <span class="na">width=</span><span class="s">"71"</span> <span class="na">height=</span><span class="s">"71"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square71x71Logo.scale-240.png"</span> <span class="na">width=</span><span class="s">"170"</span> <span class="na">height=</span><span class="s">"170"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square150x150Logo.scale-240.png"</span> <span class="na">width=</span><span class="s">"360"</span> <span class="na">height=</span><span class="s">"360"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Square310x310Logo.scale-100.png"</span> <span class="na">width=</span><span class="s">"310"</span> <span class="na">height=</span><span class="s">"310"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Wide310x150Logo.scale-100.png"</span> <span class="na">width=</span><span class="s">"310"</span> <span class="na">height=</span><span class="s">"150"</span> <span class="nt">/></span> |
| <span class="nt"><icon</span> <span class="na">src=</span><span class="s">"res/windows/Wide310x150Logo.scale-240.png"</span> <span class="na">width=</span><span class="s">"744"</span> <span class="na">height=</span><span class="s">"360"</span> <span class="nt">/></span> |
| <span class="nt"></platform></span> |
| </code></pre></div></div> |
| |
| <h3>See Also:</h3> |
| <ul> |
| <li><a href="https://msdn.microsoft.com/en-us/library/windows/apps/mt412102.aspx">Windows 10 platform guidelines for icons</a>.</li> |
| <li><a href="https://msdn.microsoft.com/en-us/library/windows/apps/xaml/hh781198.aspx">Windows 8.1 tiles and icons sizes</a></li> |
| </ul> |
| |
| |
| |
| </div> |
| </div> |
| <div class="row"> |
| <div class="blue-divider"></div> |
| <footer> |
| <div class="container-fluid"> |
| <div class="row"> |
| <div class="col-sm-9"> |
| <h1>More Resources</h1> |
| <div class="row"> |
| <div class="col-sm-4"> |
| <h2>General</h2> |
| <ul class="nav"> |
| <li> |
| <a target="_blank" href="https://projects.apache.org/project.html?cordova">Apache Project Page</a> |
| </li> |
| <li> |
| <a href="https://www.apache.org/dyn/closer.cgi/cordova">Source Distribution</a> |
| </li> |
| <li> |
| <a target="_blank" href="https://www.apache.org/licenses">License</a> |
| </li> |
| <li> |
| <a href="/artwork">Artwork</a> |
| </li> |
| </ul> |
| </div> |
| <div class="col-sm-4"> |
| <h2>Development</h2> |
| <ul class="nav"> |
| <li><a target="_blank" href="https://github.com/apache?utf8=%E2%9C%93&q=cordova-">Source Code</a></li> |
| <li><a target="_blank" href="https://github.com/apache/cordova#filing-a-bug">Issue Tracker</a></li> |
| <li><a target="_blank" href="https://stackoverflow.com/questions/tagged/cordova">Stack Overflow</a></li> |
| <li><a href="/contact">Mailing List</a></li> |
| <li><a href="/contribute/nightly_builds.html">Nightly builds</a></li> |
| </ul> |
| </div> |
| <div class="col-sm-4"> |
| <h2>Apache Software Foundation</h2> |
| <ul class="nav"> |
| <li> |
| <a target="_blank" href="https://www.apache.org/">About ASF</a> |
| </li> |
| <li> |
| <a target="_blank" href="https://www.apache.org/events/current-event">Events</a> |
| </li> |
| <li> |
| <a target="_blank" href="https://www.apache.org/foundation/sponsorship.html">Become a Sponsor</a> |
| </li> |
| <li> |
| <a target="_blank" href="https://www.apache.org/foundation/thanks.html">Thanks</a> |
| </li> |
| <li> |
| <a target="_blank" href="https://www.apache.org/security/">Security</a> |
| </li> |
| <li> |
| <a target="_blank" href="https://privacy.apache.org/policies/privacy-policy-public.html">Privacy policy</a> |
| </li> |
| </ul> |
| </div> |
| </div> |
| </div> |
| <div class="col-sm-3"> |
| <h1>Contribute</h1> |
| <p style="padding-top:20px"><strong>Help Cordova move forward!</strong></p> |
| <p>Report bugs, improve the docs, or contribute to the code.</p> |
| <a href="/contribute" class="btn btn-lg btn-primary"> |
| Learn More |
| </a> |
| <p style="padding-top:20px"> <a href="https://twitter.com/apachecordova" class="twitter-follow-button" data-show-count="false">Follow @apachecordova</a></p> |
| </div> |
| </div> |
| <p class="copyright_text"> |
| Copyright © 2024 <a href="https://apache.org">The Apache Software Foundation</a>, Licensed under the <a target="_blank" href="https://www.apache.org/licenses/">Apache License, Version 2.0</a>.<br/> |
| Apache and the Apache feather logos are <a target="_blank" href="https://www.apache.org/foundation/marks/list/">trademarks</a> of The Apache Software Foundation. |
| <br/> |
| <p>See the <a href="/attributions/">attributions page</a> for other copyright & trademark notices.</p> |
| </p> |
| |
| </div> |
| </footer> |
| |
| </div> |
| </div> |
| </div> |
| |
| <script defer type="text/javascript" src="/static/js/lib/toc.min.js"></script> |
| <script defer type="text/javascript" src="/static/js/docs.js"></script> |
| |
| <script defer type="text/javascript" src="/static/js/index.js"></script> |
| <script defer type="text/javascript" src="/static/js/twitter.js"></script> |
| </body> |
| </html> |
