آموزش برنامه‌نویسی با کیوت / سی‌+‌+ (جلسه چهارم)

در جلسه سوم این مقالات آموزش به آموزش و نحوه استفاده از سی‌میک برای مدیریت و ساخت پروژه‌های سی++  و کیوت اشاره کردیم که تمامی این مراحل را در نرم‌افزار محیط توسعه کیوت انجام دادیم. علاوه بر اینکه به بیان برخی مفاهیم و برخی دستورات موجود در کیوت مانند کیو‌-دیباگ و جریان متن در کیوت نیز اشاراتی داشته و توانستیم آنان را در عمل نیز امتحان کنیم. اگر پیگیر این آموزش هستید در قسمت قبلی پروژهٰ تقریبا خوبی را با هم نوشتیم که می‌توانست محیط مستطیل را با استفاده از مفهوم کلاس و ظاهری گرافیکی محاسبه و در خروجی که یک برچسب بود؛ برای ما نمایش دهد.

دراین قسمت قصد دارم تا کمی به مسائل پیشرفته‌تر رفته و برنامه بزرگتری را ایجاد کنیم. در این جلسه قرار است که ویرایشگر ساده‌ای را همانند نرم‌افزار ساده ویرایشگر متن نوت‌پد «Notepad» ویندوز بنویسیم که از امکانات نسبتا کمی برخوردار است و فقط برای ویرایش پرونده‌های متنی ساده کاربرد خواهد داشت. این برنامه از یک پنجره تشکیل شده‌است که در بالای آن نوار عنوان و نوار ابزار قرار دارند و در پایین نیز یک نوار وضعیت ساده قرار گرفته است. در این برنامه تنها ما قادر به این خواهیم بود که پرونده مورد نظر را با استفاده از منوها و از طریق منوی گشودن «Open» باز کرده و با استفاده از گزینه ذخیره «Save» آن پرونده را ذخیره کنیم.

دیگر گزینه‌های را تا چند جلسه بعدی به ترتیب و فراخور وقتی که نیاز است؛ بررسی خواهیم کرد و یک ویرایشگر کامل متنی و ساده را با استفاده از کیوت خواهیم نوشت. این نرم‌افزار بعد از اتمام می‌تواند جایگزین خوبی برای نرم‌افزارهای ویرایشگر ساده متنی مانند لیف‌پد «Leafpad» باشد؛ با این تفاوت که این نرم‌افزار بر خلاف آن نرم‌افزارها توسط کیوت نوشته شده است و علاوه بر برخی امکانات قادر خواهید بود با کشیدن و رها کردن پروندهٰ متنی آن را در نرم‌افزار مشاهده کنید.

نرم‌افزاری که در چند جلسه قرار است آن را کامل کنیم؛ از امکانات متنوعی برخوردار است که تقریبا در هر ویرایشگر متنی خواهید دید. این ویرایشگر متنی را در چند جلسه و گام به گام خواهیم نوشت تا در آخر یک ویرایشگر ساده و متن‌باز با استفاده از کیوت نوشته و در اختیار دیگران قرار دهیم. امکانات این نرم‌افزار شامل امکانات گشودن تا ذخیره و چاپ پرونده متنی خواهد بود. به همراه تنظیمات قلم ویرایشگر و دیگر تنظیمات اضافی برای نمایش بهتر متون.  منوی نرم‌افزار در آخر دارای گزینه‌های زیر خواهد بود.

  • منوی پرونده «File» برای کار بر روی فایل
  • منوی ویرایش «Edit» برای برخی نکات ویرایشی ساده در یک متن ساده
  • منوی تنظیمات «Options» برای دسترسی به برخی تنظیمات
  • منوی جست‌وجو «Search» برای جست‌وجو و جایگزینی و …
  • منوی راهنما «Help» برای راهنما، درباره ما … درباره کیوت و …
شروع ساخت پروژه

برای ساخت پروژه ما از گزینهٰ پروژهٰ جدید که در محیط توسعه کیوت هم از نوار منو و هم از صفحه آغازین قابل دسترسی استفاده می‌کنیم. سپس در کادر و پنجره باز شده برای ساخت پروژهٰ جدید، پروژهً سی++ خالص را از بخش غیر کیوت «Non Qt-Projects» انتخاب کرده و در قسمت انتخاب سامانه ساخت گزینه سی-میک «CMake» را انتخاب می‌کنیم. بعد از این دیگر روال کار مثل جلسه قبل است؛ این تغییرات در نسخه جدید اعمال شده است و ساخت پروژه به وسیله سی-میک در نسخه جدید محیط توسعه کیوت با تغییراتی مواجه شده است.

