‫‪Ruby/Qt tutorial‬‬

                                     ‫كدا انهينا ‪ RubyGnome‬و ‪ wxRuby‬نستكمل رحلتنا مع ‪Ruby/Qt‬‬
...
‫البرنامج الول‬




             ‫عرضلنا ويدجت عليها ‪ title‬مكتوب عليه ‪ !Hello, QtRuby‬وبمساحة 003 عرض و 002 ارتفاع‬

  ...
  
end
     ..‫ على الويدجت او الفورم الخ‬components ‫ دى هتكون الميثود المسئولة عن تجهيز ال‬init_comp ‫ال‬
              ...
‫عايزين ننشئ حاجة مشابهه لكدا‬




                                          ‫تمام ويدجت وعليه ‪ button‬مكتوب عليه ‪!Click...
‫ممكن يشمل ‪ Layouts‬اخرى وممكن يشمل فى نفس الوقت كنترولز )راجع جزئية ال ‪ RubyGnome‬‬
                                   ...
Vbox ‫ بيكون‬Main ‫ داخلية بس ال‬Layouts ‫ الرئيسى هو رأسى وبعمل جواه‬Layout ‫انا ديما بعتبر ان ال‬
                      ...
setLayout ‫ الساسى استخدم‬Layout ‫لتحديد ال‬

                                                     ‫طب لو افقى ؟ تقدر تطبق...
def init_comp
    setWindowTitle('Hello, World!')
    #resize(200, 300) #w, h
    setGeometry(300, 300, 250, 150) #x, y, w...
