QGraphicsScene to HTML? - qt

Using Qt, I am working on a tool that displays items in a QGraphicsScene. Items are both polygons and QGraphicsTextItems. The latter can contain hyperlinks.
Problem: I am trying to export the diagrams and I would like to keep the hyperlinks active.
Using QImage renderers produce nice PNG but (obviously) no hyperlinks.
QSvgRenderer produce SVG that also do not embed the hyperlinks.
QPrinter allows to generate PDF that do the job (more or less) - hyperlinks are clickable, and that is what I need in principle. Except that I want to publish the diagram on the web, so PDF is not really an option for me.
I could not find any way render the QGraphicsScene in an HTML form. Did I miss something? Is there a way to do that?
Thanks
EDIT
A code example:
from PySide import QtGui, QtCore
app = QtGui.QApplication([])
scene = QtGui.QGraphicsScene()
view = QtGui.QGraphicsView(scene)
item = QtGui.QGraphicsTextItem()
item.setOpenExternalLinks(True)
item.setHtml('Hello')
item.setTextInteractionFlags(QtCore.Qt.LinksAccessibleByMouse)
scene.addItem(item)
view.show()
app.exec_()
This example displays a scene with a clickable hyperlink (that opens the link with the default system application). In my application the scene also contains some graphical item but I think this is sufficient to get the idea: I would like to have this scene rendered (or printed or exported) in HTML so that the links would remain clickable.
The following code does the export to PDF:
pdf_printer = QPrinter()
pdf_printer.setOutputFormat(QPrinter.PdfFormat)
pdf_printer.setPaperSize(rect.size().toSize(), QPrinter.Point)
pdf_printer.setFullPage(True)
pdf_printer.setOutputFileName(filename)
pdf_painter = QPainter()
pdf_painter.begin(pdf_printer)
scene.render(pdf_painter, source=rect)
pdf_painter.end()
And the resulting PDF does contains the active hyperlinks - this is what makes me thinks that all the mechanics is there. I just cannot find a way to export in HTML instead of PDF.

Related

QWebEngineView display position

I used QWebEngineView to call html, and now I've shown success. however QWebEngineView is shown in the upper left corner, I want to show QWebEngineView in the white area below. First, I don't know how to do this step.Second, I don't know what kind of Qt should be used in the white area shown.Or you can provide me with a good tutorial to solve my current problem.
This is my interface:
The bar chart is the HTML file I want to display
This is the part of my code:
pEngView = new QWebEngineView(this);
pEngView->setContextMenuPolicy(Qt::NoContextMenu);
pEngView->load(QUrl("file:///html/barx.html"));
pEngView->show();
Use Qt Designer and place a QWidget at the area you wanted. Then promote the QWidget to QWebEngineView and use the ui pointer to get pointer of the webengine widget. If you are new to Qt/QtDesigner follow the tutorials.
http://doc.qt.io/qt-5/designer-layouts.html
http://doc.qt.io/qt-5/designer-using-custom-widgets.html

Make the objects' size of a GUI adapt to window

I created a GUI with Qt5 but I will like the objects to be always contained in the window. When I change the size of the window (with the mouse), the objects dont resize themselves and therefore are hidden by the window.
Basically, I will like my GUI to act like a Web Page for example.
I think I have to use the Layout properties to do that but I dont seem to find it in Qt (in the QBBoxLayout or QWidget ?). I will like to change this in Qt and not in my PyQt script if possible.
Have you set the layout of the window ?
Normally you should have a code similar to this one
dialog = QDialog()
verticalLayout = QVBoxLayout()
label1 = QLabel("first")
label2 = QLabel("second")
verticalLayout.addWidget(label1)
verticalLayout.addWidget(label2)
dialog.setLayout(verticalLayout)
if you are creating the gui writing the necessary the code yourself.
If you are creating the gui with the designer, probably you have not applied a layout to your window.

Setting Polygon ROI with mouse in Qt

