Hi everyone,
Now that the Material/Universal design components have moved to core QML controls, can you use them in AppStudio 1.4.18?
I have managed to color a rectangle but the theme and accent color is not working as expected.
In MyApp.qml:
import QtQuick 2.5
import QtQuick.Controls 2.1import QtQuick.Controls.Material 2.1import ArcGIS.AppFramework 1.0App {width: 400height: 640Material.theme: Material.LightMaterial.accent: Material.BlueMaterialRectangle {}
}
MaterialRectangle.qml
import QtQuick 2.5import QtQuick.Controls 2.1import QtQuick.Controls.Material 2.1import ArcGIS.AppFramework 1.0Rectangle {width: 400height: 640color: Material.color(Material.Teal)Material.theme: Material.LightMaterial.accent: Material.Yellowproperty int theValueSwitch {id: switch1x: 143y: 161text: qsTr("Switch")checked: theValue >= 50enabled: theValue >= 50}
Dial {id: dialx: 108y: 228from: 0to: 100value: theValueonValueChanged: theValue = parseInt(dial.position * 100)Label {anchors.centerIn: parenttext: theValuefont.pointSize: 35}
}
SpinBox {id: spinBoxx: 130y: 450value: theValueonValueChanged: dial.value = value}
}
If I'm missing something, great. However, in the help from Qt it says that QQuickStyle needs to be set to ("Material"). Is this value the culprit? If not, is there a simple fix?
Material Style | Qt Quick Controls 2 5.8
Styling Qt Quick Controls 2 | Qt Quick Controls 2 5.8
Marika Vertzonis Shobana Suresh Stephen Quan any info would be greatly appreciated.
Cheers,
"Bruce"
Solved! Go to Solution.
Regarding AppStudio 1.4.18, on desktop platforms, you can launch your app with the command line argument argument:
./app -style material
Alternatively, use Local Make to create C++ project files so that you can use QQuickStyle in the main.cpp:
QQuickStyle::setStyle("Material");
then build your app with Qt Creator.
Reference:
Regarding AppStudio 1.4.18, on desktop platforms, you can launch your app with the command line argument argument:
./app -style material
Alternatively, use Local Make to create C++ project files so that you can use QQuickStyle in the main.cpp:
QQuickStyle::setStyle("Material");
then build your app with Qt Creator.
Reference:
Thanks for that Steve. Got it working on desktop to prove it works, however really need it on the other platforms. Will have to way up if the style is worth implementing local make just for this, because the cloud builder is so convenient.
Couldn't that be set as a property and then AppRun could know what to do, just like it does with the App width and height.
Perhaps a property of App could be QuickStyle: Enums.QuickStyleMaterial ?
Cheers,
Gareth
Gareth,
You could try adding a new environment variable QT_QUICK_CONTROLS_STYLE with value "material" in AppStudio Settings -> Environment.
Supported Environment Variables in Qt Quick Controls 2 | Qt Quick Controls 2 5.8
Qt documentation says "The style must be configured before loading QML that imports Qt Quick Controls 2. It is not possible to change the style after the QML types have been registered."
So, please try to delay load the QML file that imports "Qt Quick Controls 2" possibly using Loader.
Unfortunately this is a limitation in AppStudio 1.4. In the next release of AppStudio, there will be a way to configure the app's style. For e.g., if a file named qtquickcontrols2.conf is present in the app's root folder, both AppRun and apps built with AppMake will use this configuration file for setting the app's style.
Qt Quick Controls 2 Configuration File | Qt Quick Controls 2 5.8
Thanks
Shobana
cc: stephen_quan