Book Image

Qt5 C++ GUI Programming Cookbook

By : Lee Zhi Eng
Book Image

Qt5 C++ GUI Programming Cookbook

By: Lee Zhi Eng

Overview of this book

With the advancement of computer technology, the software market is exploding with tons of software choices for the user, making their expectations higher in terms of functionality and the look and feel of the application. Therefore, improving the visual quality of your application is vital in order to overcome the market competition and stand out from the crowd. This book will teach you how to develop functional and appealing software using Qt5 through multiple projects that are interesting and fun. This book covers a variety of topics such as look-and-feel customization, GUI animation, graphics rendering, implementing Google Maps, and more. You will learn tons of useful information, and enjoy the process of working on the creative projects provided in this book
Table of Contents (16 chapters)
Qt5 C++ GUI Programming Cookbook
Credits
About the Author
About the Reviewer
www.PacktPub.com
Preface
Index

Displaying information using Model View


Qt includes a Model View framework that maintains separation between the way data is organized and managed, and the way that it is presented to the user. In this section, we will learn how to make use of the model view, in particular by using the list view to display information and at the same time apply our own customization to make it look slick.

How to do it…

  1. Create a new Qt Quick application project and open up qml.qrc with Qt Creator. Add six images, home.png, map.png, profile.png, search.png, settings.png, and arrow.png, to the project:

  2. After that, open up MainForm.ui.qml. Delete all the default widgets on the canvas and drag a List View widget from under the Qt Quick - Views category in the Library window onto the canvas. Then, set its Anchors setting to Fill the parent size by clicking on the button located in the middle of the Layout window:

  3. Next, switch over to the Script Editor, as we will define what the list view will look like:

  4. After that...