|
Home · All Namespaces · All Classes · Grouped Classes · Modules · Functions | |
Before content can be added to the list screen, the first thing to do is to create it in iviewer.
For every screen added, a function has to be created in the iviewer class for lazy creation.
File: iviewer.cpp
IViewer::IViewer(QWidget *parent, Qt::WFlags /*f*/)
: QStackedWidget(parent)
{
_listScreen = 0;
_imageScreen = 0;
setWindowTitle("Image Viewer");
}
Don't forget that the _listScreen member must be initialized with 0 in the constructor and added as private to the header file. Now calling the following function in the constructor will set the list screen as the current widget
File: iviewer.cpp
IViewer::IViewer(QWidget *parent, Qt::WFlags /*f*/)
: QStackedWidget(parent)
{
...
setCurrentWidget(listScreen());
...
}
For the content, the Qt Extended document system, which provides a very handy way to retrieve our content, should be used.
File: listscreen.cpp
void ListScreen::setupContent()
{
_cs = new QContentSet(QContentFilter::MimeType, "image/png", this);
_csm = new QContentSetModel(_cs, this);
}
The QContentSet represents a set of QContent defined over the mime type "image/png". The content model is a QAbstractListModel which could be set directly to the QListWidget, if the setModel(...) method were not private in QListWidget. This is done, because the QListWidget shall only be used with the QListWidgetItem class. The corresponding view class has to be used in order to use a model. See model-view programming.
Testing the View class To test, the QListWidget must be replaced with a QListView class everywhere and setModel(_csm) must be added to the ListScreen::setupContent() method. As long as some png files are present in the $HOME/Documents folder, it should show the list of files and their mime type icons. In an imageviewer, thumbnails should be shown rather than mimetype icons. The model will be tweaked later. For now, it is fine to just use the model as a list of Content objects, from which necessary information can be retrieved.
To populate the list, the list is first cleared and then filled with data from the content set items. For each content, a QListWidgetItem is created. The icon for the list item is set based on the content file information. The text of the item is taken from the content name. It provides the image name, without the extension.
void ListScreen::populate()
{
clear();
foreach (QContent c, _cs->items()) {
QListWidgetItem *i = new QListWidgetItem(this);
QIcon icon(c.file());
i->setText(c.name());
i->setIcon(icon);
}
if (count() > 0) {
QListWidgetItem *i = item(0);
setCurrentItem(i);
}
}
If at least one item populates the list, the first item is set as the current item. The list has a concept of current item and selected items. To ensure that the current item is also the selected item, the selection mode setSelectionMode(QAbstractItemView::SingleSelection) is set in a separate setupUi() method, which is called from the constructor. (See QAbstractItemView).
void ListScreen::setupUi()
{
setSelectionMode(QAbstractItemView::SingleSelection);
setIconSize(QSize(32,32));
connect(this, SIGNAL(activated(QModelIndex)),
this, SLOT(onImageActivated(QModelIndex)));
createActions();
createMenu();
}
Now it is time for another try. The application should be rebuilt and launched. All png files in the $HOME/Documents folder should appear in the list with a small icon in front. To make the icons larger, setIconSize(QSize(32,32));, in the setupUi() method, can be changed to provide icons with a different size.
The next part will handle some actions...
From the specification, the list screen shall contain several actions (see QAction). To add the actions, they first have to be created and then added to the menu (see QMenu). The first action will be "Open". This action needs to be connected to a slot, called "onOpenImage()", then the slot has to be added to the header file. It is necessary to add Q_OBJECT to the class for meta object creation.
File: listscreen.cpp
void ListScreen::createActions()
{
_openAction = new QAction("Open", this);
connect(_openAction, SIGNAL(triggered()), this, SLOT(onOpenImage()));
_renameAction = new QAction("Rename", this);
connect(_renameAction, SIGNAL(triggered()), this, SLOT(onRenameImage()));
_deleteAction = new QAction("Delete", this);
connect(_deleteAction, SIGNAL(triggered()), this, SLOT(onDeleteImage()));
_showInfoAction = new QAction("Show Info", this);
connect(_showInfoAction, SIGNAL(triggered()), this, SLOT(onShowInfo()));
}
In the create menu method, the menu for this screen is retrieved and the created actions are added to this menu. The menu will be the options menu on the screen whenever this screen or any child of this screen has focus. (See QSoftMenuBar).
File: listscreen.cpp
void ListScreen::createMenu()
{
QMenu* menu = QSoftMenuBar::menuFor(this);
menu->addAction(_openAction);
menu->addAction(_renameAction);
menu->addAction(_deleteAction);
menu->addAction(_showInfoAction);
QSoftMenuBar::setLabel(this, Qt::Key_Back, "", "Exit", QSoftMenuBar::AnyFocus);
}
In the openImage function, we want to open the image that is currently selected. Since there is a mapping between the content model and the list, the current row can be retrieved from the list and used to lookup the row from the model.
File: listscreen.cpp
void ListScreen::onOpenImage()
{
openImage(currentIndex().row());
}
Later, this will be the place where the image screen is opened and the image set.
The application already has a "Back" softkey, which will exit the application. The title of this soft key can be changed to "Exit" by adding the following line at the end of the createMenu() method.
QSoftMenuBar::setLabel(this, Qt::Key_Back, "", "Exit", QSoftMenuBar::AnyFocus);
In this list screen, it would be nice to open the image directly when the "Select" key (usually the center button on the direction pad) is pressed. There are two options here.
Both will be described.
In the setupUI method the following line is added:
connect(this, SIGNAL(activated(QModelIndex)),
this, SLOT(onImageActivated(QModelIndex)));
The signal is emitted, when the select button is pressed. It provides a model index. From the index, the row can be looked up again. So the onItemActivated(...) slot method is similar as the onOpenImage(...) method.
void ListScreen::onImageActivated(const QModelIndex& index)
{
openImage(currentIndex().row());
}
As seen previously, the keyPressed(QKeyEvent) method has to be override to handle the Qt::Key_Select key. The keyPressed method is defined in the QWidget class. There is also the partner method keyReleased. Both take a QKeyEvent as parameter.
void ListScreen::keyPressEvent(QKeyEvent* event)
{
switch (event->key()) {
case Qt::Key_Select:
onOpenImage();
break;
default:
QListWidget::keyPressEvent(event);
break;
}
}
It is important to forward the keyevent to the base class for the other keys, as the QListWidget needs them.
Now, the Image Viewer is a small application, which lists all png files from the content store. It shows the files in a list with their thumbnails. The image can also be identified when "open image" is selected from the menu or via the select key.
The next step will be the image screen creation. This Image Screen displays the selected image and comes back to the list screen.
| Copyright © 2009 Nokia | Trademarks | Qt Extended 4.4.3 |