Skip to content

Customization

Jump to bottom
lgdi edited this page Sep 30, 2015 · 29 revisions

The customized app can be built by replacing the contents of the Wind directory by customized graphic elements and xml files.

Graphic customization

Choosing between basic and advanced customization

There are 2 options for the graphic customization of the app:

  • the basic customization, which is detailed below
  • the advanced customization, which makes it possible to give the app a really distinctive design.

Preparing the customized graphic elements

Launcher Icon

The app launcher icon needs to be provided in 9 different sizes:

  • Icon.png: 57x57 px. Example.
  • Icon@2x.png: 114x114 px. Example.
  • Icon-60@2x.png: 120x120 px.
  • Icon-72.png: 72x72 px. Example.
  • Icon-72@2x.png: 144x144 px. Example.
  • Icon-76.png: 76x76 px.
  • Icon-76@2x.png: 152x152 px.
  • Icon-512.png: 512x512 px. Example.
  • Icon-512@2x.png: 1024x1024 px.Example.
Splash Screen

The splash screen appears briefly when the app is launched. It needs to be provided in 10 versions:

  • Default.png: splash screen on iPhone 3 - 320x480 px. Example.
  • Default@2x.png: splash screen on iPhone 4 retina - 640x960 px. Example.
  • Default-568h@2x.png: splash screen on iPhone 5 - 640x1136 px. Example
  • Default-Landscape.png: splash screen on iPad in landscape mode - 1024x768 px. Example.
  • Default-Landscape@2x.png: splash screen on iPad Retina in landscape mode - 2048x1536 px. Example.
  • Default-Portrait.png: splash screen on iPad in portrait mode - 768x1024 px. Example.
  • Default-Portrait@2x.png: splash screen on iPad Retina in portrait mode - 1536x2048 px. Example.
  • Default-736h@3x.png: splash screen on iPhone with Retina HD 5.5 - 1242×2208 px
  • Default-Landscape@3x.png: splash screen on iPhone with Retina HD 5.5 2208×1242 px
  • Default-667h@2x.png: splash screen on iPhone with Retina HD 4.7 750×1334 px
Generic cover

The generic cover is used inside the Newsstand icon, and on the App Store. It needs to be provided in 2 sizes:

  • generic.png: 300 px in larger dimension. Example.
  • generic-512@2x.png: 1024 px in larger dimension. Example
Kiosk screen

In the basic customization option, it is only possible to change the background of the kiosk screen. It is advised to use a dark background, otherwise the title and subtitle of the magazines (in white color) will not be visible.

The background needs to be provided in 1 size:

  • Magazines_background.png: 1024x1024 px. Example.

Other Customizations

There are 3 important plist files:

  • Application.plist is the standard info.plist found in standard projects, as documented in the Apple Documentation. An example of Application.plistfile as required by the app is available in the Resources/Wind folder in this repository. You only need to change the following keys:
  • CFBundleIdentifier: enter com.[client].[app]
  • CFBundleDisplayNameand CFBundleName: enter the name of your app
  • UINewsstandApp: enter false if you do not want to use Newsstand
  • Application_.plist is a Librelio specific plist. An example of Application_.plistfile as required by the app is available in the Resources/Wind folder in this repository. It contains the following keys:
  • AppId: the ID on the App Store. If this key is present, the "Rate This App" feature will be activated, if the key is omitted, it will not
  • BarColor: colors of bar items, separated by ;, for example Black;LightGray;White
  • CachePrices: if the value of this key is Yes (string), the app will cache app store prices
  • DownloadNewstandCovers: if the value of this key is Yes (string), the app will download Newsstand covers
  • CodeService or UserService: the code of the service used to manage subscribers. Requires Librelio's Developer or Publisher plans
  • DfpPrefix: the DFP code of the publisher (or Librelio's), followed by _[client]_[app], for example /166877488/numero_numero_
  • GoogleAnalyticsCode: the Google Analytics Code used for tracking
  • Languages: if the app contains several languages, list of languages separated by comma, for example gb,fr,it,de,cn,es
  • LibrelioClientId and LibrelioAppId: when the app id is not in the standard for com.[client].[app], these keys contain the client id and app id
  • SpecificAppStoreIDs: a dictionary containing properly named issues and their correspondance with legacy names
  • SharedSecret: a code that can be generated on iTunes Connect, required for In App subscriptions
  • Splash: Deprecated
  • Tabs.plist is another Librelio specific plist, that defines the tabs displayed at the root level of the app. An example of Tabs.plistfile as required by the app is available in the Resources/Wind folder in this repository. You can add as many tabs as you want in the app, by adding items in the root array of this plist, for example:
  • Magazines.plist?waupdate=30: displays the magazines grid view
  • file://localhost/: displays the list of downloaded magazines
  • http://www.mysite.com: displays mysite.com

It's also possible to override the default translation files by adding [languagecode].lproj/Application.strings files to the app's resources (see https://github.com/libreliodev/iOS/issues/72)

Clone this wiki locally