Archives For Tips and Tricks

Just updated Xcode and iOS ? Getting an error like this ?

Missing Info.plist value - A value for the Info.plist key 'CFBundleIconName' is missing in the bundle 'xxxxxxxxxxxxxxx'. Apps built with iOS 11 or later SDK must supply app icons in an asset catalog and must also provide a value for this Info.plist key. For more information see http://help.apple.com/xcode/mac/current/#/dev10510b1f7.

Starting with Xcode 9 your App icons must be provided as part of your asset catalog.

Don’t worry – QtCreator helps you to manage this.

Thx @jakepetroules and @cpluke for your help at QtMob

Create Asset Catalog for your App Icons

The only thing you need is an App Icon in 1024×1024 px

Open this FREE service: https://www.appicon.build/

Drag your AppIcon onto this site and get an email with all recommended sizes – something like this:

  • AppIcon.appiconset
    • Contents.json
    • *.png

Contents.json contains all instructions Xcode needs to know HowTo use your icon files.

Hint: For me this worked only using Safari – not from Firefox.

Add AppIcons to your Qt Project

I’m always using a project structure like this

  • ProjectFolder
    • ios
      • info.plist
      • *.png

Remove all your App Icon .png and create a new folder ‘Images.xcassets’ and place your AppIcon.appiconset folder into the Images.xcassets folder:

  • ProjectFolder
    •  ios
      • info.plist
      • Images.xcassets
        • AppIcon.appiconset
          • Contents.json
          • *.png

 

Edit your info.plist

Remove these keys:

 <key>CFBundleIconFile</key>
 <key>CFBundleIcons</key>

Edit yourproject.pro

Remove the lines where you added your icons to the bundle data and insert under ios {…}:

 QMAKE_ASSET_CATALOGS = $$PWD/ios/Images.xcassets
 QMAKE_ASSET_CATALOGS_APP_ICON = "AppIcon"

The first entry points to your Images.xcassets folder, the second one tells QMAKE that your appiconset is prefixed with AppIcon.

That’s all: now you can compile and run your project using Xcode9 on iOS11 devices.

Hint: perhaps you already used an asset catalog before and still getting an error ?

There’s a new AppIcon size of 1024×1024 required:

{
 "size" : "1024x1024",
 "idiom" : "ios-marketing",
 "filename" : "Icon-App-1024x1024@1x.png",
 "scale" : "1x"
}

Ignore

In one of my projects suddenly at root of the project this file was created:

asset_catalog_compiler.Info.plist

This is a temporary intermediate file, so it’s safe to add it to your .gitignore

Edited 2016-06-05: Updated for Qt 5.7 RC

My blog series is targeted to mobile app developers coming from the outside without any knowledge of Qt and simply want to develop mobile apps using the newest way: qt.labs.controls (Qt 5.6) / QtQuickControls 2 (Qt 5.7+)

Qt is cool

–> exists since more then 20 years

–> great for Application Development

–> great for Device Creation

–> Qt for mobile, for desktop, for embedded, …

–> sooooo many samples

–> sooooo many targets

–> sooooo many ways to go

–> Qt UI — Widgets — Qt Quick — Qt 5.6/5.7 UI Controls redefined

qt_complex_dreamstime_s_15604164

Confused ?

This is the reason why I’m writing this blog posts to help you finding the shortest path through Qt jungle.

Our goal is mobile APP development using new Controls in Material style for Android and iOS.

survive

Here some first tips to survive:

Ignore Widgets

There are many samples and tutorials you can access from Qt Creator.

If the project uses QtWidgets – please ignore !

QtWidgets are perfect for Desktop APPs and look great on OSX, Windows, Linux using the native controls.

We want to use the new qt.labs.controls (Tech preview in Qt 5.6) for mobile APPs

Import the right Controls

Attention: many sample project are importing Controls 1:

import QtQuick.Controls 1.x

QtQuick Controls 1.x are the Controls used up to Qt 5.6.

The new qt.labs.controls we want to use for mobile APPs are introduced in Qt 5.6 as a TP (Technical Preview).

So for Qt 5.6 you should use

import Qt.labs.controls 1.x

Learn about the differences between the Controls 1.x and qt.labs.controls: https://doc-snapshots.qt.io/qt5-5.6/qtlabscontrols-differences.html

Beginning with Qt 5.7 the new Controls are ‘official’

import QtQuick.Controls 2.x

If you started in Qt 5.6 to learn about the new Controls be aware: API can change for Qt 5.7 and you also have to change your import statements.

Controls too small on Android or iOS ?

While trying out some of the Examples it will happen that all is much too small.

Qt 5.6 introduced HighDPI support on all platforms. This must be switched on.

Easiest way to do this is inside your main.cpp:

QGuiApplication::setAttribute(Qt::AA_EnableHighDpiScaling);

Controls not using Material Style ?

Material Style only can be used from qt.labs.controls (Qt 5.6) or QtQuick.Controls 2.x

There are currently three different Styles: Material (Google Material Style), Universal (Windows 10 Universal Style), Default.

You can switch on Material Style easiest way in main.cpp:

Qt 5.6 / 5.7 Beta:

qputenv("QT_LABS_CONTROLS_STYLE", "material");

Qt 5.7 RC or greater:

qputenv("QT_QUICK_CONTROLS_STYLE", "material");

Controls wrong placed ?

Starting with Qt this can happen: all or some of your Controls are placed at Top Left.

Verify if your Controls are placed inside Layouts.

Don’t misuse Positioner and Layouts – per ex. Row and RowLayout

There’s a document about Positioners and Layouts in QML.


← Back (HowTo Translations (i18n))

→ Next Article (Qt Quick Controls 2)

⇐ Home (Overview / Topics)