‫ هى إشارة بتتبعت من وإلى‬signal ‫ال‬
 ‫ هى ال هاندلر زى مابنقول او الميثود اللى هيتم تنفيذها حين وصول الشارة من اوبجكت مع...
  end

                                                                                   ‫لحظ السطر‬
  slots 'onBtnClickM...
    init_comp
  end
  
  def init_comp
    setWindowTitle('Click Me!')
    #resize(200, 300) #w, h
    setGeometry(300, 30...
    setLayout(vlay)

                                                                         ‫ بقة‬slot ‫تمام تعريف ال‬
 ...
‫‪Menus/ToolBars‬‬

 ‫تمام برامج كتير بتعرض وظايفها على صورة منيو واهم الوظايف فيها على صورة ‪ toolbar‬مثل اى‬
           ...
‫ وتولبار‬menu 2 ‫عندنا‬
                                                                             actions ‫اول خطوة ان...
    connect(newaction, SIGNAL("triggered()"), SLOT("onNew()"))

   ‫ المشيد الخاص بيه بياخد 3 معاملت الول عبارة عن اليكون‬...
    ebar=addToolBar("edit") #Toolbar for edit menu items..
    ebar.addAction(copyaction)
    ebar.addAction(cutaction)

 ...
    exitaction.setStatusTip("Exit..")
    connect(exitaction, SIGNAL('triggered()'), $qApp, SLOT('closeAllWindows()'))

  ...
‫‪end‬‬

                                                                                             ‫ال ‪Dialogs‬‬




 ...
‫السادس اكبر قيمة‬
                                                                                        ‫السابع مقدار ا...
‫السادس اكبر قيمة‬
                                                                                    ‫السابع مقدار الزيا...
‫التعامل من خلل روبى‬
    def setItem()
        items = []
        items << tr("Spring") << tr("Summer") << tr("Fall") << ...
Password: ‫إستبدال الحروف بنجوم‬


                                                                 LineEdit ‫: هو النص ال...
    def setColor()
        color = Qt::ColorDialog.getColor(Qt::Color.new(Qt::green), self)
        if color.isValid()
   ...
‫فى الواقع الميثود دى معرفة اكثر من مرة ‪ overloaded‬فإحنا هناخد دى‬
‫) 0 = ‪QFont getFont ( bool * ok, const QFont & init...
‫او تقدر تستخدمه كما ذكرنا بالعلى‬
    def setFont()
        ok = Qt::Boolean.new
        font = Qt::FontDialog.getFont(ok...
    def setExistingDirectory()
        directory = Qt::FileDialog.getExistingDirectory(self,
                             ...
    def setOpenFileName()
        fileName = Qt::FileDialog.getOpenFileName(self,
                                    tr("...
   def setOpenFileNames()
        files = Qt::FileDialog.getOpenFileNames(
                                    self, tr("Q...
‫كسابقاتها ولكنها للحفظ وليست لفتح ملف/ات‬
    def setSaveFileName()
        fileName = Qt::FileDialog.getSaveFileName(sel...
QMessageBox::NoIcon                                                                  0
QMessageBox::Question              ...
void aboutQt ( QWidget * parent, const QString & title = QString() )
                                                     ...
        Qt::MessageBox::information(self, tr("Qt::MessageBox.showInformation()"), @message)
        @informationLabel.text...
general, permissions, applications ‫ بإسم‬tabs 3 ‫هنا فى الصورة السابقة عندنا‬
             ‫ كل واحد فى ويدجت معين وتقدر ...
        @tabWidget.addTab(ApplicationsTab.new(fileInfo), tr("Applications"))
    
        okButton = Qt::PushButton.new(tr...
General Tab ‫تصميم ال‬




File Name ­> Label
fileNameEdit­> LineEdit
pathLabel­> Label
pathValueLabel ­> Label
sizeLabel­...
        lastReadValueLabel.frameStyle = Qt::Frame::Panel | Qt::Frame::Sunken
    
        lastModLabel = Qt::Label.new(tr(...
        readable = Qt::CheckBox.new(tr("Readable"))
        if fileInfo.readable?
            readable.checked = true
    ...
Applications Tab ‫تصميم ال‬




topLabel­> Label, text (Open with)
applicationsListBox ­> ListWidget, 30 Applications
alwa...
‫‪    end‬‬
‫‪end‬‬

                       ‫لحظ ان كل ال ‪ Tabs‬اخدت ‪ fileInfo‬فى المشيد الخاص بيها )راجع اول فقرة(‬

‫‪...
‫ مرصوص بصورة رأسية‬group box
class ConfigurationPage < Qt::Widget
    
    def initialize(parent = nil)
        super(par...
button ‫ مرصوصة رأسيا مع‬groupbox ‫تصميمها مباشر جدا‬
                           (‫ فى المثال‬gridlayout ‫ )هنشرح ال‬grid ...
            p.addWidget(dateLabel, 1, 0)
            p.addWidget(dateEdit, 1, 1)
            p.addWidget(releasesCheckBox,...
‫ مقدار الزيادة عند كل ضغطة‬singleStep ‫ال‬


                                                                        Grid...
query page ‫تصميم ال‬
                                                ‫ مرصوصين رأسيا‬button ‫ و‬groupbox 2 ‫هى عبارة عن‬
...
    
        packageGroup.layout = Qt::VBoxLayout.new do |p|
            p.addWidget(packageList)
        end
    
       ...
            s.addWidget(serverLabel)
            s.addWidget(serverCombo)
        end
    
        configGroup.layout = Qt...
        self.layout = Qt::VBoxLayout.new do |m|
            m.addWidget(updateGroup)
            m.addWidget(packageGroup)...
        self.layout = Qt::VBoxLayout.new do |m|
            m.addWidget(packagesGroup)
            m.addSpacing(12)
      ...
        buttonsLayout = Qt::HBoxLayout.new do |b|
            b.addStretch(1)
            b.addWidget(closeButton)
       ...
        @pagesWidget.currentIndex = @contentsWidget.row(current)
    end
end

                                            ...
#code omitted...
    end
            ListWidgetItem ‫ للمشيد الخاص ب‬List ‫ زى ماتعلمنا بإننا نباصي ال‬List ‫ فى الل‬Item ...
statusbar ‫ و‬text Edit ‫ بسيط فيه منيو وتولبار و‬Text Editor ‫هننشئ‬
                                                    ...
rbguiqt
rbguiqt
rbguiqt
rbguiqt
rbguiqt
rbguiqt
Upcoming SlideShare
Loading in...5
×

rbguiqt

379

Published on

Published in: Technology, Art & Photos
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
379
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "rbguiqt"

  1. 1. ‫‪Ruby/Qt tutorial‬‬ ‫كدا انهينا ‪ RubyGnome‬و ‪ wxRuby‬نستكمل رحلتنا مع ‪Ruby/Qt‬‬ ‫‪ Qt‬هى اداة تطوير تطبيقات ‪ toolkit‬كانت مملوكة لشركة ‪ trolltech‬حتى استحوذت عليها ‪Nokia‬‬ ‫من مميزاتها انها عابرة للنظم ‪Cross­Platform‬‬ ‫تنقسم ‪ Qt‬للعديد من الوحدات‬ ‫--اعجوبة 4‪pyqt‬‬ ‫الوحدة ‪ QtCore‬تحتوي الوظائف المركزية غير الرسومية. تستخدم هذه الوحدة في التعامل مع الوقت‬ ‫والملفات والدلة )المجلدات( وأنواع البيانات المختلفة والسيالت ‪ streams‬وروابط ‪ URL‬وأنواع الملفات‬ ‫‪ MIME‬والعمليات ‪.processes and threads‬‬ ‫الوحدة ‪ QtGui‬فتحتوي على المكونات الرسومية وما يتعلق يها من صنوف. وتشتمل على سبيل المثال‬ ‫على الزرار والنوافذ وأشرطة الدوات والحالة والزلقات والصور النقصية واللوان والخطوط …إلخ.‬ ‫الوحدة ‪ QtSVG‬بها الصنوف اللزمة لعرض محتويات ملفات ‪ .SVG‬وهي لغة وصفية للرسومات المتجهية‬ ‫ثنائية البعاد والتطبيقات الرسومية ب ‪XML‬‬ ‫الوحدة ‪ QtOpenGL‬تستخدم لتوليد رسومات ثلثة البعاد أو ثنائية باستخدام مكتبة ‪ .OpenGL‬مما يمكننا‬ ‫من دمج ‪ Qt‬مع ‪ OpenGL‬دون عناء.‬ ‫الوحدة ‪ QtNetwork‬تحتوي على الصنوف اللزمة لبرمجة الشبكات. هذه الصنوف تسمح بكتابة برامج‬ ‫خوادم ‪ severs‬أو مخدومات ‪ clients‬لبروتوكولت ‪ TCP/IP‬و ‪ .UDP‬مما يجعل برمجية الشبكات أسهل‬ ‫وقابل للنقل لمنصات أخرى.‬ ‫الصنوف في الوحدة ‪ QtXml‬للعمل على ملفات ‪ .xml‬هذه الوحدة تقدم تطبيق ل ‪ SAX‬و ‪.DOM‬‬ ‫الوحدة ‪ QtSql‬تقدم صنوف التعامل مع قواعد البيانات.‬ ‫--اخر القتباس‬
  2. 2. ‫البرنامج الول‬ ‫عرضلنا ويدجت عليها ‪ title‬مكتوب عليه ‪ !Hello, QtRuby‬وبمساحة 003 عرض و 002 ارتفاع‬ ‫1- ضيف ال 4‪ Qt‬لساحة العمل‬ ‫"4‪require "Qt‬‬ ‫2- انشئ ‪ application object‬ليعبر عن التطبيق )لحظ هو ‪ application‬واحد فقط الذى يتم انشائه(عن‬ ‫طريق‬ ‫‪Qt::Application.new‬‬ ‫كالتالى‬ ‫)‪app=Qt::Application.new(ARGV‬‬ ‫بيتم تجهيزه بال ‪ ARGV‬اللى هتتباصى للبرنامج‬ ‫3- انشئ الويدجت بإستخدام ال ‪Widget class‬‬ ‫‪w=Qt::Widget.new‬‬ ‫4- حدد ال ‪ title‬بإستخدام الميثود ‪ setWindowTitle‬الموجودة بال ‪w object‬‬ ‫"!‪w.setWindowTitle "Hello, QtRuby‬‬ ‫5- اعمل اعادة تحديد للمساحة بإستخدام الميثود ‪ resize‬الموجودة بال ‪w object‬‬ ‫‪w.resize(300, 200) #width, height‬‬ ‫6- اظهر ال ‪widget‬‬ ‫‪w.show‬‬ ‫7- نفذ ال ‪ application‬بإستخدام ال ‪ exec method‬الموجود بال ‪app object‬‬ ‫‪app.exec‬‬ ‫رائع جدا بس مش هو دا اللى عايزينه احنا عايزين نكتب ب إسلوب *افضل*‬ ‫انشئ ‪ class‬بإسم ‪ MyWidget‬فى ‪ my_widget.rb‬على فرض ان ال ‪ entry point‬للبرنامج هتكون دائما‬ ‫‪main.rb‬‬ ‫‪class MyWidget < Qt::Widget‬‬ ‫‪  def initialize‬‬ ‫)(‪    super‬‬ ‫‪    init_comp‬‬ ‫‪  end‬‬
  3. 3.    end ..‫ على الويدجت او الفورم الخ‬components ‫ دى هتكون الميثود المسئولة عن تجهيز ال‬init_comp ‫ال‬ ‫وفى المثال هنا معرفة كالتالى‬   def init_comp     setWindowTitle('Hello, World!')     #resize(200, 300) #w, h     setGeometry(300, 300, 250, 150) #x, y, w, h     setToolTip("Simple Widget")     setWindowIcon(Qt::Icon.new('icons/apps/preferences­desktop­remote­desktop')) #Set Icon..   end setToolTip ‫ و‬setWindowIcon ‫ و‬setGeometry ‫فى حاجات جديدة وهما‬ .setGeometry(x, y, w, h) .setToolTip tooltip ‫لعرض‬ ‫ ايضا‬markup ‫تقدر تحط فيها‬ .setWindowIcon ‫ لتحديد ايكون على الويدجت‬Icon object ‫وبتاخد‬ ‫سهل مش كدا؟؟‬
  4. 4. ‫عايزين ننشئ حاجة مشابهه لكدا‬ ‫تمام ويدجت وعليه ‪ button‬مكتوب عليه ‪!Click Me‬‬ ‫اوكى تمام هنحتاج نتكلم الول عن الستراتيجى بتاعتنا‬ ‫اول الويدجت بأبسط صورة عبارة عن مستطيل كدا‬ ‫محتاجين نضيف ليه حاجة اسمها ‪ Layout‬لنقدر نضيف اى ويدجتس اخرى جواه )اسلوب مشهور جدا(‬ ‫ال ‪ Layout‬دا عبارة عن صندوق داخلى جوا الويدجت الصلى‬
  5. 5. ‫ممكن يشمل ‪ Layouts‬اخرى وممكن يشمل فى نفس الوقت كنترولز )راجع جزئية ال ‪ RubyGnome‬‬ ‫بخصوص ال ‪(Hbox, Vbox‬‬ ‫المهم فى عندنا اكتر من نوع لل ‪ Layout‬فى افقى وفى رأسى.. الفقى بيتم فيه اضافة الويدجتس/اللي‬ ‫اوتس بصورة افقيه والرأسى بيتم إضافتهم بصورة رأسية..‬ ‫مثل اللى داخل الويدجت دا الفقى‬ ‫وعند إضافة كنترولز بيتم التحجيم وتجهيز مكان جديد للضافة مثل‬ ‫اما الرأسى فبيتم الضافة رأسيا كما فى الصورة التالية مثل‬
  6. 6. Vbox ‫ بيكون‬Main ‫ داخلية بس ال‬Layouts ‫ الرئيسى هو رأسى وبعمل جواه‬Layout ‫انا ديما بعتبر ان ال‬ ‫تعالى نجرب مثال على الضافة الرأسية‬   def init_comp     setWindowTitle('Hello, World!')     #resize(200, 300) #w, h     setGeometry(300, 300, 250, 150) #x, y, w, h     setToolTip("Simple Widget")     setWindowIcon(Qt::Icon.new('icons/apps/preferences­desktop­remote­desktop')) #Set Icon..     vlay=Qt::VBoxLayout.new #add 5 buttons vertically! (1..5).each { |i|      vlay.addWidget(Qt::PushButton.new(i.to_s))          }     setLayout(vlay)   end VboxLayout class ‫ رأسى إستخدام‬Layout ‫لنشاء‬ text ‫ وباصى للمشيد ال‬PushButton class ‫ استخدم‬push button ‫لنشاء‬ addWidget ‫ استخدم‬layout ‫لضافة ويدجت معين ل‬
  7. 7. setLayout ‫ الساسى استخدم‬Layout ‫لتحديد ال‬ ‫طب لو افقى ؟ تقدر تطبق نفس السابق كالتالى‬     vlay=Qt::VBoxLayout.new     hlay=Qt::HBoxLayout.new {|lay|       (6..10).each{|i|         lay.addWidget(Qt::PushButton.new(i.to_s))       }       vlay.addLayout(lay) addLayout ‫ معين استخدم الميثود‬layout ‫ ل‬Layout ‫لضافة‬ ‫طب لو عايزين نضيف التنين بنفس الوقت ال 5 الرأسى وال 5 الفقى ؟‬ ‫التصميم‬
  8. 8. def init_comp     setWindowTitle('Hello, World!')     #resize(200, 300) #w, h     setGeometry(300, 300, 250, 150) #x, y, w, h     setToolTip("Simple Widget")     setWindowIcon(Qt::Icon.new('icons/apps/preferences­desktop­remote­desktop')) #Set Icon..          mainlayout=Qt::VBoxLayout.new     vlay=Qt::VBoxLayout.new {|lay|       (1..5).each { |i|            lay.addWidget(Qt::PushButton.new(i.to_s))       }       mainlayout.addLayout(lay)     }          hlay=Qt::HBoxLayout.new {|lay|       (6..10).each{|i|         lay.addWidget(Qt::PushButton.new(i.to_s))       }       mainlayout.addLayout(lay)     }     setLayout(mainlayout)   end Hello World ‫مثال‬ SIGNAL/SLOT ‫اول لكدا لزم نتكلم عن تكنيك ال‬
  9. 9. ‫ هى إشارة بتتبعت من وإلى‬signal ‫ال‬ ‫ هى ال هاندلر زى مابنقول او الميثود اللى هيتم تنفيذها حين وصول الشارة من اوبجكت معين‬slot ‫ال‬ ‫ ليه كذا سيجنال ممكن يرسلها )بناء على التفاعل مع المستخدم او تغير فى الحالة( زى‬button ‫مثال ال‬ ‫ صح؟هيتم ارسالها إلى مين؟‬clicked ‫ يتم تنفيذها حين الضغط فالمستخدم لو‬slot ‫ تمام لو مش اتحددت‬button ‫الى ال ويدجت اللى فيه ال‬ ‫ يعنى‬handler ‫ او‬method ‫ضغط من هنا لمليون سنة قدام مش هيحصل تغيير فكل اللى عليك تنشئ‬ ..‫ دى‬SIGNAL ‫ دى فيتم تنفيذها كل مرة تتبعت ال‬SIGNAL ‫ وتربطها بال‬SLOT ‫وتعرفها على انها‬ ‫هنشوف حال فى المثال دا‬ class MyWidget < Qt::Widget   slots 'onBtnClickMeClicked()'      def initialize     super()     @times=0     init_comp   end      def init_comp     setWindowTitle('Hello, World!')     #resize(200, 300) #w, h     setGeometry(300, 300, 250, 150) #x, y, w, h     setToolTip("Simple Widget")          vlay=Qt::VBoxLayout.new     #Add a button..     @btnclickme=Qt::PushButton.new("Hi")     connect(@btnclickme, SIGNAL('clicked()'),  SLOT('onBtnClickMeClicked()'))     vlay.addWidget(@btnclickme)     setLayout(vlay)   end      def onBtnClickMeClicked         Qt::MessageBox::information(self, "Hello!", "Welcome to Qt!")
  10. 10.   end ‫لحظ السطر‬   slots 'onBtnClickMeClicked()' SLOTs ‫هنا بنعرف مصفوفة من الميثودز اللى عايزينها يتم اعتبارهم‬ ‫ دا بإنه الساسى للويدجت‬layout ‫ وحددنا ال‬layout ‫ وضفناه لل‬button ‫ رأسى وضفنا ليه‬layout ‫انشأنا‬ ‫ كالتالى‬slot onBtnClickMeClicked ‫ تحديدا بال‬btnclickme@ ‫ المرسل من ال‬clicked ‫ربطنا الحدث‬     connect(@btnclickme, SIGNAL('clicked()'),  SLOT('onBtnClickMeClicked()')) ‫ معرفة كالتالى‬onBtnClickMeClicked ‫ال‬   def onBtnClickMeClicked         Qt::MessageBox::information(self, "Hello!", "Welcome to Qt!")   end ‫ هى بوينتر‬self ‫ و‬Welcome to Qt ‫! وفى المحتوى مكتوب‬Hello ‫ مكتوب‬title ‫بتعرض لينا رسالة فى ال‬ ‫للب‬ Click Me ‫المثال الشهير‬ ‫بعد الضغط 6 مرات‬ ‫الفكرة العامة ان يبقة عندنا متغير نحسب فيه عدد الضغطات ودى نقدر نحسبها بإننا نتتبع كل ضغطة‬ ‫ معين‬label ‫ وبعد كدا نعدل التكست على‬button ‫تتم على ال‬ class MyWidget < Qt::Widget   slots 'onBtnClickMeClicked()'      def initialize     super()     @times=0
  11. 11.     init_comp   end      def init_comp     setWindowTitle('Click Me!')     #resize(200, 300) #w, h     setGeometry(300, 300, 250, 150) #x, y, w, h     setToolTip("Simple Widget")          vlay=Qt::VBoxLayout.new     #Add counter label..     @lblcounter=Qt::Label.new     vlay.addWidget(@lblcounter)     #Add a button..     @btnclickme=Qt::PushButton.new("Click Me!")     connect(@btnclickme, SIGNAL('clicked()'),  SLOT('onBtnClickMeClicked()'))     vlay.addWidget(@btnclickme)     setLayout(vlay)   end      def onBtnClickMeClicked()     @times += 1 #Inc times.     updateCounterLabel   end      private   def updateCounterLabel     @lblcounter.setText("Clicked: #{@times}")   end end ‫ لنحسب عدد الضغطات‬times@ ‫وايضا عرفنا متغير‬ ‫ بتاعتنا‬widgets ‫ رأسى لنضع فيه ال‬layout ‫انشأنا‬    vlay=Qt::VBoxLayout.new ‫ وضفناهم ليه‬label, button ‫انشأنا ال‬     @lblcounter=Qt::Label.new     vlay.addWidget(@lblcounter)     #Add a button..     @btnclickme=Qt::PushButton.new("Click Me!")     vlay.addWidget(@btnclickme) ‫ كالتالى‬slot onBtnClickMeClicked ‫ تحديدا بال‬btnclickme@ ‫ المرسل من ال‬clicked ‫ربطنا الحدث‬     connect(@btnclickme, SIGNAL('clicked()'),  SLOT('onBtnClickMeClicked()')) ‫ الساسى للبرنامج‬layout ‫حددنا ال‬
  12. 12.     setLayout(vlay) ‫ بقة‬slot ‫تمام تعريف ال‬   def onBtnClickMeClicked     @times += 1 #Inc times.     updateCounterLabel   end    ‫ بإستدعاء‬label ‫ بمقدار 1 عند كل استدعاء وعمل تحديث لل‬times@ ‫هتقوم بزيادة المتغير‬ ‫ المعرفة كالتالى‬updateCounterLabel   private   def updateCounterLabel     @lblcounter.setText("Clicked: #{@times}")   end ‫ تم انشائهم كالتالى‬spinner ‫ وعندنا‬slider ‫هنا عندنا‬      slider=Qt::Slider.new(Qt::Horizontal)     slider.setRange(0, 100)       spinner=Qt::SpinBox.new     spinner.setRange(0, 100) ‫ وبتاخد معاملين قيمة صغرى وقيمة كبرى‬setRange ‫تم تحديد مداهم بإستخدام ال‬ ‫ ممكن يكون افقى او رأسى ودى بتحددها من خلل المشيد بتحديد التجاه من خلل‬slider ‫لحظ ال‬ Qt::Vertical ‫ او‬Qt::Horizontal ‫ بإستخدام ال‬spinner ‫ بإنها تحدث القيمة دى على ال‬slider ‫نربط حدوث اى تغيير فى القيمة الخاصة بال‬ valueChanged, setValue  connect(slider, SIGNAL('valueChanged(int)'), spinner, SLOT('setValue(int)')) ‫ كالتالى‬slider ‫ بتحديث القيمة على ال‬spinner ‫ونفس الشئ نربط اى تغيير فى القيمة الخاصة بال‬  connect(spinner, SIGNAL('valueChanged(int)'), slider, SLOT('setValue(int)')) layout ‫نضيفهم لل‬     vlay.addWidget(slider)     vlay.addWidget(spinner) ‫ الساسى‬layout ‫نحدد ال‬     setLayout(vlay)
  13. 13. ‫‪Menus/ToolBars‬‬ ‫تمام برامج كتير بتعرض وظايفها على صورة منيو واهم الوظايف فيها على صورة ‪ toolbar‬مثل اى‬ ‫تكست اديتور‬ ‫تمام ‪ Qt‬بتنتهج اسلوب للتعامل اسمه ال ‪ actions‬ال ‪ action‬بيعبر عن اى ‪ item‬ظاهر فى منيو او فى‬ ‫تولبار بيسمى ‪ action‬ال ‪ action‬دا ليه عدة وظايف مثل صورة عليه.. اختصار.. نص مساعدة!‬ ‫فى المثال القادم هننشئ حاجة مشابهه لكدا‬
  14. 14. ‫ وتولبار‬menu 2 ‫عندنا‬ actions ‫اول خطوة انشاء ال‬    newaction=Qt::Action.new(Qt::Icon.new('actions/document­new.png'),"New",self)     #set shortcut     newaction.setShortcut("Ctrl+N")     newaction.setStatusTip("Create a new file.")     connect(newaction, SIGNAL("triggered()"), SLOT("onNew()"))          openaction=Qt::Action.new(Qt::Icon.new('actions/document­open.png'),"Open",self)     #set shortcut     openaction.setShortcut("Ctrl+O")     openaction.setStatusTip("Open a file")     connect(openaction, SIGNAL("triggered()"), SLOT("onOpen()"))          copyaction=Qt::Action.new(Qt::Icon.new('actions/edit­copy.png'),"Copy",self)     #set shortcut     copyaction.setShortcut("Ctrl+C")     copyaction.setStatusTip("Copy")     connect(copyaction, SIGNAL("triggered()"), SLOT("onCopy()"))          cutaction=Qt::Action.new(Qt::Icon.new('actions/edit­cut.png'),"Cut",self)     #set shortcut     cutaction.setShortcut("Ctrl+X")     cutaction.setStatusTip("Cut")     connect(cutaction, SIGNAL("triggered()"), SLOT("onCut()"))               exitaction=Qt::Action.new("Exit", self)     exitaction.setStatusTip("Exit..")     connect(exitaction, SIGNAL('triggered()'), $qApp, SLOT('closeAllWindows()')) ‫كلهم متشابهين عشان كدا هنشرح اول واحدة واخر واحدة‬    newaction=Qt::Action.new(Qt::Icon.new('actions/document­new.png'),"New",self)     #set shortcut     newaction.setShortcut("Ctrl+N")     newaction.setStatusTip("Create a new file.")
  15. 15.     connect(newaction, SIGNAL("triggered()"), SLOT("onNew()")) ‫ المشيد الخاص بيه بياخد 3 معاملت الول عبارة عن اليكون‬Action class ‫ استخدم‬Action ‫لنشاء ال‬ ‫والتانى التسكت والتالت هو النافذة اللى بينتمى ليها‬ action object ‫ الموجود بال‬setShortcut ‫ استخدم‬Shortcut ‫لتحديد ال‬ action object ‫ الموجودة بال‬setStatusTip ‫ استخدم‬status tip ‫لتحديد ال‬ connections ‫ ودى هى اللى بنربطها فى حال انشاء ال‬triggered ‫ المسماه ب‬SGINAL ‫ ليه ال‬action ‫وال‬     exitaction=Qt::Action.new("Exit", self)     exitaction.setStatusTip("Exit..")     connect(exitaction, SIGNAL('triggered()'), $qApp, SLOT('closeAllWindows()')) ‫ بالتكست فقط والنافذة الب‬Action ‫نفس السابقة انشأنا‬ status tip ‫حددنا ال‬ qApp$ ‫ الخاصة بال‬SLOT closeAllWindows ‫ بال‬action ‫ الصادرة من ال‬triggered signal ‫اخيرا ربطنا ال‬ ...application object ‫ ؟ متغير عام بيشير لل‬qApp$ ‫ماهو ال‬ ‫ معرفة مسبقا لغلق كل النوافذ ومن ثم غلق البلكيشن‬SLOT ‫ هى‬closeAllWindows ‫ال‬ ‫ فى الويدجت‬statusbar ‫ عند اول استدعاء ليها هتقوم بإظهار ال‬statusBar ‫إضافة منيو‬     mbar=menuBar #fetch it.          filemenu=mbar.addMenu("&File")     filemenu.addAction(newaction)     filemenu.addAction(openaction)     filemenu.addSeparator     filemenu.addAction(exitaction)               editmenu=mbar.addMenu("&Edit")     editmenu.addAction(copyaction)     editmenu.addAction(cutaction) ..‫ ميثود او تقدر تستخدمها مباشرة فى كل مرة حسب راحتك‬menuBar ‫اول خد رفرنس من ال‬ menuBar object ‫ الموجودة بال‬addMenu. ‫لنشاء منيو استخدم‬ ‫ اللى جهزته مسبقا‬action ‫ وباصي ليها ال‬addAction ‫ لمنيو معينة استخدم‬action ‫لضافة‬ addSeparator. ‫ استخدم‬separator ‫لضافة‬ menu object ‫ من ال‬addMenu. ‫لضافة منيو داخلية استخدم‬ ‫التعامل مع التولبار‬ ‫ مع‬addToolBar ‫ او كدا استخدم‬file menu ‫لضافة جزء جديد بالتولبار بيعبر عن منطقة معينة مثل ال‬ (‫ بين عناصر المناطق‬separator ‫اسم المنطقة )لحظ بين كل استدعاء ليها هيتم انشاء‬ toolbar object ‫ الموجودة بال‬addAction ‫ ليها استخدم‬actions ‫لضافة‬     fbar=addToolBar('file') #Toolbar for file menu items..     fbar.addAction(newaction)     fbar.addAction(openaction)
  16. 16.     ebar=addToolBar("edit") #Toolbar for edit menu items..     ebar.addAction(copyaction)     ebar.addAction(cutaction) ‫كود المثال‬ class MyWindow < Qt::MainWindow   slots 'onNew()', 'onOpen()', 'onCopy()', 'onCut()'      def initialize     super()     init_comp   end      def init_comp     setWindowTitle('Hello, World!')     #resize(200, 300) #w, h     setGeometry(300, 300, 250, 150) #x, y, w, h     setToolTip("Simple Widget")          newaction=Qt::Action.new(Qt::Icon.new('actions/document­new.png'),"New",self)     #set shortcut     newaction.setShortcut("Ctrl+N")     newaction.setStatusTip("Create a new file.")     connect(newaction, SIGNAL("triggered()"), SLOT("onNew()"))          openaction=Qt::Action.new(Qt::Icon.new('actions/document­open.png'),"Open",self)     #set shortcut     openaction.setShortcut("Ctrl+O")     openaction.setStatusTip("Open a file")     connect(openaction, SIGNAL("triggered()"), SLOT("onOpen()"))          copyaction=Qt::Action.new(Qt::Icon.new('actions/edit­copy.png'),"Copy",self)     #set shortcut     copyaction.setShortcut("Ctrl+C")     copyaction.setStatusTip("Copy")     connect(copyaction, SIGNAL("triggered()"), SLOT("onCopy()"))          cutaction=Qt::Action.new(Qt::Icon.new('actions/edit­cut.png'),"Cut",self)     #set shortcut     cutaction.setShortcut("Ctrl+X")     cutaction.setStatusTip("Cut")     connect(cutaction, SIGNAL("triggered()"), SLOT("onCut()"))               exitaction=Qt::Action.new("Exit", self)
  17. 17.     exitaction.setStatusTip("Exit..")     connect(exitaction, SIGNAL('triggered()'), $qApp, SLOT('closeAllWindows()'))          statusBar #Show up the statusBar..          #Add to the main menubar and a toolbar..     mbar=menuBar #fetch it.          filemenu=mbar.addMenu("&File")     filemenu.addAction(newaction)     filemenu.addAction(openaction)     filemenu.addSeparator     filemenu.addAction(exitaction)               editmenu=mbar.addMenu("&Edit")     editmenu.addAction(copyaction)     editmenu.addAction(cutaction)          fbar=addToolBar('file') #Toolbar for file menu items..     fbar.addAction(newaction)     fbar.addAction(openaction)     ebar=addToolBar("edit")     ebar.addAction(copyaction)     ebar.addAction(cutaction)   end      def onNew     puts "New action!"   end      def onOpen     puts "Open action!"   end      def onCopy     puts "Copy action!"   end      def onCut     puts "Cut action!"   end
  18. 18. ‫‪end‬‬ ‫ال ‪Dialogs‬‬ ‫التعامل مع ال ‪ Dialogs‬كتير سهل مع ال ‪ Qt‬فهنشرح المثال الموجود بال ‪standard dialogs‬‬ ‫‪QinputDialog‬‬ ‫هو كلس بيسهل التعامل مع المستخدم واخذ قيمة معينة منه سواء ‪Integer, Double, Text, Item‬‬ ‫‪getInteger‬‬ ‫التعريف العام ليها‬ ‫ ‪int getInteger ( QWidget * parent, const QString & title, const QString & label, int value = 0, int‬‬ ‫ = ‪minValue = ­2147483647, int maxValue = 2147483647, int step = 1, bool * ok = 0, Qt::WindowFlags f‬‬ ‫) 0‬ ‫اول معامل مع النافذة الب‬ ‫الثانى هو عنوان الديالوج‬ ‫الثالث هو الرسالة‬ ‫الرابع هو القيمة المختارة‬ ‫الخامس اقل قيمة‬
  19. 19. ‫السادس اكبر قيمة‬ ‫السابع مقدار الزيادة‬ ‫الثامن هو مؤشر للمتغير اللى هيتم تخزين فيه ناتج تعامل المستخدم مع الديالوج‬ ‫التاسع هو ال ‪) WindowFlags‬يستحسن مراجعة ال ‪ enum‬من ال ‪(Qt Assistant‬‬ ‫التعامل من خلل روبى‬ ‫)(‪    def setInteger‬‬ ‫‪        ok = Qt::Boolean.new‬‬ ‫,)")(‪        i = Qt::InputDialog.getInteger(self, tr("Qt::InputDialog.getInteger‬‬ ‫)‪                                         tr("Percentage:"), 25, 0, 100, 1, ok‬‬ ‫‪        if ok‬‬ ‫)‪            @integerLabel.text = tr("%d%" % i‬‬ ‫‪        end‬‬ ‫‪    end‬‬ ‫لحظ انشأنا ‪ok‬من النوع ‪ Qt::Boolean‬ليتم مباصاته لل ‪ getInteger‬لحساب قيمة التفاعل مع المستخدم‬ ‫استدعينا الديالوج من خلل ال ‪ static getInteger‬واخدت معاملت زى ماذكرنا الب والعنوان والرسالة‬ ‫والقيمة المختارة والقيمة الصغرى والقيمة الكبرى ومقدار الزيادة ومتغير ‪ ok‬ليتم وضع ناتج التفاعل فيه‬ ‫فى حال ان ال ‪ ok‬دا قيمته اعيدت ب ‪ true‬هيتم وضع تكست على ‪ label‬مسمى @‪integerLabel‬‬ ‫‪getDouble‬‬ ‫نفس تعريف سابقتها ولكن بتعمل ريترن ب ‪double‬‬ ‫,0 = ‪ double getDouble ( QWidget * parent, const QString & title, const QString & label, double value‬‬ ‫,0 = ‪ double minValue = ­2147483647, double maxValue = 2147483647, int decimals = 1, bool * ok‬‬ ‫0 = ‪( Qt::WindowFlags f‬‬ ‫اول معامل مع النافذة الب‬ ‫الثانى هو عنوان الديالوج‬ ‫الثالث هو الرسالة‬ ‫الرابع هو القيمة المختارة‬ ‫الخامس اقل قيمة‬
  20. 20. ‫السادس اكبر قيمة‬ ‫السابع مقدار الزيادة‬ ‫الثامن هو مؤشر للمتغير اللى هيتم تخزين فيه ناتج تعامل المستخدم مع الديالوج‬ ‫التاسع هو ال ‪) WindowFlags‬يستحسن مراجعة ال ‪ enum‬من ال ‪(Qt Assistant‬‬ ‫التعامل من خلل روبى‬ ‫)(‪    def setDouble‬‬ ‫‪        ok = Qt::Boolean.new‬‬ ‫,)")(‪        d = Qt::InputDialog.getDouble(self, tr("Qt::InputDialog.getDouble‬‬ ‫)‪                                           tr("Amount:"), 37.56, ­10000, 10000, 2, ok‬‬ ‫‪        if ok‬‬ ‫‪            @doubleLabel.text = "$%f" % d‬‬ ‫‪        end‬‬ ‫‪    end‬‬ ‫استدعينا الديالوج من خلل ال ‪ static getDouble‬واخدت معاملت زى ماذكرنا الب والعنوان والرسالة‬ ‫والقيمة المختارة والقيمة الصغرى والقيمة الكبرى ومقدار الزيادة ومتغير ‪ ok‬ليتم وضع ناتج التفاعل فيه‬ ‫فى حال ان ال ‪ ok‬دا قيمته اعيدت ب ‪ true‬هيتم وضع تكست على ‪ label‬مسمى @‪doubleLabel‬‬ ‫‪getItem‬‬ ‫ & ‪QString getItem ( QWidget * parent, const QString & title, const QString & label, const QStringList‬‬ ‫) 0 = ‪list, int current = 0, bool editable = true, bool * ok = 0, Qt::WindowFlags f‬‬ ‫‪ :parent‬هو الب‬ ‫‪ :title‬العنوان‬ ‫‪ :label‬الرسالة‬ ‫‪ :list‬الختيارات المتاحة‬ ‫‪ :current‬رقم الختيار الحالى )اللى هيتم عرضه( ‪index‬‬ ‫‪ :editable‬هل المستخدم يقدر يكتب فى مكان الختيار او ل‬ ‫‪ :ok‬مؤشر للريترن‬ ‫يفضل مراجعة ال ‪ WindowFlags‬مع ال ‪Qt Assistant‬‬
  21. 21. ‫التعامل من خلل روبى‬     def setItem()         items = []         items << tr("Spring") << tr("Summer") << tr("Fall") << tr("Winter")              ok = Qt::Boolean.new         item = Qt::InputDialog.getItem(self, tr("Qt::InputDialog.getItem()"),                                              tr("Season:"), items, 2, false, ok)         if ok && !item.nil?             @itemLabel.text = item         end     end ‫ مثل ونحط فيها القيم‬items ‫ بإسم‬list ‫بننشئ‬ ‫ ونباصى ليها رفرنس للب والعنوان ومحتوى الرسالة‬static getItem ‫ونستدعى الديالوج بإستخدام ال‬ ‫والختيارات والختيار المنشط و سماحية الكتابة ورفرنس لناتج التفاعل‬ ‫ بحيث انه يظهر‬itemLabel@ ‫نختبر العائد من التفاعل والقيم اللى اختارها المستخدم وبناء عليها هنعدل‬ ... ‫الختيار‬ getText ‫معرفة كالتالى‬ QString getText ( QWidget * parent, const QString & title, const QString & label,  QLineEdit::EchoMode mode = QLineEdit::Normal, const QString & text = QString(), bool * ok = 0,  Qt::WindowFlags f = 0 ) ‫ من المستخدم‬string ‫ميثود بتحصل على‬ ‫: الب‬parent ‫: العنوان‬title ‫: محتوى الرسالة‬label ‫ المستخدم اهمهم‬echo mode ‫: بيعبر عن ال‬mode Normal: ‫عرض الحروف جميعا‬ NoEcho: ‫عدم العرض‬
  22. 22. Password: ‫إستبدال الحروف بنجوم‬ LineEdit ‫: هو النص الفتراضى الموجود بال‬text ‫: ناتج التفاعل مع المستخدم‬ok ‫التعامل من خلل روبى‬     def setText()         ok = Qt::Boolean.new         text = Qt::InputDialog.getText(self, tr("Qt::InputDialog.getText()"),                                              tr("User name:"), Qt::LineEdit::Normal,                                              Qt::Dir::home().dirName(), ok)         if ok && !text.nil?             @textLabel.text = text         end     end ColorDialog  static getColor ‫هو كلس بيسهل علينا الحصول على لون معين من اختيار المستخدم ودا من خلل ال‬ ‫المعرفة كالتالى‬ QColor getColor ( const QColor & initial = Qt::white, QWidget * parent = 0 ) (‫ )الب‬parent ‫ وبينتمى الديالوج ل‬initial ‫بتعرض ديالوج فيه الختيار الولى‬ ‫ ميثود‬color.isValid ‫ فللختبار استخدم‬invalid ‫ هيتم اعادة‬cancel ‫لو المستخدم ضغط‬ ‫الستخدام من خلل روبى‬
  23. 23.     def setColor()         color = Qt::ColorDialog.getColor(Qt::Color.new(Qt::green), self)         if color.isValid()             @colorLabel.text = color.name         end     end self ‫هنا انشأنا ديالوج بإختيار افتراضى هو اللون الخضر ورفرنس للب‬  color = Qt::ColorDialog.getColor(Qt::Color.new(Qt::green), self) ‫ الخاص بيه‬name ‫ هيتم عرض ال‬valid ‫ او ل لو‬isValid ‫بنختبر هل اللون‬ ‫للحصول على نسبة الخضر والحمر والزرق استخدم‬ .red .green ,blue FontDialog getFont
  24. 24. ‫فى الواقع الميثود دى معرفة اكثر من مرة ‪ overloaded‬فإحنا هناخد دى‬ ‫) 0 = ‪QFont getFont ( bool * ok, const QFont & initial, QWidget * parent‬‬ ‫هنا ‪ ok‬بتعبر عن ناتج التفاعل مع المستخدم‬ ‫‪ :initial‬الفونت اللى هيتم وضعه كبداية‬ ‫‪ :parent‬النافذة الب‬ ‫او تقدر تستدعيه كالتالى‬ ‫) 0 = ‪QFont getFont ( bool * ok, QWidget * parent‬‬ ‫وهيتم وضع ال ‪ font‬الفتراضى للبلكيشن ك ‪initial‬‬ ‫التعامل مع روبى‬ ‫)(‪    def setFont‬‬ ‫‪        ok = Qt::Boolean.new‬‬ ‫)‪        font = Qt::FontDialog.getFont(ok, Qt::Font.new(@fontLabel.text), self‬‬ ‫‪        if ok‬‬ ‫)(‪            @fontLabel.text = font.key‬‬ ‫‪        end‬‬ ‫‪    end‬‬ ‫‪ ok‬متغير ليعبر عن الحالة‬ ‫نعمل ‪ run‬للديالوج بإستخدام ال ‪ static getFont‬واللى هتاخد ‪ ok‬و ‪ Font Object‬ليعبر عن الفونت الولى‬ ‫وهنا بدل مانكتب التعريف ناخده مباشرة من ‪ fontLabel‬و ‪ self‬رفرنس للب‬ ‫اختبر ال ‪ok‬‬
  25. 25. ‫او تقدر تستخدمه كما ذكرنا بالعلى‬     def setFont()         ok = Qt::Boolean.new         font = Qt::FontDialog.getFont(ok, self)         if ok             @fontLabel.text = font.key()         end     end FileDialog ‫كلس بيتيح ليك بسهولة امكانية اختيار ملفات او مجلدات‬ getDir QString getExistingDirectory ( QWidget * parent = 0, const QString & caption = QString(), const  QString & dir = QString(), Options options = ShowDirsOnly ) ‫للحصول على مجلد موجود من قبل‬ ‫: النافذة الب‬parent caption ‫ ال‬caption ‫: الفولدر اللى هيتم البدأ منه‬dir ‫: مجموعة من الوبشنز الفتراضى عرض الفولدرات فقط‬options ‫اهمهم‬ ShowDirsOnly, DontResolveSymLinks ...‫ وهى بيتم حلها افتراضيا‬symlinks ‫لمنع حل ال‬ ‫التعامل من خلل روبى‬
  26. 26.     def setExistingDirectory()         directory = Qt::FileDialog.getExistingDirectory(self,                                     tr("Qt::FileDialog.getExistingDirectory()"),                                     @directoryLabel.text,                                     Qt::FileDialog::DontResolveSymlinks |                                     Qt::FileDialog::ShowDirsOnly)         if !directory.nil?             @directoryLabel.text = directory         end     end .getOpenFileName ‫لختيار ملف واحد‬ QString getOpenFileName ( QWidget * parent = 0, const QString & caption = QString(), const  QString & dir = QString(), const QString & filter = QString(), QString * selectedFilter = 0, Options  options = 0 ) ‫: الب‬parent caption ‫: ال‬caption ‫: محل البداية‬dir ‫: الفيلتر اللى هيتم بناء عليه عرض الملفات‬filter ‫: الفلتر المختار‬selectedFiler DirsOnly ‫: مشابه لسابقتها ماعدا ال‬Options ‫ال‬ ‫التعامل من خلل روبى‬
  27. 27.     def setOpenFileName()         fileName = Qt::FileDialog.getOpenFileName(self,                                     tr("Qt::FileDialog.getOpenFileName()"),                                     @openFileNameLabel.text,                                     tr("All Files (*);;Text Files (*.txt)"))         if !fileName.nil?             @openFileNameLabel.text = fileName         end     end ‫ قد يكون فيه تكست او ل فهى محطوطة بالمثال لتتبع اخر اختيار وهكذا‬openFileLabel.text@ ‫لحظ ال‬ ‫فى باقى المثلة‬ ‫ والملف الساسى والفلتر‬caption ‫ وباصينا ال‬static getOpenFileName ‫عمل رن للديالوج بإستخدام ال‬ ‫لحظ الفلتر مكتوب كالتالى‬ "All Files (*);;Text Files (*.txt)" * ‫ ودى كل الفايلت‬All Files ‫هيقدم اختيارين‬ txt.* ‫ مع‬match ‫ ودى كل الفايلت اللى بتعمل‬text Files ‫و‬ ;; ‫لحظ بتفصل بين كل واحد بإستخدام‬ .getOpenFileNames QStringList getOpenFileNames ( QWidget * parent = 0, const QString & caption = QString(), const  QString & dir = QString(), const QString & filter = QString(), QString * selectedFilter = 0, Options  options = 0 ) ‫لختيار اكتر من ملف‬
  28. 28.    def setOpenFileNames()         files = Qt::FileDialog.getOpenFileNames(                                     self, tr("Qt::FileDialog.getOpenFileNames()"),                                     @openFilesPath,                                     tr("All Files (*);;Text Files (*.txt)"))         if files.length != 0             @openFilesPath = files[0]             @openFileNamesLabel.text = "[%s]" % files.join(", ")         end     end .getSaveFileName ‫لحفظ ملف معين‬ QString getSaveFileName ( QWidget * parent = 0, const QString & caption = QString(), const QString  & dir = QString(), const QString & filter = QString(), QString * selectedFilter = 0, Options options = 0  )
  29. 29. ‫كسابقاتها ولكنها للحفظ وليست لفتح ملف/ات‬     def setSaveFileName()         fileName = Qt::FileDialog.getSaveFileName(self,                                     tr("Qt::FileDialog.getSaveFileName()"),                                     @saveFileNameLabel.text,                                     tr("All Files (*);;Text Files (*.txt)"))         if !fileName.nil?             @saveFileNameLabel.text = fileName         end     end QmessageBox MessageBox ‫فى 4 مستويات لل‬ ‫ ودى للسؤال‬Question -1 ‫ لعلم بشئ معين‬Information -2 ‫ تحذير‬Warning -3 ‫ حرج‬Critical -4 QmessageIcon ‫لعرض ايكون مخصصة‬
  30. 30. QMessageBox::NoIcon 0 QMessageBox::Question 4 QMessageBox::Information 1 QMessageBox::Warning 2 QMessageBox::Critical 3 ‫اهم الزراير‬ QMessageBox::Ok ‫ زر‬OK QMessageBox::Open ‫ زر‬Open QMessageBox::Save ‫ زر‬Save QMessageBox::Cancel ‫ زر‬Cancel QMessageBox::Close ‫ زر‬Close QMessageBox::Discard ‫ زر‬Discard QMessageBox::Apply ‫ زر‬Apply QMessageBox::Reset ‫ زر‬Reset QMessageBox::RestoreDefaults ‫ زر‬Restore Defaults QMessageBox::Help ‫ زر‬Help QMessageBox::SaveAll ‫ زر‬Save All QMessageBox::Yes ‫ زر‬Yes QMessageBox::YesToAll ‫ زر‬Yes to all QMessageBox::No ‫ زر‬No QMessageBox::NoToAll ‫ زر‬No to all QMessageBox::Abort ‫ زر‬Abort QMessageBox::Retry ‫ زر‬Retry QMessageBox::Ignore ‫ زر‬Ignore ‫اهم الميثودز‬ ‫ملحوظة فى كل المثلة التالية‬ ‫: النافذة الب‬parent ‫: ال عنوان‬title ‫: محتوى الرسالة‬text (‫: تجميعة الزرار الموضوعة على الديالوج )سبق ذكرها فى الجدول السابق‬buttons ‫: الزر الفتراضى‬defaultButton
  31. 31. void aboutQt ( QWidget * parent, const QString & title = QString() ) About Qt ‫لعرض ديالوج‬ StandardButton critical ( QWidget * parent, const QString & title, const QString & text,  StandardButtons buttons = Ok, StandardButton defaultButton = NoButton ) Critical ‫لعرض رسالة‬     def criticalMessage()         reply = Qt::MessageBox::critical(self, tr("Qt::MessageBox.showCritical()"),                                           @message,                                           Qt::MessageBox::Abort,                                           Qt::MessageBox::Retry,                                           Qt::MessageBox::Ignore)         if reply == Qt::MessageBox::Abort             @criticalLabel.text = tr("Abort")         elsif reply == Qt::MessageBox::Retry             @criticalLabel.text = tr("Retry")         else             @criticalLabel.text = tr("Ignore")         end     end StandardButton information ( QWidget * parent, const QString & title, const QString & text,  StandardButtons buttons = Ok, StandardButton defaultButton = NoButton ) ‫لعرض رسالة معلومات‬     def informationMessage()
  32. 32.         Qt::MessageBox::information(self, tr("Qt::MessageBox.showInformation()"), @message)         @informationLabel.text = tr("Closed with OK or Esc")     end StandardButton question ( QWidget * parent, const QString & title, const QString & text,  StandardButtons buttons = Ok, StandardButton defaultButton = NoButton ) ‫لعرض سؤال‬     def questionMessage()         reply = Qt::MessageBox.question(self, tr("Qt::MessageBox.showQuestion()"),                                           @message,                                           Qt::MessageBox::Yes,                                           Qt::MessageBox::No,                                           Qt::MessageBox::Cancel)         if reply == Qt::MessageBox::Yes             @questionLabel.text = tr("Yes")         elsif reply == Qt::MessageBox::No             @questionLabel.text = tr("No")         else             @questionLabel.text = tr("Cancel")         end     end StandardButton warning ( QWidget * parent, const QString & title, const QString & text,  StandardButtons buttons = Ok, StandardButton defaultButton = NoButton ) ‫لعرض تحذير‬     def warningMessage()         reply = Qt::MessageBox.warning(self, tr("Qt::MessageBox.showWarning()"),                                          @message,                                          tr("Save &Again"),                                          tr("&Continue"))         if reply == 0             @warningLabel.text = tr("Save Again")         else             @warningLabel.text = tr("Continue")         end     end Tab
  33. 33. general, permissions, applications ‫ بإسم‬tabs 3 ‫هنا فى الصورة السابقة عندنا‬ ‫ كل واحد فى ويدجت معين وتقدر تحدد هتعرض مين‬layout 3 ‫الفكرة العامة ان يبقة عندك‬ ‫ من السابقين‬tab ‫هتنشئ 3 كلسات كل واحد فيهم بيعبر عن‬ class GeneralTab < Qt::Widget #Code omitted end class PermissionsTab < Qt::Widget #Code omitted.. end class ApplicationsTab < Qt::Widget #Code omitted.. end ...‫ هو الديفولت‬general tab ‫3 دول وفيه ال‬tabs ‫اوكى نبدأ بالتصميم للديالوج بتاعنا اللى فيه ال‬ class TabDialog < Qt::Dialog          def initialize(fileName, parent = nil)         super(parent)         fileInfo = Qt::FileInfo.new(fileName)              @tabWidget = Qt::TabWidget.new         @tabWidget.addTab(GeneralTab.new(fileInfo), tr("General"))         @tabWidget.addTab(PermissionsTab.new(fileInfo), tr("Permissions"))
  34. 34.         @tabWidget.addTab(ApplicationsTab.new(fileInfo), tr("Applications"))              okButton = Qt::PushButton.new(tr("OK"))         cancelButton = Qt::PushButton.new(tr("Cancel"))              connect(okButton, SIGNAL('clicked()'), self, SLOT('accept()'))         connect(cancelButton, SIGNAL('clicked()'), self, SLOT('reject()'))              buttonLayout = Qt::HBoxLayout.new do |b|             b.addStretch(1)             b.addWidget(okButton)             b.addWidget(cancelButton)         end              self.layout = Qt::VBoxLayout.new do |m|             m.addWidget(@tabWidget)             m.addLayout(buttonLayout)         end              self.windowTitle = tr("Tab Dialog")     end end ..‫ دا متغير عشان نباصيه لكل كلس السابقين عشان يكون ليه دور ولو بسيط حتى‬fileinfo ‫ال‬ addTab ‫ بإستخدام‬tabs ‫ وضيف ال‬TabWidget.new ‫ بإستخدام‬tab widget ‫انشئ‬         @tabWidget = Qt::TabWidget.new         @tabWidget.addTab(GeneralTab.new(fileInfo), tr("General"))         @tabWidget.addTab(PermissionsTab.new(fileInfo), tr("Permissions"))         @tabWidget.addTab(ApplicationsTab.new(fileInfo), tr("Applications"))      .. General ‫لحظ ان هنا هيبقة الديفولت هو ال‬ ‫ لنهم مرصوصين افقى‬hboxlayout ‫ بإستخدام‬OK, CANCEL ‫ ال‬buttons ‫اخيرا نضيف ال‬         buttonLayout = Qt::HBoxLayout.new do |b|             b.addStretch(1)             b.addWidget(okButton)             b.addWidget(cancelButton)         end buttons layout ‫ وال‬tab widget ‫ وضيف فيه ال‬VboxLayout ‫انشئ‬         self.layout = Qt::VBoxLayout.new do |m|             m.addWidget(@tabWidget)             m.addLayout(buttonLayout)         end
  35. 35. General Tab ‫تصميم ال‬ File Name ­> Label fileNameEdit­> LineEdit pathLabel­> Label pathValueLabel ­> Label sizeLabel­> Label sizeValueLabel­>Label lastReadLabel­>Label lastReadValueLabel­>Label lastModLabel­>Label lastModValueLabel­>Label VBox Layout ‫وتم رصهم رأسيا بإستخدام‬ class GeneralTab < Qt::Widget          def initialize(fileInfo, parent = nil)         super(parent)         fileNameLabel = Qt::Label.new(tr("File Name:"))         fileNameEdit = Qt::LineEdit.new(fileInfo.fileName())              pathLabel = Qt::Label.new(tr("Path:"))         pathValueLabel = Qt::Label.new(fileInfo.absoluteFilePath())         pathValueLabel.frameStyle = Qt::Frame::Panel | Qt::Frame::Sunken              sizeLabel = Qt::Label.new(tr("Size:"))         size = fileInfo.size()/1024         sizeValueLabel = Qt::Label.new("%d K" % size)         sizeValueLabel.frameStyle = Qt::Frame::Panel | Qt::Frame::Sunken              lastReadLabel = Qt::Label.new(tr("Last Read:"))         lastReadValueLabel = Qt::Label.new(fileInfo.lastRead().toString())
  36. 36.         lastReadValueLabel.frameStyle = Qt::Frame::Panel | Qt::Frame::Sunken              lastModLabel = Qt::Label.new(tr("Last Modified:"))         lastModValueLabel = Qt::Label.new(fileInfo.lastModified().toString())         lastModValueLabel.frameStyle = Qt::Frame::Panel | Qt::Frame::Sunken              self.layout = Qt::VBoxLayout.new do |m|             m.addWidget(fileNameLabel)             m.addWidget(fileNameEdit)             m.addWidget(pathLabel)             m.addWidget(pathValueLabel)             m.addWidget(sizeLabel)             m.addWidget(sizeValueLabel)             m.addWidget(lastReadLabel)             m.addWidget(lastReadValueLabel)             m.addWidget(lastModLabel)             m.addWidget(lastModValueLabel)             m.addStretch(1)         end     end end Permissions Tab ‫تصميم ال‬ ‫ مرصوصين رأسيا‬ownership ‫ و‬permissions ‫ بإسم‬groupbox 2 ‫فى‬ ‫ مرصوصين رأسيا‬check boxes 3 ‫ بتشمل‬permissions ‫ال‬ ‫ ليها ومرصوصين رأسيا‬LineEdit ‫ ول‬label group ‫ و‬LineEdit ‫ و‬label owner ‫ بتشمل‬ownership ‫ال‬ class PermissionsTab < Qt::Widget     def initialize(fileInfo, parent = nil)         super(parent)         permissionsGroup = Qt::GroupBox.new(tr("Permissions"))     
  37. 37.         readable = Qt::CheckBox.new(tr("Readable"))         if fileInfo.readable?             readable.checked = true         end              writable = Qt::CheckBox.new(tr("Writable"))         if fileInfo.writable?             writable.checked = true         end              executable = Qt::CheckBox.new(tr("Executable"))         if fileInfo.executable?             executable.checked = true         end              ownerGroup = Qt::GroupBox.new(tr("Ownership"))              ownerLabel = Qt::Label.new(tr("Owner"))         ownerValueLabel = Qt::Label.new(fileInfo.owner())         ownerValueLabel.frameStyle = Qt::Frame::Panel | Qt::Frame::Sunken              groupLabel = Qt::Label.new(tr("Group"))         groupValueLabel = Qt::Label.new(fileInfo.group())         groupValueLabel.frameStyle = Qt::Frame::Panel | Qt::Frame::Sunken              permissionsGroup.layout = Qt::VBoxLayout.new do |p|             p.addWidget(readable)             p.addWidget(writable)             p.addWidget(executable)         end              ownerGroup.layout = Qt::VBoxLayout.new do |o|             o.addWidget(ownerLabel)             o.addWidget(ownerValueLabel)             o.addWidget(groupLabel)             o.addWidget(groupValueLabel)         end              self.layout = Qt::VBoxLayout.new do |m|             m.addWidget(permissionsGroup)             m.addWidget(ownerGroup)             m.addStretch(1)         end     end end
  38. 38. Applications Tab ‫تصميم ال‬ topLabel­> Label, text (Open with) applicationsListBox ­> ListWidget, 30 Applications alwaysCheckBox ­>CheckBox VBoxLayout ‫ومرصوصين رأسيا بإستخدام‬ class ApplicationsTab < Qt::Widget          def initialize(fileInfo, parent = nil)         super(parent)         topLabel = Qt::Label.new(tr("Open with:"))              applicationsListBox = Qt::ListWidget.new         applications = []         (1..30).each do |i|             applications.push tr("Application %d" % i)         end         applicationsListBox.insertItems(0, applications)         if fileInfo.suffix.nil?             alwaysCheckBox = Qt::CheckBox.new(tr("Always use this application to " +                 "open this type of file"))         else             alwaysCheckBox = Qt::CheckBox.new(tr("Always use this application to " +                 "open files with the extension '%s'" % fileInfo.suffix()))         end              self.layout = Qt::VBoxLayout.new do |l|             l.addWidget(topLabel)             l.addWidget(applicationsListBox)             l.addWidget(alwaysCheckBox)         end
  39. 39. ‫‪    end‬‬ ‫‪end‬‬ ‫لحظ ان كل ال ‪ Tabs‬اخدت ‪ fileInfo‬فى المشيد الخاص بيها )راجع اول فقرة(‬ ‫‪ConfigDialog‬‬ ‫الخطوة القادمة تصميم ديالوج مشابه لدا‬ ‫الفكرة كلها اننا عندنا جزئين جزء فيه ‪ List‬كل عناصرها على صورة ‪ Icons‬والجزء التانى فيه‬ ‫‪ StackedWidget‬ودا مشابه لل ‪ Tab‬ولكن غير ظاهر وبيشمل ويدجتس ايضا الفكرة هنا اننا هنربط التغيير‬ ‫فى العنصر المختار من ال ‪ List‬بنفس الترتيب على ال ‪ StackedWidget‬ليتم اظهاره‬ ‫تمام الول هننشئ الصفحات دى‬ ‫تصميم ال ‪config page‬‬ ‫تصميمها بسيط مجرد ‪ groupbox‬فيها ‪ label‬و ‪ combobox‬فيها عدة عناصر وهما مرصوصين افقيا وال‬
  40. 40. ‫ مرصوص بصورة رأسية‬group box class ConfigurationPage < Qt::Widget          def initialize(parent = nil)         super(parent)         configGroup = Qt::GroupBox.new(tr("Server configuration"))              serverLabel = Qt::Label.new(tr("Server:"))         serverCombo = Qt::ComboBox.new do |c|             c.addItem(tr("Trolltech (Australia)"))             c.addItem(tr("Trolltech (Norway)"))             c.addItem(tr("Trolltech (People's Republic of China)"))             c.addItem(tr("Trolltech (USA)"))         end              serverLayout = Qt::HBoxLayout.new do |s|             s.addWidget(serverLabel)             s.addWidget(serverCombo)         end              configGroup.layout = Qt::VBoxLayout.new do |c|             c.addLayout(serverLayout)         end              self.layout = Qt::VBoxLayout.new do |m|             m.addWidget(configGroup)             m.addStretch(1)         end     end end ..object ‫ الموجودة بال‬addItem ‫ استخدم‬comboBox ‫لضافة عنصر إلى‬ update page ‫تصميم ال‬
  41. 41. button ‫ مرصوصة رأسيا مع‬groupbox ‫تصميمها مباشر جدا‬ (‫ فى المثال‬gridlayout ‫ )هنشرح ال‬grid ‫ العناصر مرصوصة فى‬groupbox ‫وداخل ال‬ class UpdatePage < Qt::Widget          def initialize(parent = nil)         super(parent)         packagesGroup = Qt::GroupBox.new(tr("Look for packages"))              nameLabel = Qt::Label.new(tr("Name:"))         nameEdit = Qt::LineEdit.new              dateLabel = Qt::Label.new(tr("Released after:"))         dateEdit = Qt::DateTimeEdit.new(Qt::Date.currentDate())              releasesCheckBox = Qt::CheckBox.new(tr("Releases"))         upgradesCheckBox = Qt::CheckBox.new(tr("Upgrades"))              hitsSpinBox = Qt::SpinBox.new do |h|             h.prefix = tr("Return up to ")             h.suffix = tr(" results")             h.specialValueText = tr("Return only the first result")             h.minimum = 1             h.maximum = 100             h.singleStep = 10         end         startQueryButton = Qt::PushButton.new(tr("Start query"))              packagesGroup.layout = Qt::GridLayout.new do |p|             p.addWidget(nameLabel, 0, 0)             p.addWidget(nameEdit, 0, 1)
  42. 42.             p.addWidget(dateLabel, 1, 0)             p.addWidget(dateEdit, 1, 1)             p.addWidget(releasesCheckBox, 2, 0)             p.addWidget(upgradesCheckBox, 3, 0)             p.addWidget(hitsSpinBox, 4, 0, 1, 2)         end              self.layout = Qt::VBoxLayout.new do |m|             m.addWidget(packagesGroup)             m.addSpacing(12)             m.addWidget(startQueryButton)             m.addStretch(1)         end     end end GroupBox class ‫ وحددنا ال تكست الظاهر عليها بإستخدام المشيد لل‬groupbox ‫1- انشأنا ال‬         packagesGroup = Qt::GroupBox.new(tr("Look for packages")) Name LineEdit ‫ وال‬Name Label ‫2- انشأنا ال‬         nameLabel = Qt::Label.new(tr("Name:"))         nameEdit = Qt::LineEdit.new DataTime Edit ‫ و ال‬Date label ‫3- انشأنا ال‬         dateLabel = Qt::Label.new(tr("Released after:"))         dateEdit = Qt::DateTimeEdit.new(Qt::Date.currentDate()) ‫ وبتباصى التكست الظاهر جمب الصندوق فى‬CheckBox class ‫ بإستخدام ال‬Check Boxes ‫4- انشأنا ال‬ ‫المشيد ليه‬         releasesCheckBox = Qt::CheckBox.new(tr("Releases"))         upgradesCheckBox = Qt::CheckBox.new(tr("Upgrades")) SpinBox ‫5- انشأنا ال‬         hitsSpinBox = Qt::SpinBox.new do |h|             h.prefix = tr("Return up to ")             h.suffix = tr(" results")             h.specialValueText = tr("Return only the first result")             h.minimum = 1             h.maximum = 100             h.singleStep = 10         end ‫ هو ماقبل القيمة الظاهرة‬prefix ‫ال‬ ‫ هو مابعد القيمة الظاهرة‬suffix ‫ال‬ ‫ تقدر تظهره عن اصغر قيمة مقبولة‬string ‫ هو‬specialValueText ‫ال‬ ‫ اصغر قيمة مقبولة‬minimum ‫ال‬ ‫ اكبر قيمة مقبولة‬maximum ‫ال‬
  43. 43. ‫ مقدار الزيادة عند كل ضغطة‬singleStep ‫ال‬ GridLayout ‫نيجى لجزئية ال‬         packagesGroup.layout = Qt::GridLayout.new do |p|             p.addWidget(nameLabel, 0, 0)             p.addWidget(nameEdit, 0, 1)             p.addWidget(dateLabel, 1, 0)             p.addWidget(dateEdit, 1, 1)             p.addWidget(releasesCheckBox, 2, 0)             p.addWidget(upgradesCheckBox, 3, 0)             p.addWidget(hitsSpinBox, 4, 0, 1, 2)         end ‫ بيسمحلك تضيف الويدجتس‬GridLayout ‫ وال‬packagesGroup ‫ داخل ال‬GridLayout ‫هنا بنقول ان فى‬  0 ‫ حاجة مشابهه لجدول وكل مافيها خليا بيبدأ من اعلى اليسار ودى بتبقة الخلية فى الصف‬grid ‫فى‬ 0 ‫والعمود‬ ‫مثل هنا دا عبارة عن 3 صفوف و 5 اعمدة‬ (overloaded ‫ )هتلقيها‬addWidget ‫ استخدم‬grid ‫للضافة داخل‬ addWidget(widget, row, col) addWidget(row, col, rospan, col, colspan) ‫حيث‬ ‫: رقم الصف‬row ‫: رقم العمود‬col row span ‫: ال‬rowspan colspan ‫: ال‬colspan
  44. 44. query page ‫تصميم ال‬ ‫ مرصوصين رأسيا‬button ‫ و‬groupbox 2 ‫هى عبارة عن‬ ‫ مرصوصين رأسيا داخلها‬check boxes 3 ‫ تشمل‬groupbox ‫اول‬ ListWidget ‫الثانية بتشمل‬ class QueryPage < Qt::Widget          def initialize(parent = nil)         super(parent)         updateGroup = Qt::GroupBox.new(tr("Package selection"))         systemCheckBox = Qt::CheckBox.new(tr("Update system"))         appsCheckBox = Qt::CheckBox.new(tr("Update applications"))         docsCheckBox = Qt::CheckBox.new(tr("Update documentation"))              packageGroup = Qt::GroupBox.new(tr("Existing packages"))              packageList = Qt::ListWidget.new         qtItem = Qt::ListWidgetItem.new(packageList)         qtItem.text = tr("Qt")         qsaItem = Qt::ListWidgetItem.new(packageList)         qsaItem.text = tr("QSA")         teamBuilderItem = Qt::ListWidgetItem.new(packageList)         teamBuilderItem.text = tr("Teambuilder")              startUpdateButton = Qt::PushButton.new(tr("Start update"))              updateGroup.layout = Qt::VBoxLayout.new do |u|             u.addWidget(systemCheckBox)             u.addWidget(appsCheckBox)             u.addWidget(docsCheckBox)         end
  45. 45.              packageGroup.layout = Qt::VBoxLayout.new do |p|             p.addWidget(packageList)         end              self.layout = Qt::VBoxLayout.new do |m|             m.addWidget(updateGroup)             m.addWidget(packageGroup)             m.addSpacing(12)             m.addWidget(startUpdateButton)             m.addStretch(1)         end     end end List ‫لحظ لضافة عنصر جديد لل‬         packageList = Qt::ListWidget.new         qtItem = Qt::ListWidgetItem.new(packageList)         qtItem.text = tr("Qt")         qsaItem = Qt::ListWidgetItem.new(packageList)         qsaItem.text = tr("QSA")         teamBuilderItem = Qt::ListWidgetItem.new(packageList)         teamBuilderItem.text = tr("Teambuilder") packagesList ‫ بإسم‬ListWidget ‫هنا انشأنا ال‬ ‫ اللى هيكون‬listWidget object ‫ ونباصى للمشيد ال‬ListWidgetItem ‫ولنشاء عنصر داخلها بنستخدم‬ =text ‫جواها.. وبعد كدا قم بتحديد التكست الظاهر من خلل ال‬ pages.rb lass ConfigurationPage < Qt::Widget          def initialize(parent = nil)         super(parent)         configGroup = Qt::GroupBox.new(tr("Server configuration"))              serverLabel = Qt::Label.new(tr("Server:"))         serverCombo = Qt::ComboBox.new do |c|             c.addItem(tr("Trolltech (Australia)"))             c.addItem(tr("Trolltech (Norway)"))             c.addItem(tr("Trolltech (People's Republic of China)"))             c.addItem(tr("Trolltech (USA)"))         end              serverLayout = Qt::HBoxLayout.new do |s|
  46. 46.             s.addWidget(serverLabel)             s.addWidget(serverCombo)         end              configGroup.layout = Qt::VBoxLayout.new do |c|             c.addLayout(serverLayout)         end              self.layout = Qt::VBoxLayout.new do |m|             m.addWidget(configGroup)             m.addStretch(1)         end     end end class QueryPage < Qt::Widget          def initialize(parent = nil)         super(parent)         updateGroup = Qt::GroupBox.new(tr("Package selection"))         systemCheckBox = Qt::CheckBox.new(tr("Update system"))         appsCheckBox = Qt::CheckBox.new(tr("Update applications"))         docsCheckBox = Qt::CheckBox.new(tr("Update documentation"))              packageGroup = Qt::GroupBox.new(tr("Existing packages"))              packageList = Qt::ListWidget.new         qtItem = Qt::ListWidgetItem.new(packageList)         qtItem.text = tr("Qt")         qsaItem = Qt::ListWidgetItem.new(packageList)         qsaItem.text = tr("QSA")         teamBuilderItem = Qt::ListWidgetItem.new(packageList)         teamBuilderItem.text = tr("Teambuilder")              startUpdateButton = Qt::PushButton.new(tr("Start update"))              updateGroup.layout = Qt::VBoxLayout.new do |u|             u.addWidget(systemCheckBox)             u.addWidget(appsCheckBox)             u.addWidget(docsCheckBox)         end              packageGroup.layout = Qt::VBoxLayout.new do |p|             p.addWidget(packageList)         end     
  47. 47.         self.layout = Qt::VBoxLayout.new do |m|             m.addWidget(updateGroup)             m.addWidget(packageGroup)             m.addSpacing(12)             m.addWidget(startUpdateButton)             m.addStretch(1)         end     end end class UpdatePage < Qt::Widget          def initialize(parent = nil)         super(parent)         packagesGroup = Qt::GroupBox.new(tr("Look for packages"))              nameLabel = Qt::Label.new(tr("Name:"))         nameEdit = Qt::LineEdit.new              dateLabel = Qt::Label.new(tr("Released after:"))         dateEdit = Qt::DateTimeEdit.new(Qt::Date.currentDate())              releasesCheckBox = Qt::CheckBox.new(tr("Releases"))         upgradesCheckBox = Qt::CheckBox.new(tr("Upgrades"))              hitsSpinBox = Qt::SpinBox.new do |h|             h.prefix = tr("Return up to ")             h.suffix = tr(" results")             h.specialValueText = tr("Return only the first result")             h.minimum = 1             h.maximum = 100             h.singleStep = 10         end         startQueryButton = Qt::PushButton.new(tr("Start query"))              packagesGroup.layout = Qt::GridLayout.new do |p|             p.addWidget(nameLabel, 0, 0)             p.addWidget(nameEdit, 0, 1)             p.addWidget(dateLabel, 1, 0)             p.addWidget(dateEdit, 1, 1)             p.addWidget(releasesCheckBox, 2, 0)             p.addWidget(upgradesCheckBox, 3, 0)             p.addWidget(hitsSpinBox, 4, 0, 1, 0)         end     
  48. 48.         self.layout = Qt::VBoxLayout.new do |m|             m.addWidget(packagesGroup)             m.addSpacing(12)             m.addWidget(startQueryButton)             m.addStretch(1)         end     end end ‫ بقة‬Config Dialog ‫نيجى لل‬ configdialog require 'pages.rb' class ConfigDialog < Qt::Dialog          slots 'changePage(QListWidgetItem*, QListWidgetItem*)'          def initialize()         super         @contentsWidget = Qt::ListWidget.new do |c|             c.viewMode = Qt::ListView::IconMode             c.iconSize = Qt::Size.new(96, 84)             c.movement = Qt::ListView::Static             c.maximumWidth = 128             c.spacing = 12         end              @pagesWidget = Qt::StackedWidget.new do |p|             p.addWidget(ConfigurationPage.new)             p.addWidget(UpdatePage.new)             p.addWidget(QueryPage.new)         end              closeButton = Qt::PushButton.new(tr("Close"))              createIcons()         @contentsWidget.currentRow = 0              connect(closeButton, SIGNAL('clicked()'), self, SLOT('close()'))              horizontalLayout = Qt::HBoxLayout.new do |h|             h.addWidget(@contentsWidget)             h.addWidget(@pagesWidget, 1)         end     
  49. 49.         buttonsLayout = Qt::HBoxLayout.new do |b|             b.addStretch(1)             b.addWidget(closeButton)         end              self.layout = Qt::VBoxLayout.new do |m|             m.addLayout(horizontalLayout)             m.addStretch(1)             m.addSpacing(12)             m.addLayout(buttonsLayout)         end              self.windowTitle = tr("Config Dialog")     end          def createIcons         configButton = Qt::ListWidgetItem.new(@contentsWidget) do |c|             c.icon = Qt::Icon.new("images/config.png")             c.text = tr("Configuration")             c.textAlignment = Qt::AlignHCenter             c.flags = Qt::ItemIsSelectable | Qt::ItemIsEnabled         end         updateButton = Qt::ListWidgetItem.new(@contentsWidget) do |u|             u.icon = Qt::Icon.new("images/update.png")             u.text = tr("Update")             u.textAlignment = Qt::AlignHCenter             u.flags = Qt::ItemIsSelectable | Qt::ItemIsEnabled         end         queryButton = Qt::ListWidgetItem.new(@contentsWidget) do |q|             q.icon = Qt::Icon.new("images/query.png")             q.text = tr("Query")             q.textAlignment = Qt::AlignHCenter             q.flags = Qt::ItemIsSelectable | Qt::ItemIsEnabled         end              connect(@contentsWidget,                 SIGNAL('currentItemChanged(QListWidgetItem*, QListWidgetItem*)'),                 self, SLOT('changePage(QListWidgetItem*, QListWidgetItem*)'))     end          def changePage(current, previous)         if current.nil?             current = previous         end
  50. 50.         @pagesWidget.currentIndex = @contentsWidget.row(current)     end end ‫تمام الموضوع بسيط هنعلق على اجزاء منه فقط‬ (List ‫ )ال‬Content Widget ‫1- انشاء ال‬         @contentsWidget = Qt::ListWidget.new do |c|             c.viewMode = Qt::ListView::IconMode             c.iconSize = Qt::Size.new(96, 84)             c.movement = Qt::ListView::Static             c.maximumWidth = 128             c.spacing = 12         end ‫ ليتم عرض ايكونز وحددنا حجم‬IconMode ‫ هيكون‬viewMode ‫حددنا فيها عدة خصائص اهمها ان ال‬ iconSize ‫اليكون بإستخدام‬ ‫ بتاعنا اللى تحدثنا عنه من قبل‬StackedWidget object ‫2- عملنا ال‬         @pagesWidget = Qt::StackedWidget.new do |p|             p.addWidget(ConfigurationPage.new)             p.addWidget(UpdatePage.new)             p.addWidget(QueryPage.new)         end !‫( اللى كتبناها قبل كدا‬widgets (pages ‫وضفناله كل ال‬ ‫ الخاص بأرقام‬ListWidget ‫ )هى ميثود مسئولة عن مل ال‬createIcons ‫ واستدعاء‬button ‫3- انشاء ال‬ (‫الصفحات‬         closeButton = Qt::PushButton.new(tr("Close"))              createIcons() ‫ لول عنصر‬contentsWidget ‫4- تحديد المكان الحالى فى ال‬         @contentsWidget.currentRow = 0 slot clos ‫ بال‬closeButton ‫ الخاصة بال‬clicked signal ‫ربط ال‬        connect(closeButton, SIGNAL('clicked()'), self, SLOT('close()')) createIcons ‫ عادى جدا ولكن عايزين نطلع على‬Layouts ‫5- إضافة ال‬     def createIcons         configButton = Qt::ListWidgetItem.new(@contentsWidget) do |c|             c.icon = Qt::Icon.new("images/config.png")             c.text = tr("Configuration")             c.textAlignment = Qt::AlignHCenter             c.flags = Qt::ItemIsSelectable | Qt::ItemIsEnabled         end
  51. 51. #code omitted...     end ListWidgetItem ‫ للمشيد الخاص ب‬List ‫ زى ماتعلمنا بإننا نباصي ال‬List ‫ فى الل‬Item ‫1-بننشئ‬ Icon object ‫ المستخدمة بإننا نباصي‬icon ‫2- نحدد ال‬ =text. ‫ بإستخدام‬icon ‫ الظاهر مع ال‬text ‫3-نحدد ال‬ =textAlignment ‫4- نحدد المحاذاةبإستخدام‬ =flags ‫ بالقابلية للختيار والتاحة للمستخدم بإستخدام‬flags ‫5- نحدد ال‬ ....‫وهكذا مع باقى العناصر‬ ‫اخيرا ننفذ الفكرة اللى قلناها فى بداية المثال‬         connect(@contentsWidget,                 SIGNAL('currentItemChanged(QListWidgetItem*, QListWidgetItem*)'),                 self, SLOT('changePage(QListWidgetItem*, QlistWidgetItem*)')) ‫ احنا‬SLOT ‫ ب‬currentItemChanged ‫ الخاصة بتغير الختيار‬contentsWidget ‫ القادمة من‬signal ‫نربط ال‬ changePage ‫هنعرفها بإسم‬           def changePage(current, previous)         if current.nil?             current = previous         end         @pagesWidget.currentIndex = @contentsWidget.row(current)     end (: ‫وبس كدا‬ Simple SDI Application
  52. 52. statusbar ‫ و‬text Edit ‫ بسيط فيه منيو وتولبار و‬Text Editor ‫هننشئ‬ application ‫ اللى هيدعمها ال‬slots ‫اول ال‬ slots   'newFile()',      'open()',      'save()',      'saveAs()',      'about()',      'documentWasModified()' ‫ هتتنفذ عند محاولة انشاء ملف فارغ‬newFile ‫ عند محاولة فتح ملف‬open ‫ عند الحفظ‬save, save as ‫ عن البرنامج‬about ‫ عند محاولة عرض‬about ‫ عند حدوث اى تعديل‬documentWasModified attr_reader :curFile @@sequenceNumber = 0 ‫ الحالى‬file ‫: بيعبر عن ال‬curFile ‫ بيعبر عن رقم تلقائى ياخده الملف الجديد‬class variable ‫: عبارة عن‬sequenceNumber@@ def initialize(fileName = "") super()  init() if fileName.empty? setCurrentFile("") else        loadFile(fileName) end end ‫ بتجهز البلكيشن‬init def init()     setAttribute(Qt::WA_DeleteOnClose)     @isUntitled = true     @textEdit = Qt::TextEdit.new     setCentralWidget(@textEdit)     createActions()     createMenus()     createToolBars()     createStatusBar()     readSettings()     connect(@textEdit.document(), SIGNAL('contentsChanged()'),             self, SLOT('documentWasModified()'))

×