Archives For ekkescorner

Update 2017-03-24: Added info about problems with Popups and Android BACK key

Update 2017-03-13: updated my openssl – repo to fix crash with QNAM

Update 2017-03-09: Added info Adding OpenSSL, added reference to comment from Tobias Hunger on ‘…choose a mkspec…’

Update 2017-03-07: Added a) very first iOS build signing issues and b) iOS Build Issues (patch bitcode.prf)

Update 2017-03-06: Critical QTBUG-59293 fixed – see patch

I’m not using the Maintenance Tool – I’m always installing a new Qt Release at a different location and also start Qt Creator with -settingsPath as blogged here

Then it’s easier to work with old and new release side-by-side and compare.

Update QML Imports

From a technical point you can use the ‘old’ imports. I’m always doing search/replace to update the imports. Then I’m sure all my QML files are accessing the newest Controls and Properties. Updating from  5.7 to 5.8 I replaced

import QtQuick 2.6
import QtQuick.Controls 2.0
import QtQuick.Controls.Material 2.0

with

import QtQuick 2.7
import QtQuick.Controls 2.1
import QtQuick.Controls.Material 2.1

Using a source control system like Git it’s a good idea to do this in an extra Branch – then it’s easier to go back if something went wrong.

First Test with Demo and Conference Apps

While writing this blog series on Qt for Mobile I developed some Demo Apps, where each Demo App has a specific Focus. This makes it easy to do the tests step-by-step.

I’m replacing the Imports, then compile and run the App on Android and iOS devices and take a look at Compile- and Application Output and Issues and go through the apps to see if all works as before.

My Demo Apps:

As next I’m testing my Conference Apps. These Apps are something more complex and I also test building release and upload to Google Play Beta Test and Apple TestFlight to see if Release also is working.

The good thing with the Demo and Qt Conference Apps: I published them Open Source to Github. So it’s easy for others to see what I changed or to verify problems.

When all my Demo and Conference Apps are working well, then the next step will be to do the same with my private customer repos.

Finally I can test and add new Controls / Features from QtQuickControls2 as J-P Nurmi blogged about here.

Let’s see what happened while doing the Update.

Mostly Harmless

I got many Warnings and Errors, but don’t panic, they’re mostly harmless.

Some Errors / Warnings / Issues are new – some exist a longer time. I’m listing them also here for devs new to ‘Qt for Mobile’

Very first build for iOS – signing issue

I moved my projects into a new 580 working dir and running the very first time an iOS Build (Debug or Release – doesn’t matter) the code compiles and then logs an error:

Provisioning profile "iOS Team Provisioning Profile: org.ekkescorner.xyz" doesn't include signing certificate "iPhone Developer: Ekkehard Gentz (4A4....VV3)".
Code signing is required for product type 'Application' in SDK 'iOS 10.2'
** BUILD FAILED **

Opening the generated Xcode project and then doing the build again all is working as expected. Even deleting the build dir and building again it works.

This is caused by Xcode automatic provisioning and out of scope from Qt. (see QTBUG-59350)

So don’t panic if the iOS build fails – simply open the Xcode project one time.

QML import could not be resolved

Building Android Apps you’ll see some warnings like

Warning: QML import could not be resolved in any of the import paths: org.ekkescorner.data
Warning: QML import could not be resolved in any of the import paths: QtQuick.Controls.impl
Warning: QML import could not be resolved in any of the import paths: QtQuick.Controls.Material.impl
Warning: QML import could not be resolved in any of the import paths: QtQuick.Controls.Universal.impl

There’s nothing wrong with this. Here’s an old Bug: QTBUG-47389

You can ignore this. Hopefully one day this will be fixed.

QQmlComponent: Component is not ready

While configuring my projects for Android, OSX, iOS I found under General Messages:

QML module does not contain information about components contained in plugins.

Module path: /daten/_qt_sdks/sdk_580/5.8/android_armv7/qml/QtGraphicalEffects
See "Using QML Modules with Plugins" in the documentation.

Automatic type dump of QML module failed.
Errors:
"/daten/_qt_sdks/sdk_580/5.8/clang_64/bin/qmlplugindump" returned exit code 3.
Arguments: -nonrelocatable QtGraphicalEffects 1.0 .
Error parsing dependencies file <outputOfQmlimportscanner>:illegal value at 0
failed to proecess output of qmlimportscanner
QQmlComponent: Component is not ready
file:///daten/_qt_sdks/sdk_580/5.8/android_armv7/qml/typelist.qml:2:1: plugin cannot be loaded for module "QtGraphicalEffects": '/daten/_qt_sdks/sdk_580/5.8/android_armv7/qml/QtGraphicalEffects/libqtgraphicaleffectsplugin.so' is not a valid Mach-O binary (invalid magic 7f454c46)

