如何在 QT (PyQT) 中实现类似于 Google 图片搜索的布局？

发布于 2024-09-08 04:30:33 字数 995 浏览 3 评论 0 原文

我是 QT 新手。我在我的项目中使用 PyQT 进行 GUI 开发。我想在我的应用程序中实现这种布局。该应用程序从图像数据库中搜索图像。谷歌图像搜索布局非常适合我的目的。

我正在阅读《使用 Python 和 Qt 进行快速 GUI 编程》一书，并且熟悉布局。我想我需要对每个网格框中的每个结果图像使用网格布局。 &在每个网格框中对 (image,Qlabel,Qlabel) 使用垂直布局。

这些是我面临的一些问题。

重要的是，我无法显示图像。我需要什么控件/小部件？我找不到任何类似于.NET的PictureBox的东西
如何通过图像中的固定间隙分隔这些图像结果？我正在使用水平和水平垂直间隔，但这不起作用？
如何将QLabel设置为可点击（如超链接）。我不想打开 URL。只是文本应该是可点击的。因此，当用户单击链接时。我可以显示更多信息（例如，当他单击下一页编号时显示下一组结果，或者当用户单击“查看”时显示全尺寸图像的新窗口），我们对此是否有某种新的控件？
这是另一个重要问题。我将显示结果的页码（如图所示）&假设它们是可点击的。如何加载新页面结果？我的意思是 QT 中的 page 相当于什么？
正如你所猜到的。这绝对不会是 GUI 的第一页。第一页将与 http://google.com 完全相同（一个大徽标和文本框，其下方带有按钮）。当用户单击搜索按钮时。将显示此页面。同样的问题又出现了。如何更改页面？

请给出我为此需要的控件列表。如果我不知道什么，请告诉我。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

痴骨ら 2024-09-15 04:30:33

1/2。
要显示图像和标签，请使用 QListWidget 并将视图模式设置为 QListView：：图标模式。但是，如果您需要自定义显示超出 QListWidget/QListWidgetItem api 可以提供的范围，您将需要创建自己的 QAbstractListModel 并使用标准 QListView 。
请务必阅读Qt 模型/视图入门。

至于图像间距，请检查 spacing 属性列表视图。

以下是 KDE 的 Dolphin 文件管理器的示例：
海豚的图标模式

3. 使用常规的 QLabel，但将内容设置为 href。

示例：

编辑：哎呀，我从您的标签中看到您正在使用 PyQt，以下是 C++，但应该与您在 python 中执行的操作类似。

  QLabel *linkLabel = new QLabel;
  linkLabel->setTextFormat( Qt::RichText )
  linkLabel->setText( "<a href=\"someurl\"> Click me! </a>" );
  connect( linkLabel, SIGNAL( linkActivated ( const QString & link ) ), .... )

4.
好吧，既然您使用的是模型/视图，为什么还要麻烦页码呢？用户只需滚动视图即可显示更多图片。这是迄今为止最简单的解决方案，因为一旦您完成了 M/V 设置，您就无需执行任何操作！

但是，如果您确实想显示页码，则需要在模型中进行更多工作。例如，在模型中跟踪“当前页面”，并且仅允许访问“当前页面”上的图像。然后在连接到 linkActivated() 信号的插槽中告诉模型更改页面。我不会详细介绍，因为这严重违反了模型/视图背后的整个想法。这样做的“正确方法”是子类化 QListView 并添加分页支持，但就像我说的为什么不使用滚动条？这样做不会影响性能。

5. 使用 QStackedWidget, addWidget()将所有“页面”添加到它，然后根据需要调用 setCurrentIndex/Widget() 来切换页面。

想法：
看来您非常致力于克隆 Google 图像搜索的外观、感觉和行为，这很好，但 Google 图像搜索是一个 Web 应用程序，它使用的交互范例与普通桌面应用程序（链接、页面、 ETC）。您可能正在开发一个桌面应用程序，并且通过尝试模拟 Web 应用程序的行为，您会发现它很困难，因为 API 并不是为支持此类交互而设计的。无论如何，这是可行的，但你的工作将会为你做好。

如果您非常想坚持基于 Web 的交互风格，为什么不用 javascript 和 HTML 编写您的应用程序并将其放入 QWebView？

1/2.
For displaying the images and labels use a QListWidget with view mode set to QListView::IconMode. However, if you need to customize the display beyond what the QListWidget/QListWidgetItem api can provide you will need to create your own QAbstractListModel and use a standard QListView with it.
Make sure and read Qt's primer on model/view.

As for spacing the images, checkout the spacing property on the list view.

Here is an example from KDE's Dolphin file manager:
Dolphin's icon mode

3. Use a regular QLabel, but set the contents to be an href.

Example:

edit: Oops I see from your tags you are using PyQt, the following is C++, but should be similar to what you would do in python.

  QLabel *linkLabel = new QLabel;
  linkLabel->setTextFormat( Qt::RichText )
  linkLabel->setText( "<a href=\"someurl\"> Click me! </a>" );
  connect( linkLabel, SIGNAL( linkActivated ( const QString & link ) ), .... )

4.
Well, since you are using a Model/View, why bother having page numbers at all? The user will just be able to scroll the view and more pictures will be shown. This is by far the easiest solution as you don't have to do anything once you've got your M/V setup!

However, if you really want to show page numbers it will require more work in your model. For example, have a track the "current page" in the model and only allow access to images on the "current page". Then in your slot connected to the linkActivated() signal tell the model to change pages. I won't go into much more detail as this seriously violates the whole idea behind model/view. The "right way" of doing this would be to subclass QListView and add pagination support, but like I said why not use scroll bars? There isn't any performance hits to doing so.

5. Use a QStackedWidget, addWidget() all your "pages" to it, then call setCurrentIndex/Widget() as needed to switch the pages.

Thoughts:
It seems you are very committed to cloning the look, feel, and behavior of Google Image search, which is fine, but Google Image Search is a web application that uses interaction paradigms that are very different than a normal desktop application (links, pages, etc). You are presumably developing a desktop application, and by trying to emulate the behavior of a web app you will find it difficult as the API just isn't designed to support those sorts of interactions. By all means, it is doable, but you'll have your work cut out for you.

If you are extremely intent on sticking to the web based interaction style, why not code your app in javascript and HTML and toss it in a QWebView?

回复收藏 0 原文