qt-tut-01پرونده متنی تنظیمات پروژه را که با نام «CMakeLists.txt» در شاخهٰ پروژه ساخته شده است توسط محیط توسعه رومیزی کیوت و همانند جلسه قبل گشوده و مقادیر زیر را در داخل آن بنویسید.  نام پروژهٰ ما کیوت‌پد «CutePad» است که شما فراخور نظر و دلخواه خود می‌توانید نامی را برای آن انتخاب کنید. با این وجود پیشنهاد این است با همین نام پروژهٰ خود را بسازید.

سپس با استفاده از دستور تاچ «Touch»  در خط فرمان در شاخه پروژهٰ ایجاد شده؛ پرونده‌ها و دو مسیر منبع «source» و سرآیند «header»  را نیز ایجاد کنید.  در این پوشه‌ها، پرونده‌های سرآیند و منبع را به صورت جداگانه ذخیره و نگاهداری خواهیم کرد. برای دسترسی به آنان نیز باید به نام پوشهٰ آنان اشاره داشته باشیم. با این وجود تنظیمات پروژه را به شکلی نوشته‌ام که دیگر نیازی به نوشتن پوشه برای وارد کردن «Include» یک سرآیند وجود نخواهد داشت.

شروع بخش کد‌نویسی

برای این بخش ما از چندین پرونده متنی که کدها در آنان قرار خواهد گرفت؛ استفاده خواهیم کرد. در این نرم‌افزار از چندین پرونده سرآیند و منبع استفاده می‌کنیم که همان‌طور که اشاره شد و برای دسترسی راحت‌تر به پرونده‌ها، آنان را به صورت جداگانه در پوشه‌هایی ذخیره کردیم. اولین پرونده سی++ که برای ذخیره کدهای اصلی نرم‌افزار جهت تعریف نرم‌افزار و دریافت ورودی از کاربر در زمان اجرای نرم‌افزار نوشته‌ایم؛ پرونده اصلی «main.cpp» نام خواهد داشت که بهتر است آن را در پوشه ریشه پروژه ذخیره کنیم و مابقی پرونده‌های سی++ را در آن پوشه‌های ذخیره کنیم. پرونده سی++ را باز کرده و در آن کدهای زیر را وارد کنید.

در کدهای نوشته شده بالا در ابتدا ما برخی کتابخانه‌های مورد نیاز برای پروژهٰ خود و این بخش را وارد و شامل کدها کرده‌ایم. در این بخش در قسمت تعریف تابع اصلی دو مولفه  را برای مولفه‌هایی که در هنگام اجرای برنامه و بعد از نام برنامه نوشته می‌شوند؛ در نظر می گیریم تا با نسبت دادن این دو مقدار به کلاس «QApplication» بعدا توسط «qApp» عبارت این مولفه‌ها دسترسی داشته باشیم. در خطوط بعدی نیز همانطور که ذکر شد کلاس اصلی «QApplication» که برای اجرای برنامه الزامی است تعریف کرده و  شیءی را از کلاس پنجرهٰ اصلی «MainWin» منشعب می‌کنیم که خود این کلاس قرار است از کلاس دیگری که در کیوت موجود است منشعب شود. این کلاس کیو-مین‌ویندو «QMainWindow» نام داشته و برای ساخت پنجره اصلی یک نرم‌افزار کاربردی، به کار می‌رود. بعد از آن پنجره مورد اشاره نمایش داده می‌شود و در خروجی دستور  زیر را به خروجی تابع اصلی بر می‌گرداند.

حال بیایید برای شروع کار اسکلت و پایه پنجره و فرم اصلی برنامه را پایه ریزی کنیم. برای این کار مانند جلسه قبلی یک کلاس تعریف می‌کنیم که از کلاس مورد نظر ما منشعب شده باشد. کلاس مورد نظر ما برای اینکه کلاس از آن منشعب شود؛ کلاس «QMAinWindow» نام دارد. این کلاس همان‌طور که ذکر شد جهت استفاده به عنوان فرم و پنجره اصلی در یک نرم‌افزار کاربردی در کیوت استفاده می‌شود.  ابتدا دو پرونده «main_win.cpp» و «main_win.h» را ایجاد می‌کنیم؛ پرونده‌ها را با دستورات زیر در خط فرمان در پوشه پروژه بسازید که در این‌جا مسیر آن به احتمال زیاد متفاوت است.

