Return-Path: X-Original-To: apmail-cordova-commits-archive@www.apache.org Delivered-To: apmail-cordova-commits-archive@www.apache.org Received: from mail.apache.org (hermes.apache.org [140.211.11.3]) by minotaur.apache.org (Postfix) with SMTP id C731C10789 for ; Wed, 2 Oct 2013 09:17:42 +0000 (UTC) Received: (qmail 86492 invoked by uid 500); 2 Oct 2013 09:17:41 -0000 Delivered-To: apmail-cordova-commits-archive@cordova.apache.org Received: (qmail 86473 invoked by uid 500); 2 Oct 2013 09:17:41 -0000 Mailing-List: contact commits-help@cordova.apache.org; run by ezmlm Precedence: bulk List-Help: List-Unsubscribe: List-Post: List-Id: Reply-To: dev@cordova.apache.org Delivered-To: mailing list commits@cordova.apache.org Received: (qmail 86466 invoked by uid 99); 2 Oct 2013 09:17:41 -0000 Received: from tyr.zones.apache.org (HELO tyr.zones.apache.org) (140.211.11.114) by apache.org (qpsmtpd/0.29) with ESMTP; Wed, 02 Oct 2013 09:17:41 +0000 Received: by tyr.zones.apache.org (Postfix, from userid 65534) id AF3B38ADAF5; Wed, 2 Oct 2013 09:17:40 +0000 (UTC) Content-Type: text/plain; charset="us-ascii" MIME-Version: 1.0 Content-Transfer-Encoding: 7bit From: mwbrooks@apache.org To: commits@cordova.apache.org Date: Wed, 02 Oct 2013 09:17:40 -0000 Message-Id: <8eba1d1be5a04e76a5c64a9bcabbf74f@git.apache.org> X-Mailer: ASF-Git Admin Mailer Subject: [1/4] docs commit: [CB-4932] new icon/splash config section Updated Branches: refs/heads/master 7cf9fea03 -> 2af28c572 [CB-4932] new icon/splash config section Conflicts: docs/en/edge/cordova/splashscreen/splashscreen.md Project: http://git-wip-us.apache.org/repos/asf/cordova-docs/repo Commit: http://git-wip-us.apache.org/repos/asf/cordova-docs/commit/80bd7341 Tree: http://git-wip-us.apache.org/repos/asf/cordova-docs/tree/80bd7341 Diff: http://git-wip-us.apache.org/repos/asf/cordova-docs/diff/80bd7341 Branch: refs/heads/master Commit: 80bd734141159c8532a69112669266b51311ab5e Parents: 7cf9fea Author: Mike Sierra Authored: Fri Sep 27 11:50:51 2013 -0400 Committer: Michael Brooks Committed: Wed Oct 2 10:12:37 2013 +0100 ---------------------------------------------------------------------- docs/en/edge/config_ref/images.md | 157 +++++++++++++++++++ .../edge/cordova/splashscreen/splashscreen.md | 45 +----- 2 files changed, 158 insertions(+), 44 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/80bd7341/docs/en/edge/config_ref/images.md ---------------------------------------------------------------------- diff --git a/docs/en/edge/config_ref/images.md b/docs/en/edge/config_ref/images.md new file mode 100644 index 0000000..723e538 --- /dev/null +++ b/docs/en/edge/config_ref/images.md @@ -0,0 +1,157 @@ +--- +license: Licensed to the Apache Software Foundation (ASF) under one + or more contributor license agreements. See the NOTICE file + distributed with this work for additional information + regarding copyright ownership. The ASF licenses this file + to you under the Apache License, Version 2.0 (the + "License"); you may not use this file except in compliance + with the License. You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, + software distributed under the License is distributed on an + "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + KIND, either express or implied. See the License for the + specific language governing permissions and limitations + under the License. +--- + +# Icons and Splash Screens + +This section shows how to configure an app's icon and optional splash +screen for various platforms, both when working in the Cordova CLI +(described in The Command-line Interface) or using platform-specific +SDK tools (detailed in the Platform Guides). + +## Configuring Icons in the CLI + +When working in the CLI, icon source files are located within various +platform-specific subdirectories within the project's `www/res/icons` +directory. Newly created projects come with a default set of Cordova +icons for you to replace for the platforms you wish to target. + +Android specifies icons for low, medium, high, and extra-high resolutions: + + android/icon-36-ldpi.png + android/icon-48-mdpi.png + android/icon-72-hdpi.png + android/icon-96-xhdpi.png + +The iOS platform specifies 72-pixel-square icons for iPads, and +57-pixel icons for iPhones and iPods, with high-resolution _2x_ +variants for retina displays: + + ios/icon-57-2x.png + ios/icon-57.png + ios/icon-72-2x.png + ios/icon-72.png + +Windows Phone specifies a default 48-pixel icon, along with various +devices' background tiling images used when representing applications: + + windows-phone/icon-48.png + windows-phone/icon-62-tile.png + windows-phone/icon-173-tile.png + +Blackberry requires an 80-pixel icon: + + blackberry/icon-80.png + +Tizen requires an 128-pixel icon: + + tizen/icon-128.png + +## Configuring Splash Screens in the CLI + +Use the Splashscreen API to enable display of an app's introductory +splash screen on many platforms. When working in the CLI, splash +screen source files are located within the project's `www/res/screens` +subdirectory. + +Android specifies both portrait- and landscape-oriented splash screen +images for low, medium, high, and extra-high resolutions: + + android/screen-hdpi-landscape.png + android/screen-hdpi-portrait.png + android/screen-ldpi-landscape.png + android/screen-ldpi-portrait.png + android/screen-mdpi-landscape.png + android/screen-mdpi-portrait.png + android/screen-xhdpi-landscape.png + android/screen-xhdpi-portrait.png + +The iOS platform specifies variants for iPhone/iPod and iPad, with +variants for retina displays and different orientations. The _568h_ +file is customized for the iPhone 5's taller screen: + + ios/screen-ipad-landscape-2x.png + ios/screen-ipad-landscape.png + ios/screen-ipad-portrait-2x.png + ios/screen-ipad-portrait.png + ios/screen-iphone-landscape-2x.png + ios/screen-iphone-landscape.png + ios/screen-iphone-portrait-2x.png + ios/screen-iphone-portrait.png + ios/screen-iphone-portrait-568h-2x.png + +BlackBerry and Windows Phone both specify a single splash screen +image: + + blackberry/screen-225.png + windows-phone/screen-portrait.jpg + +The following sections detail how to set up splash screens when +working with SDKs and related command-line tools described in Platform +Guides. + +## Splash Screens for the Android Platform + +Place [9-patch image](https://developer.android.com/tools/help/draw9patch.html) +files in the Android project's `res/drawable` directory. The size for +each should be: + +- xlarge (xhdpi): at least 960 × 720 +- large (hdpi): at least 640 × 480 +- medium (mdpi): at least 470 × 320 +- small (ldpi): at least 426 × 320 + +In the `onCreate` method of the class that extends `DroidGap`, add the +following two lines: + + super.setIntegerProperty("splashscreen", R.drawable.splash); + super.loadUrl(Config.getStartUrl(), 10000); + +The first line sets the image to display as the splash screen. If you +name your image anything other than `splash.png`, you need to modify +this line. + +The second line is the normal `super.loadUrl` line, but its second +parameter specifies a timeout value to display the splash screen. In +this example the splash screen displays for 10 seconds. To dismiss the +splash screen once the app receives the `deviceready` event, call the +`navigator.splashscreen.hide()` method. + +## Splash Screens for the iOS Platform + +Copy your splash screen images into the iOS project's +`Resources/splash` directory. Only add the images for the devices you +want to support, such as iPad or iPhone. The size of each image should +be: + +- Default-568h@2x~iphone.png (640x1136 pixels) +- Default-Landscape@2x~ipad.png (2048x1496 pixels) +- Default-Landscape~ipad.png (1024x748 pixels) +- Default-Portrait@2x~ipad.png (1536x2008 pixels) +- Default-Portrait~ipad.png (768x1004 pixels) +- Default@2x~iphone.png (640x960 pixels) +- Default~iphone.png (320x480 pixels) + +## Splash Screens for the BlackBerry 10 Platform + +Copy your splash screen images into the project's +`res/screen/blackberry10` directory. The file names should be: + +- splash-1280x768.png (1280x768 pixels) +- splash-720x720.png (720x720 pixels) +- splash-768x1280.png (768x1280 pixels) http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/80bd7341/docs/en/edge/cordova/splashscreen/splashscreen.md ---------------------------------------------------------------------- diff --git a/docs/en/edge/cordova/splashscreen/splashscreen.md b/docs/en/edge/cordova/splashscreen/splashscreen.md index 7146a66..d53f2d4 100644 --- a/docs/en/edge/cordova/splashscreen/splashscreen.md +++ b/docs/en/edge/cordova/splashscreen/splashscreen.md @@ -55,47 +55,4 @@ platform-specific configuration settings described below: Some platforms may support this feature without requiring any special configuration. See _Platform Support_ in the Overview section. -## Setup - -### Android - -1. Copy the splash screen image into the Android project's `res/drawable` directory. The size for each image should be: - - - xlarge (xhdpi): at least 960 × 720 - - large (hdpi): at least 640 × 480 - - medium (mdpi): at least 470 × 320 - - small (ldpi): at least 426 × 320 - - You should use a [9-patch image](https://developer.android.com/tools/help/draw9patch.html) for your splash screen. - -2. In config.xml, add the following preferences: - - - - - The first line sets the image to display as the splash screen. If you name your image anything other than `splash.png`, you need to modify this line. - The second line sets the delay of how long the splashscreen appears in milliseconds. To dismiss the splash screen once the app receives the `deviceready` event, call the `navigator.splashscreen.hide()` method. - -### iOS - -Copy your splash screen images into the iOS project's -`Resources/splash` directory. Only add the images for the devices you -want to support, such as iPad or iPhone. The size of each image -should be: - -- Default-568h@2x~iphone.png (640x1136 pixels) -- Default-Landscape@2x~ipad.png (2048x1496 pixels) -- Default-Landscape~ipad.png (1024x748 pixels) -- Default-Portrait@2x~ipad.png (1536x2008 pixels) -- Default-Portrait~ipad.png (768x1004 pixels) -- Default@2x~iphone.png (640x960 pixels) -- Default~iphone.png (320x480 pixels) - -### BlackBerry 10 - -Copy your splash screen images into the project's -'res/screen/blackberry10' directory. The file names should be: - -- splash-1280x768.png (1280x768 pixels) -- splash-720x720.png (720x720 pixels) -- splash-768x1280.png (768x1280 pixels) +See Icons and Splash Screens for information on how to configures these images.