same happens with “QtQuick.Controls.Styles.Android”. From J-P Nurmi I got confirmation that I can ignore this.

For the first one on “QtGraphicalEffects” I wrote a Bug Report: QTCREATORBUG-17819.

You can ignore these errors.

Qt Quick Controls 2 ‘Binding Loops’

Some of my Apps are reporting Binding Loops.

On Android:

W libtab_pages_x.so: file:///data/data/org.qtproject.example.tab_pages_x/qt-reserved-files/qml/QtQuick/Controls.2/Material/TabBar.qml:52 ((null)): file:///data/data/org.qtproject.example.tab_pages_x/qt-reserved-files/qml/QtQuick/Controls.2/Material/TabBar.qml:52:18: QML ListView: Binding loop detected for property "implicitWidth"

On iOS:

qrc:/qt-project.org/imports/QtQuick/Controls.2/Material/TabBar.qml:52:18: QML ListView: Binding loop detected for property "implicitWidth"

same happens for “preferredHighlightEnd”.

Unfortunately I wasn’t able to create a small test scenario yet, but will try again and open an Issue later.

Most important: You can ignore this Warning.

Please update your kit or choose a mkspec for qmake

Configuring a project for iOS I got

"/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/clang++" is used by qmake, but "/usr/bin/clang++" is configured in the kit.
Please update your kit or choose a mkspec for qmake that matches your target environment better.

issue_01

I created a bugreport: QTCREATORBUG-17794

From qt-creator List I got confirmation: This message is wrong and you can ignore this.

see here a comment from Tobias Hunger why this happens.

-headerpad_max_install_names is ignored

Building project for iOS I got this Issue:

:-1: warning: -headerpad_max_install_names is ignored when used with -bitcode_bundle (Xcode setting ENABLE_BITCODE=YES)

issue_02

From qt-creator List I got confirmation that this can be ignored. See also codereview 185929

codereview_headerpad

so next Qt releases will have this fixed.

member of multiple groups (“Supporting Files” and “Resources”)

Compiling a project for iOS it may happen that you get some warnings like this:

xcodebuild[5107:303392] warning:  The file reference for "/daten/_qt_workspaces/work_580/c2gQtCon_x/images.qrc" is a member of multiple groups ("Supporting Files" and "Resources"); this indicates a malformed project.  Only the membership in one of the groups will be preserved (but membership in targets will be unaffected).  If you want a reference to the same file in more than one group, please add another reference to the same path.

from QTCREATORBUG-14926: You can ignore this.

iOS Release Build Issues (Patch bitcode.prf)

So far all debug builds worked well. As next tested release builds and upload to GooglePlay BetaTest and Apple Testflight. Android Builds are running without any problems, but iOS Release Build filled my Issues Pane with 192 Issues – logging always:

:-1: warning: argument unused during compilation: '-fembed-bitcode-marker'

I created QTBUG-59352 – got info that similar bug was already reported (QTBUG-58754) and fixed: codereview

Fortunately this Warning again can be ignored. But it’s annoying building releases with hundreds of warnings. Thx to @jakepetroules I got  infos HowTo patch bitcode.prf. You’ll find this file here:

...sdk_580/5.8/ios/mkspecs/features/uikit/bitcode.prf

Open this file and replace the content by:

lessThan(QMAKE_XCODE_VERSION, "7.0") {
    warning("You need to update Xcode to version 7 or newer to support bitcode")
} else: !macx-xcode {
        # Simulator builds and all debug builds SHOULD use -fembed-bitcode-marker,
        # but unfortunately the -fembed-bitcode and -fembed-bitcode-marker driver
        # flags do not work in conjunction with -Xarch, so we'll have to let it use
        # the "wrong" flags for now (note that this issue affects only the Makefile
        # generator). We also don't want the flags to be passed in Xcode builds, as
        # the Xcode ENABLE_BITCODE setting will take care of that for us.
        release {
        QMAKE_CFLAGS           += -fembed-bitcode
        QMAKE_CXXFLAGS         += -fembed-bitcode
        QMAKE_OBJECTIVE_CFLAGS += -fembed-bitcode
        QMAKE_LFLAGS           += -fembed-bitcode
    } else {
        QMAKE_CFLAGS           += -fembed-bitcode-marker
        QMAKE_CXXFLAGS         += -fembed-bitcode-marker
        QMAKE_OBJECTIVE_CFLAGS += -fembed-bitcode-marker
        QMAKE_LFLAGS           += -fembed-bitcode-marker
    }
}