سپس وارد نرم‌افزار و محیط توسعه کیوت شوید و دو پرونده منبع و سرآیند در پوشه‌های سرآیند و منبع، قابل مشاهده خواهند بود. اگر پرونده و پوشه‌ها قابل مشاهده نشدند؛ یک بار دیگر پروژه را اجرا نمایید؛ تا این پوشه و پرونده‌ها نمایان شوند. روی پرونده منبع «main_win.cpp» کلیک کنید و در ویرایشگر کیوت باز شده برای نوشتن کدها، کدها و دستورات زیر را وارد کنید.

همانطور که در کدهای بالا قابل مشاهده است؛ کلاس پنجره را تعریف کرده‌ایم و در تابع سازنده کلاس برخی مشخصات را برای پنجره تعریف کرده‌ایم. به عنوان مثال نقشک برنامه را طبق نقشک‌های استانداردی که در پایگاه اینترنتی میزکار آزاد «Free Desktop»  وجود داد؛ مشخص کرده‌ایم که نقشک یک ویرایشگر متنی را بر اساس نوع قالب و سبک نقشک مورد استفاده شما، تعیین کرده است. اندازه پنجره در حالت اولیه و کمینه را نیز تعیین کردم که مقدار مناسبی برای یک ویرایشگر متنی است. با این حال پنجره‌ای که ساخته خواهد شد پنجره ساده‌ای است که هنوز برای تبدیل شدن به نرم‌افزار دلخواه ما جای کار بسیاری دارد. همچنین برای عنوان برنامه فعلا از نام نرم‌افزار از طریق کیو-اَپ «qApp» استفاده کرده‌ایم که بعدا با ترکیب نام برنامه و پرونده گشوده شده، نوار عنوان بهتر خواهد شد.

پرونده سرآیند برای این کلاس نیز باید نوشته شود؛ برای آنکه پرونده سرآیند را بگشاییم بر روی آن کلیک می‌کنیم و محتویات آن در داخل ویرایشگر کد در محیط توسعه کیوت گشوده خواهد شد. سپس آن را با مقادیر زیر پر می‌کنیم.

در سرآیند چند شیء برای چند «QAction» تعریف کرده ایم تا بعدا برای منوها و نوار ابزار استفاده کنیم. در کیوت برای آنکه یک منو یا نوار ابزار بتواند کدی را اجرا کند؛ می‌توان از یک «QAction» استفاده کرد؛ ابتدا آنان را ایجاد می‌کنیم و به منوها و نوار ابزار نسبت می‌دهیم. برای هر «QAction» می‌توان نقشک و پیغام معلق «ToolTip» را نیز مشخص کرد یا اینکه یک کلید میانبر برای آن در نظر گرفت. با این حال فعلا این کدها کامل نیست و جلو تر به این موارد خواهیم پرداخت.

حال که کد بالا را در پروندهٰ بالا نوشته و ذخیره کردید؛ بر روی نقشک سبز رنگ کوچک و مثلث شکل سمت راست و پایین نرم‌افزار محیط توسعه کیوت کلیک کنید تا بتوانید نرم‌افزار را کامپایل و مشاهده کنید.

نوشتن برخی کد‌های اصلی نرم‌افزار

دو پرونده متنی با نام‌های «actions.cpp» و «actions.h» در دو پوشه سرآیند و منبع ایجاد کنید.  سپس دو پرونده متنی دیگر  را نیز با با نام‌های «main_meu.cpp» و «main_menu.h» در پوشه‌های سرآیند و منبع ایجاد کنید. حال که چهار پروندهٰ بالا را ساختید نام دو پرونده کد سرآیند و منبع کلاس منوی اصلی را نیز به صورت زیر به دیگر پرونده‌های موجود در تنظیمات سی-میک اضافه کنید.

در این کلاس ما کار خاصی انجام نخواهیم داد؛ تنها این دو کلاس را از کلاس منو منشعب می‌کنیم تا شاید در آینده آن را سفارشی کردیم.

پرونده سرآیند:

پرونده منبع:

حال دستورات زیر را وارد منبع کلاس پنجره اصلی که «main_win.cpp» دارد کرده و کدهای سابق را با کدهای زیر جایگزین می‌کنیم.

