The application I currently work on has a map as a background, and above it various other dialogs(views) with more than one view inside can be opened. When some of the dialogs is active, when dragging over it's background map is moving like there's nothing above it. Does someone know how to disable this? I don't want map to react on clicks or anything inside a dialog.
The project is organised so that each dialog is implemented in separate qml file:
I have each qml file for each dialog, and each component of application (map), so
when you click, for example on settings tab in scrollable horizontal list, settings tab is opened from qml that holds all dialogs, including bottom and top of the app
each dialog is above map and has a 50% transparent background, with related images and buttons in it
I want to disable dragging map while dragging over dialog's background. I tried with setting this to each dialog:
MouseArea {
anchors.fill: parent
onClicked: mouse.accepted = true
}
(parent is Item that holds all elements of a dialog), but this doesn't work.
If I'm understanding your question correctly, it should suffice to set the MouseArea's propagateComposedEvents to false.
Related
The Qt QML based mobile/desktop convergent UI framework Kirigami provides a QML type ScrollablePage to support scrolling through content. Placing any visual QML item into it automatically makes it scrollable if it's larger than the ScrollablePage itself:
ScrollablePage is a Page that holds scrollable content, such as ListViews.
Scrolling and scrolling indicators will be automatically managed.
Kirigami.ScrollablePage {
id: root
//The rectangle will automatically be scrollable
Rectangle {
width: root.width
height: 99999
}
}
(source)
This provides scrollbars and allows scrolling with the mouse wheel, two-finger-scrolling with the touchpad and flicking ("click and throw") scrolling as we're used to from touchscreen devices.
However, it does not allow scrolling with any keyboard keys (Arrow Up / Down, Page Up / Down). How can I make that possible? The usual approach of doing Keys.onUpPressed: scrollBar.decrease() does not work because the ScrollablePage's scrollbar is not accessible as part of its public API.
Instructions
Use a Flickable to wrap the content items you put into your ScrollablePage. Then evaluate key press events in the Flickable and in response execute flick() to scroll the view. Example (combining examples from the Kirigami manual and from the Qt manual):
Kirigami.ScrollablePage {
id: root
Flickable {
focus: true
topMargin: 20; leftMargin: 20; bottomMargin: 20; rightMargin: 20
Keys.onUpPressed: flick(0, 800)
Keys.onDownPressed: flick(0, -800)
Rectangle {
width: root.width
height: 5000
}
}
}
Details and Explanation
While you can't access the scrollbar, you can access what the scrollbar uses to move the view: a Flickable instance. You just have to wrap it around the page's content. If you don't, ScrollablePage internally uses ScrollView to wrap your page's content in a Flickable anyway, but then you don't have a reference on it to execute flick().
Executing flick() does the same as when the user flicks the element, so the scrollbar position etc. will be updated alright.
If it still does not work, then (1) maybe you give too small pixel/second values to Flickable::flick() for scrolling to be visible or (2) maybe the initial Flickable::flickDeceleration values on your platform are messed up. These values are platform specific, so it can require some experimentation. On some platforms, setting them to zero during a flick() will help, while under Linux this is exactly the value preventing any scroll movement.
It is not necessary to enable ScrollablePage::keyboardNavigationEnabled for the above solution to work, since that is only for moving the currentItem of suitable content with the arrow keys (see below), and not for scrolling in general. It will even prevent ordinary scrolling in case your page content is an item view (ListView, GridView etc.).
Alternative solution for item views
If the content of your ScrollablePage is an item view (any QML object that has a currentItem property, such as ListView or GridView), then instead of wrapping that content in a Flickable just enable ScrollablePage::keyboardNavigationEnabled. It will allow you to move the currentItem with the Arrow Up and Arrow Down keys. That's what one usually wants for these views, even though it's not scrolling but rather keyboard navigation.
Using Qt 5.10, Qt Quick2 2.10, Qt Quick Controls 2.3 Button class, I have defined a button that displays an icon and a button that displays text as follows:
Button {
iconSource: "my_button.png"
enabled: sometimes
}
Button {
text: "My Button"
enabled: sometimes
}
I would like the icon button to behave just like the text button below it for user interaction. It should change its appearance appropriately when it is in the click, hover, or disabled state.
Hover and click mode are working, since they only rely on changing the icon background, and not the icon image itself.
Disabled mode is not working. The button displaying text behaves correctly (the text and the border turn gray), but in my icon button, nothing changes when it is disabled.
Details about my icon file:
The RGB values are all black (#000000) corresponding to the color I want my icon drawing to be. The image shape is drawn in the alpha channel. I have tried playing around with the other channels, but I have not had success.
Here is an image from my project. You can see a row of icon buttons on top, and three text buttons below. Although some of the icon buttons are disabled, they all look the same.
I have cleaned up this question. Maybe should not have posted a question the day after St. Patrick's Day :)
The Qt docs for the Button class instruct you to set the iconSource property to define the url for the icon image file. However, this is for QtQuick 1.4.
QtQuick 2.3 does not appear to have documentation yet, though it is the standard for the current Qt 5.10.
The Button (Controls.2/Button.qml) inheritance list is:
QQuickItem
QQuickControl
Templates.2/QQuickAbstractButton
Templates.2/QQuickButton
Button or {Style}/Button
There is no longer any iconSource property in Button. Instead, you access the icon property of QQuickAbstractButton, which is of type QQuickIcon. Using icons in Qt Quick 2 is documented here - Icons in Qt Quick Controls 2 -, along with.. a Button example!
Since the parent classes of Button use prototype inheritance, it seems that the properties of the parents, such as "icon" are available in the Button class as well. You can look in the qml directories in the Qt installation directory to see the class declarations without downloading the whole Qt source code.
So, my new Button code looks like this:
Button {
icon.source: "my_button.qml"
icon.color: enabled ? "#000000" : "888888"
enabled: sometimes
}
Note: I am using the Fusion style, but this does not affect the existence of the icon property, which is inherited from a prototype.
I want to use a QML TextArea on a mobile device, where the user cannot scroll by swiping through the contents. Instead I want the widget to grow with the content (which I can do by utilizing contentHeight).
But I am unable to disable the scrolling behavior. TextArea has this scrolling behavior because it inherits from ScrollView.
You can use ScrollView's property flickableItem to change or disable scrolling behavior. In your case I'd use:
TextArea {
flickableItem.interactive: false
}
If you want to do something else, check out QML's Flickable, you should be able to use all its properties like with any other Flickable.
I have a video output embedded in a QML view. It is working fine, but I want to make that video output go fullscreen when I click on it.
Every time, some images that are in the view (some sibiling, and some not) are visible on top of my video. In fact, it should fill the root element, and be at the front screen.
Changing the z property doesn't do anything.
What is the best trick to make a video go fullscreen? When I switch from normal to fullscreen, the video should continue its flow with no interuption.
A solution only in QML (and no C++) would be preferable, as I build my QMLs by parsing XML files.
You can create new fullscreen window from QtQuick.Window module and pass tpo that window video path,time and play.
Component {
Window{
id: videoWindow
flags: Qt.FramelessWindowHint
HereYourPlayer{
}
}
}
than you should create that Component and call videoWindow.showFullScreen()
I finaly found the solution I needed. In fact it was simplier that it seemed. I created an Item just under the root, and I changed the parent of my video element when I wanted to go fullscreen. I put my new Item as the parent of my video element.
I didnt know that we could change the parent of an element.
I am having QListWidget, i want to have a Transparent Scrollbar with Image.
Initially that scrollbar should be hidden on scroll only it should show.
How i Can achieve this in Qt ?
Any examples or ideas are welcomed.
How i can apply image to Listview Scrollbar.
Here are the three things you can look at to be able to control the scroll bar for most kinds of widgets in Qt:
VerticalScrollBarPolicy
HorizontalScrollBarPolicy
enum Qt::ScrollBarPolicy.
To be able to track how the user interacts with your QListWidget or any Widget for that matter you need to subclass it and implement the virtual methods from the QWheelEvent and possibly the QKeyEvent.
Scrolling is typically done with the mouse wheel and with the keyboard arrow keys and sometimes page-up and page-down and spacebar. I haven't done a lot with QListWidget, but you should double check which keyboard events/mouse events trigger scrolling.
These events will cause scrolling event even after you set either or both of the ScrollBarPolicies for the widget to be Qt::ScrollBarAlwaysOff.
First you should put in the constructor of your widget
this->setVerticalScrollBar(Qt::ScrollBarAlwaysOff);
this->setHorizontalScrollBar(Qt::ScrollBarAlwaysOff);
So you just need to setMouseTracking(true) for the widget (so that it tracks more than just the clicks) and reimplement at the very least wheelEvent(), and when a wheel event occurs, set the vertical/horizontal scroll bar policies to true and call update on your widget.
If you want to turn the scrollbars back off after a few milliseconds after they have started scrolling, you will need to create a QTimer in your constructor for your subclassed widget and connect it to a slot that sets the scroll bar polices on the timeout. Then you start/restart that timer every time the user does a wheelEvent().
As far as applying an image to the ListView Scrollbar, you should look into subclassing QAbstractScrollBar, if you want to actually put an image on it or change the way it looks. Setting up some tool buttons may also be the way to go if you are trying to put buttons with different icons in place of the scrollbar.