Anyone have any idea how I can implement this? I'd like to have a function basically exactly like impoly in matlab or the "polygon sections" tool in imageJ, where you click to form a polygonal section and then each node can be adjusted, etc. I'd also like to have access to this function from Qt since I'm trying to make a gui for a small program I wrote.
Also, I'd like to avoid making calls to the matlab function because it's part of the image processing toolbox which isnt free. Thanks.
I think the best way to implement this is using the Qt Graphics View framework. Create a scene with an Item displaying your image in the back and add draggable Items on top representing the corners of your polygon.
Your selection tool should probably be a subclass of QGraphicsObject hosting the polygon corners as child items and a QGraphicsPolygonItem below the corners being updated whenever the user readjusts the selection. As QGraphicsObject inherits QObject, you can emit signals with a QPolygonF or QPolygon argument whenever the selection changes, informing other parts of your application
This demo should be a good example of the corner-adjust functionality you need.
Qt Pathstroke Demo
(uh well, the example implements the drawing and dragging of the control points from scratch.. I'm sure you can do it by using QGraphicsEllipseItem instead and react on their position changes)
I think you would need to code this yourself. There is an excellent example in the C++ GUI Programming with Qt 4 book (there's a PDF copy floating around online; I think it's legal) where they show you how to create a diagram with nodes and links. The chapter is called "Item-based rendering with Graphics View".
The basic idea is that you have some draggable nodes, which are QGraphicsItems with the ItemIsMovable flag set to true, and then some links that connect them, which are QGraphicsLineItems. All of these would go into a composite QGraphicsItem representing the ROI, and all of those would go into a QGraphicsScene, which would be displayed by a QGraphicsView.
Bottom line: there isn't a built-in copy of the MATLAB function, but all the tools are there for you.

Truncated tab bar in Qt

On this site
there is a picture with two "tab-systems".
I would like to have the second one, which is described as "A truncated tab bar shown in the Plastique widget style." There you have arrows, which allow you to slide through the tabs.
I have implented a "tab-system" which looks like this:
QTabWidget *tabWidget = new QTabWidget();
tabWidget->addTab(ToolGroupBox(),"Toolbox");
tabWidget->addTab(CameraGroupBox(),"Camera");
...
QVBoxLayout *layout = new QVBoxLayout;
layout->addWidget(tabWidget);
As I understand it is possible to create the truncated tabs if I use the tabRect-function of the QTabBar-class. I have tried several things but unfortunately its not working.
You want the usesScrollButtons property of the QTabBar. You can access the QTabBar of your QTabWidget via the tabBar method.
You don't need to get involved with tabRect at all. The documentation just before the picture of the two tab systems is not directly related to it. The figure is just showing you two possible tab styles.

How to change bitmap and label of an Button component [Flash CS5, ActionScript-s]

I have created one button component using one Bitmap and one Label in it.
Thing is that when user Clicks on on the button I want to changes button's Icon/Image and Label Text.
I want to do this using FlashCS5 and ActionScript-3.
I have tried following but it gives me runtime Error
[Bindable]
[Embed(source="/Images/test.png")]
var testIcon:Class;
testButton.setStyle("icon", testIcon);
Is there any other way of doing this.
Thanks.
You need to instantiate testIcon first. Try doing this:
[Embed(source="/Images/test.png")]
var testIcon:Class;
var btnGraphics:Bitmap = new testIcon();
testButton.setStyle("icon", btnGraphics);
Looking at what you want to archive i think you should follow following steps
1. Create one movie clip using new symbol
2. Create Two new Button Symbol using 2 different images and label
3. insert these button into the key frames for the created movie clip
you can use this movieClip to create new buttons that can have 2 states
just use gotoAndStop to display the proper button.
This is an answer for a followup that ppp asked:
There is a property labelPlacement="right|left|bottom|top" property. Default is right if you set it to bottom, the icon will show above the text.
You can create a button skin in flash and import them into flex. My experience with flex 3 skins imported from Flash is that it takes a bit of work and back and forth to get it working perfectly. Flash Catalyst for Flex 4 has greatly improved that workflow.

Resources