در خود کلاس «QMainWindow» نوار منو وجود دارد و با نام «menuBar» قابل دسترسی است. در واقع کلاس «QMainWindow» را می‌توان انشعابی از کلاس «QWidget» دانست که برخی گزنه‌ها به آن افزوده شده است. اگر ما نیز بخواهیم کلاسی را با تغییراتی مورد استفاده قرار دهیم؛ باید همانند کلاس «MainMenu» که ساختیم کلاسی را از کلاس دیگر منشعب کرده و سپس تغییرات را بر روی تغییرات کلاس مورد نظر نظر اعمال می‌کنیم تا به جای توابع و ساختار کلاس قدیمی، ساختار کلاس منشعب شده استفاده شود.

حال اگر بعد از نوشتن دستورات بالا، بر روی نقشک اجرا کلیک کنیم؛ نرم‌افزار اجرا شده و پنجره‌ای با یک منو و سه زیر منو با گزینه‌های جدید، گشودن و ذخیره ایجاد شده است که فعلا برای کار ما کافی هستند. تا در آینده گزینه‌ای بیشتری را مورد بررسی قرار دهیم. پس تا چند جلسه آینده صرفاً مشغول تکمیل این پروژه خواهیم شد و شاید بعد از چند جلسه بتوانیم یک ویرایشگر کامل بنویسیم به شکلی که برخی افراد از آن به عنوان ویرایشگر ساده استفاده کنند. در کد بالا از یک ویرایشگر متن خاص و ساده نیز استفاده شده است که در کیوت با نام «QPlainTextEdit» یک شیء بسیار کاربردی برای ویرایش متون ساده ولی بلند است. مثلا اگر بخواهیم متون بلند را ویرایش کنیم گزینه‌های خوبی را در خود دارد. اگر از این شیء استفاده شود دیگر نیازی به نوشتن کدهای مربوط به ایجاد منو برای راست کلیک موشی نخواهیم داشت.

ظاهر برنامه بعد از اجرا در زیر مشخص است. این برنامه فعلا کاری نمی‌کند؛ فقط برخی عناصر در آن چیده شده اند.

qt-tut-02حال بیایید کمی کدهای نوشته شده را تشریح کنیم؛ افزودن کدهای منو‌ها و دیگر امکانات در جلسه بعدی رخ خواهد داد. در این جلسه به نحوه ساخت منو، انشعاب کلاس‌های دیگر و ایجاد ساختاری دیگر و پنجره‌ای به صورت اصلی پرداختیم. در این جلسه به معرفی نحوه جدا کردن پرونده‌های به پوشه‌های جداگانه پرداختیم و همچنین آموختیم چگونه یک اکشن «QAction» را در برنامه خود به کار برده و از آن استفاده کنیم.

در کدهای زیر یک شیء از کلاس ساخته شده و منشعب از کیو-منو ساختیم که برخی تغیرات نیز در آن اعمال کرده‌ایم. یعنی ابتدا عنوان منو را مشخص کردیم و سپس آن را به نوار منوی پنجره اصلی افزودیم.

در کدهای زیر نیز اکشن را تعریف و به منوی پرونده افزوده‌ایم؛ در این کد برخی مشخصات مانند نقشک و متن اکشن نیز به آن نسبت داده شده است. بعد از آن باید اکشن را به منو نسبت دهید و به آن بیفزایید تا در منو به عنوان زیر منو نمایش داده شود.

این کدها برای دو اکشن دیگر نیز به این صورت استفاده شده است. در آخر نیز با استفاده از کدهای زیر شیء ویرایشگر متن ساده را نیز به ویدجت وسط پنجره اصلی افزودیم. پنجره اصلی در کیوت شامل چند قسمت می‌شود. قسمت بالایی یا نوار منو که محل قرار گیری نوار منو است در بالاترین نقطه پنجره واقع است که دقیقا زیر نوار عنوان است.  سپس نوار ابزار در زیر نوار منو قرار دارد که این نوار نیز برای قرارگیری اکشن‌ها است؛ می‌توان اکشن‌های افزوده شده به منو را در این قسمت نیز افزود. سپس داک‌ها «Dock» در اطراف نرم افزار قابل درج هستند. مشابه نرم‌افزار دلفین که چندین داک و ابزار برای لیست پوشه‌ها یا اطلاعات یا خط فرمان توکار در نرم‌افزار و پنجره اصلی در اطراف قرار دارند.