Now all -fembed-bitcode-marker issues are gone 🙂

Now we’re leaving the comfort zone.

Buttons remain some color of ripple effect

Suddenly I noticed a strange behavior in my more complex apps: Using the Drawer or Bottom Navigation Bar some color from pressing the buttons down remains after fingers are released. Fortunately this was fixed soon and the Drawer is working again (see patch)

Only one use-case left, where the Menu ToolButton remains some color:

toolbutton_clicked

Seems the ripple effect wasn’t reset completely while the Drawer is opening on top. At the moment I didn’t found a way to create a small test-case, but will try later agein.

Fortunately I found a workaround using a Loader toggling between two different Components of same ToolButton.

// ToolButton...
onClicked: {
        navigationBar.open()
        favMenuBugfix = !favMenuBugfix
    }

--------

Loader {
    id: favMenuLoader
    sourceComponent: favMenuBugfix? favMenuComponent1 : favMenuComponent2
}
Component {
    id: favMenuComponent1
    DrawerFavoritesMenuButton {
    }
}
Component {
    id: favMenuComponent2
    DrawerFavoritesMenuButton {
    }
}

Adding OpenSSL

As you probably know, Google removed openssl from Android7, so you have to add openssl libraries built by yourself.

My first projects with Qt 5.7 have used http only (they’re running behind firewalls on managed devices so this is secure)

All worked well without the need to add openssl – but it was on my ToDo list.

Qt 5.8 did some things different and now my Qt 5.8 apps are crashing from QNetworkAccessManager. From discussions in Qt Forums I’ve seen I’m not the only one seeing these differences between 5.7 and 5.8

There’s a documentation HowTo add OpenSSL support: http://doc.qt.io/qt-5/opensslsupport.html

unfortunately this fails on MacOS with error

unknown argument: '-mandroid'

long discussion in Qt Forum and on the Lists, but didn’t get it run – tried many hours. So I opened QTBUG-59375

finally from Android List I got a hint from Marco Piccolino and I found two .sh scripts doing the job.

More infos and HowTo use it in your own projects you’ll find at my github repo: https://github.com/ekke/android-openssl-qt

There are also some github projects providing prebuilt .so libraries, but I don’t want to include .so libs not built by myself from origin sources.

Hint: I got crash reports from users where openssl could crash if doing multi requests using QNetworkAccessManager. I had to add -DOPENSSL_THREADS. updated my github repo with the correct script: https://github.com/ekke/android-openssl-qt/commit/39d3d4122a132f1f73f7e7ed079de3f067775dde

Popup && Android Back Key problems

There was much work on Popups and (new with 5.8) Dialogs. Popups now also support ESC keys. But I run into two problems – see also QTBUG-59670

Popup without closePolicy: Android BACK quits the APP

There’s a new default closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside

But this doesn’t work on Android. Using Android BACK Key closes the APP without a chance to catch the key.

Workaround: set the policy explicitely – per ex. Popup.CloseOnPressOutside

Don’t use Popup.CloseOnEscape

Now this is working:

Keys.onBackPressed: {
 event.accepted = true
 // do something
}

Modal Popup doesn’t block Android BACK Key

Using a modal Popup this should block all Shortcuts and Back key.

But this doesn’t work using Android BACK Key. This time the key goes thru to Keys.onBackPressed.

Workaround: manage this blocking behavior by yourself.

Here’s the Popup:

Popup {
    id: popup
    modal: true
    closePolicy: Popup.NoAutoClose

    // your content

    onOpened: {
        appWindow.modalPopupActive = true

    }
    onClosed: {
        appWindow.modalPopupActive = false
    }
}

and in your main.qml:

ApplicationWindow {
    id: appWindow
    width: 410
    height: 680
    visible: true
    ...
    property bool modalPopupActive: false
    ...
    Keys.onBackPressed: {
        event.accepted = true
        if(appWindow.modalPopupActive) {
            showToast(qsTr("Back key not allowed"))
            return
        }
        ...
    }
}

QTBUG-59670 is classified as critical so I’m sure will be fixed for Qt 5.9

