پروژه‌ای که می‌خواهیم شروع کنیم یک ماشین حساب ساده است که چهار عمل اصلی را انجام می‌دهد برای این کار پروژه جدیدی را توسط qtcreator ایجاد می‌کنیم.
کاری به محتوای فایل‌های ایجاد شده در موقع ایجاد پروژه نداریم و محتویات فایل main.qml آن را پاک می‌کنیم و از ابتدا شروع به ایجاد کنترل‌های این ماشین حساب در محتوای این فایل می‌کنیم. برای این کار نیاز داریم که یک کنترل مستطیل را به عنوان فرم استفاده کنیم (در واقع می‌خواهیم متفاوت از پروژه قبل فرم را بسازیم تا با روش‌های مختلف کار کرده باشیم؛ اگر خاطرتان باشد در جلسه قبل برای ساختن فرم از کنترل Window استفاده کردیم اما در این جلسه می‌خواهیم از کنترل Rectangle برای این منظور استفاده کنیم).
یک کنترل مستطیل با پس زمینه تیره را ایجاد می‌کنیم:

import QtQuick 2.5
Rectangle {
    id: window
    width: 320
    height: 480
    focus: true
    color: "#272822"
}

همان‌طور که می‌دانید کنترل مستطیل در کتابخانه QtQuick وجود دارد پس باید آن را به پروژه import کنیم. شناسه آن را توسط id تعیین می‌کنیم (در اینجا window، از این به بعد برای شناسایی فرم از شناسه آن استفاده می‌کنیم.) و عرض و ارتفاع آن را نیز توسط width و height تعیین می‌کنیم. خصوصیت focus را برای این مقدار true داده‌ایم که اگر ورودی از سمت صفحه‌کلید وارد شد به کنترل window ارجاع شود (برای اینکه هم با ماوس بتوان اعداد را وارد کرد و هم با صفحه کلید). خصوصیت color نیز برای تعیین رنگ پس زمینه است که می‌توانید کد رنگ دلخواه‌تان را به آن بدهید (کد رنگ داده شده در کد بالا رنگی تیره را به ما می‌دهد). خب تا اینجای کار را می‌توانید با رفتن به حالت design مشاهده کنید.
در جلسه گذشته تمامی کنترل‌های فرم را در یک فایل نوشتیم و اجرا کردیم در این جلسه می‌خواهیم چندین فایل را برای ایجاد فرم به کار بریم. هر فایل برای قسمتی از فرم به کار می‌رود. مثلاً برای ایجاد صفحه‌کلید ماشین حساب از یک فایل دیگر به اسم NumberPad.qml استفاده می‌کنیم. برای افزودن فایل جدید بر روی resources  و روی فایل qml.qrc کلیک راست کرده و add new را انتخاب کنید سپس در قرم باز شده qml file را انتخاب کنید (مانند شکل زیر).

پس از انتخاب مطابق شکل بالا نام فایل را NumberPad بگذارید و تا آخر ادامه دهید تا به پروژه شما افزوده شود. برای صفحه‌کلید نیاز داریم که چندین کلید در هر ردیف سه کلید قرار گیرد و برای ترتیب دادن آن‌ها از کنترل Grid استفاده می‌کنیم که به واسطه آن می‌توان کلیدها را مرتب ایجاد کرد. به کد زیر دقت کنید:

import QtQuick 2.0
Grid {
    columns: 3
    columnSpacing: 32
    rowSpacing: 16
}

> حال می‌خواهیم کلیدها را بسازیم تا درون NumberPad از آن‌ها استفاده کنیم. کلیدهایی
درون بدنه window کنترلی از نوع Item ایجاد می‌کنیم، این کنترل کنترلی است که تمامی کنترل‌های گرافیکی qml از آن ارث برده‌اند  اما Item به خودی خود هیچ نمای گرافیکی ندارد و تنها برای این استفاده می‌شود که خصوصیات کلی کنترل‌های گرافیکی از جمله مقدار x و y و width و height و غیره را دارد و همچنین برای کنترل کردن ورودی‌های مختلف از جمله صفحه‌کلید می‌توان از آن بهره برد.
ابتدا فایل Button.qml را می‌سازیم. سپس در کنترل Item خصوصیاتی را که می‌خواهیم برای آن تنظیم می‌کنیم.

  import QtQuick 2.0
  Item {
      id: button
      width: 30
      height: 50
      Text {
          id: textItem
          font.pixelSize: 48
          wrapMode: Text.WordWrap
          lineHeight: 0.75
      }
  }
  

> و برای آن یک کنترل Text هم قرار می‌دهیم تا بتوانیم بر روی دکمه خود نوشته‌ای داشته باشیم. خصوصیات نوشته روی دکمه را از جمله اندازه فونت، ارتفاع خط و در صورت بزرگ بودن متن و جا نشدن آن در عرض دکمه با Text.WordWrap تعیین می‌کنیم که متن را به دو یا بیشتر خط بشکند.
با ما همراه باشید تا ماشین حساب را تکمیل کنیم.

• جلسه اول
• جلسه دوم
• جلسه سوم
• جلسه چهارم