I am using QML component WebEngineView, It has been observed that, scrollbar is by default implemented in WebEngineView, but there is no interface to change the width of scrollbar. This is required in my use case where I cannot use swipe, I can use only mouse drag operation on scrollbar of the WebEngineView in order to view all hidden part of the web content where length is outside the view port area. Since Scrollbar size of WebEngineView( default is very small 15pix )its quite difficult to drag exactly on the area and drag using mouse.
Can Some one suggest how to customize the scrollbar of WebEngineView?
or
I can find webengine source code, then modify and build for the purpose?
or
Any Style Can apply on WebEngineView ?
I am using Qt 5.6.2
Qt Webengine Source code Observation:
QML Webengineview is not set any scrollbar width internally, instead it uses back-end scrollbar probably of chrome’s.
WebEngineView uses the scrollbar that comes from the Chromium backend and there is no QML or C++ API to customize it directly. However WebEngine supports to change these scrollbar styles in CSS, so the only thing you can do is to install a user script which applies a bigger width on all -webkit-scrollbar.
See this related example: http://doc.qt.io/qt-5.10/qtwebengine-webenginewidgets-stylesheetbrowser-example.html
And your stylesheet could look like this:
::-webkit-scrollbar {
width: 40px;
}
Related
I have created a custom keyboard layout for my QtQuick application using the VirtualKeyboard in 5.9.2. I am trying to fit this keyboard on a small screen to make it more readable and usable than the Virtual Keyboard was stock.
There are two things I need to do which I cannot seem to make work:
Make the font larger on the keyboard buttons. After changing the layout, the buttons are larger, but the text on the buttons is still the same, tiny size. It looks strange.
Reduce margins surrounding the keyboard to use up more of the available screen space. The keyboard is already set to the width of the screen. I could make it larger, but if I could simply reduce the margins that would be a much more simple solution.
Any help would be appreciated!
you can use screen properties in qml and set font.pixelSize and margin according to screen height and width.
import QtQuick.Window 2.2
and use below properties
Screen.pixelDensity
Screen.height
Screen.width
The best way to solve this is by using a style.qml sheet. This is answered in a different question of mine located here: Qt Virtual Keyboard Custom Style
Is there a way to adjust the thickness of the scrollbars of a WebView using the stylesheet used by the whole JavaFX application?
I am a bit confused since
on the one hand I read that the scrollbars are not part of the JavaFX UI control and therefore can only be customized by a stylesheet set on the web engine (webview.getEngine().setUserStyleSheetLocation(..)) which means I have to write another CSS trying that the scrollbars look like all other scrollbars in the application
and on the other hand I can see that the scrollbars are obviously correctly customized using the JavaFX CSS except the thickness of the scrollbars (and that the vertical scrollbar is always shown even if the loaded page requires no scrollbars at all)
So where am I wrong and which is the correct way to solve this problem?
Thanks in advance!
Is it possible to make a borderless window on Qt? I know its possible in Visual Studio you just change the value in the properties window. Qt doesnt have a formborderstyle property.
Also is it possible not to display icon on taskbar
I think it is not possible to suppress the taksbar entry. Each top level window without a parent will get one.
It surely is possible to create a frameless window. I once used a plain QWidget for a similar purpose and add something like the following:
setWindowFlags(Qt::Dialog|Qt::FramelessWindowHint);
Setting the window flags using setWindowFlags() on your top level widget with
Qt::FramelessWindowHint - Draw without window frame
See the full doco at http://qt-project.org/doc/qt-4.8/qt.html#WindowType-enum and http://qt-project.org/doc/qt-4.8/qwidget.html#windowFlags-prop
As for hiding the taskbar look at this stack overflow example Qt Hide Taskbar Item (just sets the windowFlags to include Qt::Dialog you could do what your looking for with
MyWindowWidget(QWidget *parent)
: QWidget(parent, Qt::Dialog|Qt::FramelessWindowHint)
i created my custom style for ScrollView, but actually i don't know how to check what orientation of scroll is it (horizontal or vertical? I need use different image for each of them).
source code of scrollview style
In this source code, that i found, is used word horizontal, but where it comes from? I don't see any declaration of horizontal property.
It comes from this line. In newer versions of Qt, properties for style components are exposed through the styleData object; this is now standard practice for all Qt Quick Controls styling. In the case of ScrollViewStyle, commit e0c8035c updated the code to use styleData instead.
I'm using a view hierarchy of
QMainWindow > central widget > QVBoxLayout > QGraphicsView (800x600 fixed) > class deriving from QGraphicsScene > QGraphicsWebView (800x600)
When I load a jQuery Mobile powered HTML file and use the horizontal slide transition between pages, the value of window.outerWidth grows to 2400 pixels. But the actual page width, and value of window.innerWidth, remains at 800. The web view then shows 800 pixel-wide white bars at the left and right (horizontal scrollbar also expands to 2400px), with the new jQM "page" in the middle. Right-clicking in the white bars does not show the QtWebView context menu, but right-clicking in the middle works. I enabled developer tools [1] which told me that the HTML, BODY and DATA-ROLE="page" elements have the correct width of 800px.
This is working in browsers like Firefox and Chrome, so I think it's a bug in Qt's web view implementation or a setting that I have missed. The problem seems to come from the fact that the jQM pages which are sliding in/out during transitions are considered for the width. Why does window.outerWidth get such a wrong value? Note that any size policies on the web view do not have an effect. Any ideas what else I could try?
[1] "Inspect" context menu option:
QWebSettings::globalSettings()->setAttribute(
QWebSettings::DeveloperExtrasEnabled,
true);
Solved it by upgrading to Qt 5 which has the latest WebKit. It however creates new trouble, so first try if the rest of your web pages work before switching to the newly released 5.0.0.