Setting up a new project

First, create a new Qt Widgets Application project.

Then, the first thing we need to do is to open up the project file (.pro) and add two keywords—multimedia and multimediawidgets:

QT += core gui multimedia multimediawidgets

By detecting these keywords in the project file, Qt will include the multimedia module and all the widgets that are related to multimedia into your project when it compiles. The multimedia module includes four major components which are listed as follows:

  • Audio
  • Video
  • Camera
  • Radio

Each component includes a range of classes that provide respective functionality. By using this module, you no longer have to implement low-level, platform-specific code yourself. Let Qt do the job for you. It's really that easy.

After you have finished adding the multimedia module, let's open mainwindow.ui and drag and drop a Horizontal Layout on to the main window, shown as follows:

Then, add a Label, Combo Box (name it deviceSelection), and a Push Button into the Horizontal Layout we just added in the previous step. After that, add a Horizontal Spacer between the combo box and a push button to push them apart from each other. Once you're done, select the central widget and click on the Layout Vertically button located above the workspace.

Then, add another Horizontal Layout to the bottom of the previous horizontal layout and right-click on it and select Morph into | QFrame. After that, set its sizePolicy (Horizontal Policy and Vertical Policy) settings to Expanding. Refer the following screenshot:

Your program's user interface should look something like this by now:

The reason we convert the layout to a frame is so that we can set the sizePolicy (both Horizontal policy and Vertical policy) to Expanding. However, if we just add a Frame widget (which is essentially a QFrame) from the widget box, we don't get the layout component on it which is needed for attaching the viewfinder later.

Next, right click on the QFrame again and select Change styleSheet. A window will pop up for setting the style sheet of that widget. Add the following style sheet code to make the background black:

This step is optional; we made its background black just to indicate the viewfinder's location. Once this is done, let's put another Horizontal Layout above the QFrame, such as the following:

After that, add two Push Buttons to the Horizontal Layout and a Horizontal Spacer to keep them aligned to the right:

That's it; we have finished setting up our project with the multimedia module and laid out the user interface nicely for our next sections.