Text Selection Handles

There are some problems with Text Selection Handles – see next Page.


As I promised: updating your APP from 5.7 to 5.8 is mostly harmless 😉

I’ll tweet @ekkescorner if finding more issues while working on my apps and I’ll blog about new features like Dialogs and more.


← Back (Patch Qt 5.8)

→ Next Article (Text Selection Handles)

⇐ Home (Overview / Topics)


Business Data App

July 14, 2016 — 21 Comments

Work in Progress – wait for Tweet @ekkescorner

Overview

This is part 7 of a series of demo apps helping you to understand Qt 5.7 for x-platform development on Android and iOS. This app demonstrates some aspects of a Business App. Please read the blogs abvout my other Examples before:

  1. First app with One Page
  2. StackView
  3. SwipeView
  4. TabBar
  5. Bottom Navigation
  6. Drawer Navigation

xxxxxxxx

orderList

xxxxxxx

Sources

as usual at Github: https://github.com/ekke/biz_data_x

Summary

You learned ….xxxxxxx

Stay tuned for the next Example Apps …


← Back (Drawer Navigation App)

→ Next Article (Qt Con Conference APP)

⇐ Home (Overview / Topics)

This blog is part of my blog series about Business Apps.

—work in progress / stay tuned / will tweet @ekkescorner

intermarkt_thielen

Overview Goods Receipt APP

icon_144

Goods Receipt APP (Intermarkt Thielen) (c) 2015 by ekke (BlackBerry Elite Developer)

This app is running at a german Plants Wholesale company. Plants are delivered via Trucks to stores. Before the goods are going out there’s a check if quantity and content is the same as ordered and packed. If all is OK, data will be send via EDI from Plants Wholesale company to Plants Store to avoid the time consuming work of Goods Receipt at arrival of the truck.

workflow

The challenge was to develop a mobile app to make this work of checking the goods easy, fast and avoid errors. Plants are collected as single plants or in containers, Euro Pallets etc. All Plants have a barcode (EAN13) and also the Customer’s Sales Price printed on a label. All the Goods belonging to one order can be collected on some carts / trailers where it must be possible to start the check before the complete order was packed.

So this is the workflow: Scan the barcode from the order, get quantities and units of packed data from server, cache on device, then scan all goods. If ready get expexted (packed) data again from server and compare. Show positions and mark correct data, too much or less / missing. Correct, add or remove data, add all the containers / Euro Pallets and send quantities and units back to server.

Server is connected via REST services. All work on the mobile device is cached on the device to allow working while offline.

XXXX

Hardware

The mobile App must be robust and easy to handle with large fonts and big buttons. The device will be placed inside a arm bag and all the navigation and data entry must work by tapping on the device without getting the virtual keyboard where keys are too small. Barcode Scanner will be placed on the index finger to be able to work hands-free.

So this is the Hardware:

  • Fulltouch Device: BlackBerry Leap
  • LXE 8650 Honeywell Ring Scanner
  • Custom – made arm bag for the Leap

leap

lxe8650

Image of the Arm bag will follow – it’s just in-production. The bag must work inside and outside in the sun, so must be glare-free. Wasn’t easy to find the right one so finally we decided to produce a custom made bag.

 

APP-in-action (Video)

work-in-progress

The mobile APP (Screenshots)

At startup the APP automatically switches Bluetooth ON and at the end Bluetooth will be switched OFF.

There’s no other Bluetooth APP on these devices, so it’s a good idea to be energy efficient.

After switching Bluetooth ON, the APP is searching for the last connected Scanner.

If no one found you can manage all the Bluetooth stuff without any tech knowledge from inside the app (see below at the end of this article)

we_01_start

Bluetooth is ON and Scanner is connected: you’re ready to start work for Goods Receipt.

we_02_started_MOCK

Now scan the Order number from the Picking List you want to check.

we_03_wait_for_pnr

Picking List with informations on Customer and Positions will be downloaded from server via REST service and cached inside your secure app sandbox.

Scanning the same Order number again will load the data from cache – so it’s easy to switch.

All Pages are using large fonts and designed to make it easy to read, understand and to tap on.

 

we_04_pnr_header

As soon as one of the Picking Lists (Orders) is active you can start to scan EAN13 Barcodes from the packed goods.

If a Barcode was not found inside the active Order, the APP is looking at other cached and not yet completed lists. If Barcode was found inside another Order, you’ll get the info using a Custom Dialog.