در وسط نیز قسمت اصلی پنجره اصلی قرار دارد که «CenteralWidget» نام دارد. در این قسمت می‌توان یک پنجره ویدجت عادی یا حتی یک پنجره‌ای والد برای مدیریت اجرای پنجره‌های مختلف برای نمایش پنجره‌های فرزند قرار داد.  [مشابه نرم‌افزار ورد، فتوشاپ در سابق که در نان در یک پنجره والد چند پنجره فرزند قرار می‌گیرد؛ گفتنی است اخیراً از سربرگ استفاده می‌شود.] توسط کدهای نوشته شده ما شیء ویرایشگر متن ساده را به عنوان یک ویدجت به مرکز برنامه فرستاده‌ایم که می‌توانستیم حتی از شیء سفارشی خودمان استفاده کنیم. برای قرار دادن یک پنجره سفارشی می‌توان کلاسی ساخت و سپس کلاس بالا را از کلاس «QWidget» منشعب کرد؛ سپس با افزودن برخی کنترل‌ها و تغییرات دلخواه آن را در مرکز نرم‌افزار قرار دهیم.  در قسمت پایین نیز نوار وضعیت «Status» قرار خواهد گرفت.

برای قرار دادن نوار ابزار در نرم‌افزار کیوت-پد؛ باید کدهای قسمت سرآیند و منبع کلاس پنجره اصلی را گشوده و در آنان تغییرات جدیدی اعمال کنیم. پرونده سرآیند را گشوده و کدهای نوشته شده را برای تعریف نوار ابزار در زیر نوار منو و نوار عنوان، در آن وارد می‌کنیم.

حال کدهای پرونده سرآیند در پرونده کد سرآیند سی++ با نام  «main_win.h» باید مشابه با کدهای زیر شده باشند.

سپس باید نوار ابزار را به پنجره اصلی بافزاییم؛ دستوراتی که رد زیر نوشته شده است باعث تعریف نوار ابزار و تنظیمات آن خواهد شد. سپس با تعریف و تنظیم نوار ابزار آن را به پنجره اصلی می‌افزاییم.

کدهای داخل پرونده متنی منبع کلاس و پنجره اصلی یعنی پرونده «main_win.cpp» باید مشابه زیر شده باشند.  اگر مشابه نبود؛ همه کدها را پاک کرده و موارد زیر را کاملاً در پرونده سی++ مورد اشاره رونویسی و درج کنید.

در این قسمت نوار عنوان زیبایی را نیز به نرم‌افزار افزودیم. به این دلیل قدم به قدم پیش می‌رویم تا کدها برایتان دشوار نشود و بتوانید کدهای نوشته شده  را درک کنید. در قسمت بعدی به مسائل بیشتری خواهیم رسید و نرم‌افزار می‌تواند پرونده‌ای را گشوده و یا ذخیره کند. همچنین در قسمت بعدی دستی بر روی ظاهر برنامه کشیده و نوار وضعیت و شاید سر برگ‌ها را نیز به برنامه بافزایم.  در آخر امیدوارم بعد از این مجموعه آموزشی بتوانید نرم‌افزارهای خوبی را کیوت و سی++ بنویسید و آنان را نیز متن‌باز در اختیار دوستانتان قرار دهید. به عنوان نمونه نرم‌افزار کیوت-پد که مشغول نوشتن آن هستیم می‌تواند نرم‌افزار خوبی برای کاربران باشد. مشابه نرم‌افزار بالا، نرم‌افزار «Leafpad» مورد استفاده در میزکار اکس‌اف‌سی‌ای «XFCE» نیز امکانات این نرم‌افزار را نخواهد داشت؛ شاید در آینده با استفاده از برخی عناصر و کدها این ویرایشگر را غنای یشتری بخشیده و آن را در گیت‌هاب برای دسترسی همه افراد نیز قرار دهیم.  در آخر این جلسه به پایان رسیده و تا اینجای کار نرم‌افزار ما این شکلی شده است.

qt-tut-03کدهای این قسمت را با استفاده از گیت به گیت‌هاب قابل دسترسی از  این پیوند فرستاده‌ام که می‌توانید با دستور زیر آنان را دریافت کنید. در آخر هر جلسه از بررسی این تمرین، این پروژه و کدهای آن به روز شده و طبیعتا با پوش «Push» کردن ساده‌ای، در گیت‌هاب نیز به روز خواهد شد. برای راحتی کار و استفاده از گیت، پیشنهاد می‌کنم که از ابزار گیت-آی «GitEye» استفاده کنید.

نظر شما چیست؟ آیا گیت‌هاب برای قرار دادن مثال‌ها و کدها نسبت به قبل و بارگیری توسط گوگل درایو گزینه بهتری است؟ با این وجود که گیت‌هاب بهترین گزینه برای استفاده برای مشارکت در یک پروژهٰم متن‌باز نیز به حساب می‌آید.

Shortlink:

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *