Results 1 to 11 of 11

Thread: How can i have a QFileDialog with a preview of the picture?

  1. #1
    Join Date
    Aug 2010
    Posts
    107
    Thanks
    1
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default How can i have a QFileDialog with a preview of the picture?

    I have this QFileDialog

    Qt Code:
    1. path = QFileDialog::getOpenFileNames(this, tr("Files"), QDir::currentPath(), tr("*.jpg *.png"));
    To copy to clipboard, switch view to plain text mode 

    But i want the QFileDialog to have also the option when you select a picture a preview of the picture on the right to been shown. How can i do this?

  2. #2
    Join Date
    Dec 2007
    Posts
    27
    Thanks
    1
    Thanked 4 Times in 3 Posts
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Re: How can i have a QFileDialog with a preview of the picture?

    Unfortunately the QFileDialog does not have an interface to add your own widgets (ex. for a preview).

    You can set your own QAbstractItemDelegate to render the items in the list with a preview.

    I am not shure, if it is possible to add widgets to a Qt dialog by using the findChild<T> methods from QObject? That would worth a try.
    The code may look something like this
    Qt Code:
    1. filedialog->findChild<QGridLayout*>("name of layout")->addWidget(my_preview); // print the objectnames of all child objects to find out the name of the layout
    To copy to clipboard, switch view to plain text mode 

  3. #3
    Join Date
    Jul 2010
    Location
    /home/hakermania/
    Posts
    233
    Thanks
    129
    Thanked 3 Times in 3 Posts
    Qt products
    Qt4
    Platforms
    Unix/X11

    Default Re: How can i have a QFileDialog with a preview of the picture?

    I think Bong means how to have a picture preview on the QFileDialog before you choose "Open"

  4. #4
    Join Date
    Aug 2010
    Posts
    107
    Thanks
    1
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Re: How can i have a QFileDialog with a preview of the picture?

    Yes that's exactly what i mean

  5. #5
    Join Date
    Dec 2009
    Posts
    128
    Thanks
    7
    Thanked 14 Times in 14 Posts
    Platforms
    Unix/X11 Windows

    Default Re: How can i have a QFileDialog with a preview of the picture?

    I did this for a project.
    In my case I implemented a new QDialog class, basically with a FileSystem browser and a view part (coupled with a thread mecanism to be reactive on preview)
    I don't think such a dialog is done straight-forward, at least for me. So you will probably have to make some dev.

    I attached the final dialog I obtained, to give you an example of layout

    levelflow.jpg


    Edit : the preview is based on the PictureFlow widget (i did not make it!)
    http://code.google.com/p/pictureflow/
    http://qt-apps.org/content/show.php/...?content=75348
    Last edited by totem; 25th August 2010 at 14:04. Reason: add credits

  6. #6
    Join Date
    Dec 2007
    Posts
    27
    Thanks
    1
    Thanked 4 Times in 3 Posts
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Re: How can i have a QFileDialog with a preview of the picture?

    Quote Originally Posted by hakermania View Post
    I think Bong means how to have a picture preview on the QFileDialog before you choose "Open"
    Thats what I mean too
    I'll try to describe a way to add a preview widget to the QFileDialog without implementing a complete new dialog.

  7. #7
    Join Date
    Feb 2009
    Posts
    3
    Thanked 2 Times in 2 Posts
    Qt products
    Qt4
    Platforms
    Unix/X11

    Default Re: How can i have a QFileDialog with a preview of the picture?

    Hi, here is a PreviewFileDialog class (tested with Qt 4.8):

    preview_file_dialog.h:
    Qt Code:
    1. #ifndef PREVIEW_FILE_DIALOG_H
    2. #define PREVIEW_FILE_DIALOG_H
    3.  
    4. #include <QFileDialog>
    5.  
    6. class QLabel;
    7.  
    8. class PreviewFileDialog : public QFileDialog
    9. {
    10. Q_OBJECT
    11. public:
    12. explicit PreviewFileDialog(
    13. QWidget* parent = 0,
    14. const QString & caption = QString(),
    15. const QString & directory = QString(),
    16. const QString & filter = QString()
    17. );
    18.  
    19. protected slots:
    20. void OnCurrentChanged(const QString & path);
    21.  
    22. protected:
    23. QLabel* mpPreview;
    24.  
    25. };
    26.  
    27. #endif // PREVIEW_FILE_DIALOG_H
    To copy to clipboard, switch view to plain text mode 

    preview_file_dialog.cpp:
    Qt Code:
    1. #include "preview_file_dialog.h"
    2. #include <QLabel>
    3. #include <QGridLayout>
    4.  
    5. PreviewFileDialog::PreviewFileDialog(
    6. QWidget* parent,
    7. const QString & caption,
    8. const QString & directory,
    9. const QString & filter
    10. ) :
    11. QFileDialog(parent, caption, directory, filter)
    12. {
    13. setObjectName("PreviewFileDialog");
    14. QVBoxLayout* box = new QVBoxLayout(this);
    15.  
    16. mpPreview = new QLabel(tr("Preview"), this);
    17. mpPreview->setAlignment(Qt::AlignCenter);
    18. mpPreview->setObjectName("labelPreview");
    19. box->addWidget(mpPreview);
    20.  
    21. box->addStretch();
    22.  
    23. // add to QFileDialog layout
    24. {
    25. QGridLayout *layout = (QGridLayout*)this->layout();
    26. layout->addLayout(box, 1, 3, 3, 1);
    27. }
    28. connect(this, SIGNAL(currentChanged(const QString&)), this, SLOT(OnCurrentChanged(const QString&)));
    29. }
    30.  
    31. void PreviewFileDialog::OnCurrentChanged(const QString & path)
    32. {
    33. QPixmap pixmap = QPixmap(path);
    34. if (pixmap.isNull()) {
    35. mpPreview->setText("not an image");
    36. } else {
    37. mpPreview->setPixmap(pixmap.scaled(mpPreview->width(), mpPreview->height(), Qt::KeepAspectRatio, Qt::SmoothTransformation));
    38. }
    39. }
    To copy to clipboard, switch view to plain text mode 

    Usage:
    Qt Code:
    1. #include "preview_file_dialog.h"
    2. ...
    3. QFileDialog* mpOpenDialog = new PreviewFileDialog(this, "Open artwork", "", tr("Image Files (*.png *.jpg *.bmp *.tif);;"));
    4. mpOpenDialog->setAcceptMode(QFileDialog::AcceptOpen);
    5. mpOpenDialog->exec();
    To copy to clipboard, switch view to plain text mode 

  8. The following user says thank you to Michal Fapso for this useful post:

    hispeedsurfer (18th December 2014)

  9. #8
    Join Date
    Feb 2009
    Posts
    3
    Thanked 2 Times in 2 Posts
    Qt products
    Qt4
    Platforms
    Unix/X11

    Default Re: How can i have a QFileDialog with a preview of the picture?

    Sorry, in the PreviewFileDialog constructor, you have to change this line:
    Qt Code:
    1. QVBoxLayout* box = new QVBoxLayout(this);
    To copy to clipboard, switch view to plain text mode 
    to this:
    Qt Code:
    1. QVBoxLayout* box = new QVBoxLayout();
    To copy to clipboard, switch view to plain text mode 
    ...because the PreviewFileDialog widget can be a parent only of one top level layout, which is already there.

  10. #9
    Join Date
    Dec 2014
    Location
    Holland
    Posts
    4
    Thanks
    1
    Qt products
    Qt4 Qt5
    Platforms
    Unix/X11 Windows

    Default Re: How can i have a QFileDialog with a preview of the picture?

    I found this solution when I am searching for a FileDialog with preview of imagefiles.
    I try to implement this in my code and the application is working, but I get a warning in the Application Output tab of Qt Creator:
    QLayout: Cannot add layout QVBoxLayout/ to itself
    When I change the line in the constructor to:
    Qt Code:
    1. QVBoxLayout* box = new QVBoxLayout();
    To copy to clipboard, switch view to plain text mode 
    my application crashes immediately, so I don' t understand what happens.

  11. #10
    Join Date
    Sep 2016
    Posts
    1
    Qt products
    Qt5
    Platforms
    Unix/X11 Windows

    Default Re: How can i have a QFileDialog with a preview of the picture?

    Hi, thank you for your code, it was a good help for me.
    The code worked on linux but I had the same problem as Martin72 on windows. It could be corrected to work on both.
    I used this post: http://stackoverflow.com/a/16991667/6317189 to correct Michal Fapso's code.

    Qt Code:
    1. PreviewFileDialog::PreviewFileDialog(
    2. QWidget* parent,
    3. const QString & caption,
    4. const QString & directory,
    5. const QString & filter
    6. ) :
    7. QFileDialog(parent, caption, directory, filter)
    8. {
    9. this->setOption(QFileDialog::DontUseNativeDialog,true);
    10. setObjectName("PreviewFileDialog");
    11. QVBoxLayout* box = new QVBoxLayout();
    12.  
    13. mpPreview = new QLabel(tr("Preview"), this);
    14. mpPreview->setAlignment(Qt::AlignCenter);
    15. mpPreview->setObjectName("labelPreview");
    16. mpPreview->setMinimumSize(512,512);
    17. box->addWidget(mpPreview);
    18. box->addStretch();
    19.  
    20. // add to QFileDialog layout
    21. QGridLayout *layout = static_cast<QGridLayout*>(this->layout());
    22.  
    23. QList< QPair<QLayoutItem*, QList<int> > > movedItems;
    24. for(int i = 0; i < layout->count(); i++)
    25. {
    26. int row, column, rowSpan, columnSpan;
    27. layout->getItemPosition(i,&row,&column,&rowSpan,&columnSpan);
    28. if (row > 2)
    29. {
    30. QList<int> list;
    31. list << row << column << rowSpan << columnSpan;
    32. movedItems << qMakePair(layout->takeAt(i),list);
    33. i--;
    34. }
    35. }
    36. for(int i = 0; i < movedItems.count(); i++)
    37. {
    38. layout->addItem(movedItems[i].first,
    39. movedItems[i].second[0],
    40. movedItems[i].second[1],
    41. movedItems[i].second[2],
    42. movedItems[i].second[3]
    43. );
    44. }
    45.  
    46. layout->addItem(box,1,3,1,1);
    47. connect(this, SIGNAL(currentChanged(const QString&)), this, SLOT(OnCurrentChanged(const QString&)));
    48. }
    To copy to clipboard, switch view to plain text mode 

  12. #11
    Join Date
    Jan 2008
    Location
    Alameda, CA, USA
    Posts
    5,230
    Thanks
    302
    Thanked 864 Times in 851 Posts
    Qt products
    Qt5
    Platforms
    Windows

    Default Re: How can i have a QFileDialog with a preview of the picture?

    QGridLayout *layout = static_cast<QGridLayout*>(this->layout());
    This assumes that the layout used in the QFileDialog actually is QGridLayout. You force the pointer to be QGridLaout * (because of the static cast), and then you use it inside the loop without checking to see if it actually -is- a pointer to QGridLayout and not null. That's a recipe for a crash if something ever changes in QFileDialog.

    Better is to use qobject_cast< QGridLayout * >, and then check that the return value is not null before blindly using the pointer. Using an "assert( layout != 0 )" will let you trap it while debugging so you can fix it. Using an "if ( layout != 0 )" conditional clause will prevent your app from crashing (although it won't work properly).
    <=== The Great Pumpkin says ===>
    Please use CODE tags when posting source code so it is more readable. Click "Go Advanced" and then the "#" icon to insert the tags. Paste your code between them.

Similar Threads

  1. Print preview for Qt activex
    By sowmya in forum Qt Programming
    Replies: 0
    Last Post: 19th July 2010, 11:53
  2. How to make a preview?
    By TomASS in forum Newbie
    Replies: 3
    Last Post: 20th February 2010, 19:41
  3. print preview
    By wbt_ph in forum Qt Programming
    Replies: 4
    Last Post: 1st August 2009, 07:41
  4. Qt 4.4 preview Webkit.
    By bunjee in forum Installation and Deployment
    Replies: 6
    Last Post: 7th May 2008, 10:51
  5. preview file dialog
    By mickey in forum Qt Programming
    Replies: 11
    Last Post: 22nd April 2006, 00:03

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Digia, Qt and their respective logos are trademarks of Digia Plc in Finland and/or other countries worldwide.