Then it’s easy to switchto another Order by a single Tap or cancel if the wrong article was scanned.

we_05_select_pnr_for_ean

Each Order Position knows allowed Barcodes, so from scanned EAN 13 Code the APP detects the Order Position and displays description, price, size, quantity and content.

You also see the amount of already scanned quantity (in the example below: 60) and you get an Icon at the right to know about the current state:

 

icon_quantity_states_down

red arrow down: less scanned then packed

 

 

icon_quantity_states_up

 

blue arrow up: more scanned then expected

 

icon_quantity_states_done

 

green checkmark: all is OK – scanned quantity same as packed

 

we_06_ean_scanned_MOCK

Tapping on the Icon you’ll get a list of all single scans for this position.

From here you can tap on on Unit (Menge) or Content (Inhalt) to edit the value.

Tapping on the trash sets quantity to 0.

we_07_already_scanned

One of the great things from BlackBerry 10 OS is the “peek-back” functionality: you always know about the context by simply swipe the current Page to the right border.

Here peeking back from an Order Position to Order Header gives easy access to Order and Customer info:

we_08_peek_back_from_scan_to_pnr

Remember: the Device is inside an arms bag and it must be easy to enter data.

Key caps from virtual keyboard are too small, so I developed a numeric keypad occupying complete space from Device in Landscape orientation.

This numeric keyboard knows about the context and so it’s optimized to enter Quantity, Content, Prices, Order Numbers or EAN13 Codes.

The screenshot below shows entering Quantity (Menge):

we_09_enter_quantity_MOCK

Want to get Info about corresponding Position data ?

Simply peek back and go on without closing / opening pages – that’s the BlackBerry 10 FLOW:

we_10_peek_back_from_enter_q

Here a quantity of 4 Containers was entered where each one contains 6 Plants = Total (Summe) of 24 Plants:

we_12_entered_quantity

If a Barcode (EAN13) is dirty and cannot be scanned it’s easy to enter the number manually.

The APP checks immediately if you entered exactly 13 digits and also validates if checksum is correct before searching the position.

Goal is always to make it as fast as possible and avoiding errors.

we_13_enter_ean

Sometimes it happens that inside an Order there are more then one positions found for a given Barcode:

in this case the employee can select if he/she’s scanning the position with a content of 6 or only 1 in each container:

we_14_select_pos_for_ean

All Lists, all Dialogs have custom big Buttons and large List Rows to make it easy to tap on.

If something went wrong, the Device does a vibration to alert the user.

we_15_pos_selected

While checking the scanned data before sending them to the Server a list with all the scanned or not scanned data is displayed.

Tapping on an entry shows the history and quantity or content values can be changed or removed.

we_16_check_positions_MOCK

If no scanned data was already entered for a specific position you can also enter data manually.

At first you must verify the Barcode – in some cases there can be more then one Barcode valid for a position, so you must select the right one:

we_17_select_barcode_from_check_pos

As last step quantities of all Empty-Containers put on the Truck must be entered.

If all is done you can send data back to server. Then in the Office data can be varified again and if all is done, the Goods Receipt will be sent via EDI to Customers IT.

we_18_enter_container

If more then one orders are active (stored in offline – cache) you can easy switch to another one:

we_19_select_from_active_pnrs

The APP also provides all Bluetooth Management from inside the APP without going to Device Settings to make this an easy stuff.

After scanning for Bluetooth Devices nearby, found Devices are grouped by Type and Scanners can be edited.

we_20_search_bt_devices

Tapping on a row shows the details and allows to Pair / Unpair or Connect / Unconnect a Scanner:

we_21_pair_and_connect

There’s also a special testpage from where you can test if the Scanner works well.

we_22_test_scanner

Over all BlackBerry 10 OS  and hands-free working makes following the workflow fun and also to be productive.

Running the Scanner in serial mode (SPP Profile) makes it very comfortable, because scans can always be done and not only while focused on entry fields as done in HID profile.

It’s some more work to implement serial connected Scanners, but Customers will thank you for this.

The Backend

Here’s a short snapshot from the backend (ERP solution): Positions ordered (bestellt)….

we_backend_01

… packed (Gepackt) and compared (Geprüft) from mobile Goods receipt APP.

The Barcode Icon at the very left shows the details of all scanned data.

we_backend_02

Take a look at the Video to get a feeling how smooth this app is working. Then you understand why my first choice for Business Apps is always BlackBerry10 OS. More of my BlackBerry 10 Business Apps can be found here.