Tài liệu Qt Designer và KDevelop­3.0 cho người mới bắt đầu docx

Qt Designer và KDevelop­3.0 cho người mới bắt đầu
Anne­Marie Mahfouf <>
Bản tiếng Đức : Andreas Nicolai
Bản tiếng Nga : Marina Soboleva
Bản tiếng Pháp : Julien Pluton
Bản tiếng Ý : Andrea Benazzo
Bản tiếng Rumani : Laura Afrasine and Claudiu Costin
Phiên bản 0.4 (2004­06­24)
Copyright 2001, 2004 Anne­Marie Mahfouf
Sao chép, phân phối, chỉnh sửa tài liệu này phải tuân theo giấy phép “GNU Free Documentation License”, Version 
1.1 trở lên. Có thể xem bản sao của giấy phép này ở the section entitled "GNU Free Documentation License".
Qt là bộ công cụ được phát triển bởi dự án KDE để phát triển các ứng dụng đồ họa. Tài liệu này 
hướng dẫn cho những người mới bắt đầu cách tạo ra các ứng dụng đơn giản bằng cách kết hợp hai 
công cụ Qt Designer 3.2 (hoặc 3.3) và KDevelop­3.0. Hướng dẫn tạo một chương trình dựa trên 
một chương trình của Jono Bacon và đã được duyệt bởi Daniel Molkentin và Thomas Nagy.
Mục lục
1. Gới thiệu
2. Yêu cầu
Cài đặt Qt Designer
Trong distribution
Tarball hoặc anonymous cvs
Cài đặt KDevelop 3
Trong distribution
Tarball
cvs HEAD
Thuật ngữ
3. Xây dựng chương trình
Khởi tạo project
Tạo framework với KDevelop
Dùng Qt Designer
Thiết kế giao diện

Đặt widget
Spaced out
Signal và slot
Sinh mã
Viết mã cho slot
4. Tóm tắt
5. Tạo bản chuyển ngữ cho các dự án KDE đơn giản
Cài đặt gettext patched cho kde
Chuẩn bị dịch
Make
Biên dịch và cài đặt các file đã được dịch
Tham khảo
6. Một số hướng dẫn
Một vài gợi ý
Đặt tên chương trình
Thực hành
Import dự án vào KDE CVS
Làm thế nào để phát hành chương trình dưới dạng tarball?
Một vài link hữu ích
7. Sinh mã (bổ sung)
 KDevelop không hỗ trợ subclassing
Viết code cho các slot
8. Credits and License
C hương 1. Giới thiệu
Chúng ta sẽ xây dựng một chương trình đơn giản để mô tả cách kế hợp hai công cụ Qt Designer và 
KDevelop. Qua đó xây dựng được các ứng dụng KDE thực sự.
Nếu đã sử dụng quen KDevelop và Qt Designer và chỉ muốn biết làm thế nào để kết hợp chúng lại 
với nhau thì bạn có thể lướt nhanh qua một số chương đầu. 
KDevelop giúp chúng ta xây dưng một ứng dụng KDE hoàn chỉnh bằng cách tự động hoá một số 
khâu như: tạo ra một framework, các file cần thiết, dịch, chạy chương trình… Một dự án KDE sẽ 

sử dụng các công cụ autoconf và automake. KDevelop sẽ tạo ra tất cả các file cần thiết cho chúng 
ta (admin directory, Makefile.cvs, Makefile.am,...). 
C hương 2. Yêu cầu
Để làm theo các hướng dẫn trong các chương sau, chúng ta cần có Qt Designer và KDevelop, và 
các thư viện KDE 3.2.x. Chúng ta sẽ xây dựng một chương trình KDE đơn giản, lấy đầu vào là tên, 
địa chỉ email và chú thích, sau đó xuất ra một chữ kí (Chương trình Signature Creater). 
C ài đặt Qt D esigner
Trong distribution của bạn
Qt Designer là một phần của gói qt­3.2.x. Nếu bạn có bản Qt cũ hơn thì nên update. Tại thời điểm 
viết bài này, bản mới nhất của Qt là 3.3.2. 
Ngoài ra cần cài đặt tất cả các gói liên quan như: qt headers (thường có trong gói devel), Qt 
Designer để thiết kế giao diện (trong một số distribution, phải cài đặt Qt Designer riêng).
Kiểm tra quá trình cài đặt, gõ lệnh shell: 
locate qstring.h 
Nếu thấy /usr/lib/qt3/include/qstring.h là OK
Sau đó, set QTDIR thành /usr/lib/qt3/. Dùng lệnh:
export QTDIR= /usr/lib/qt3 
Tarball hoặc anony m o us cvs
Download tarball ở Trolltech website hoặc dùng cvs theo hướng dẫn ở đây. 
Sau đó phải set QTDIR  như ở trên. Dùng lệnh: 
export QTDIR= /usr/local/qt 
giả sử /usr/local/qt là thư mục cài Qt. Xem thêm file INSTALL.
Dùng lênh sau để dịch: 
./configure ­system­zlib ­qt­gif ­system­libpng ­system­libjpeg \
  ­plugin­imgfmt­mng ­thread ­no­exceptions ­debug ­fast
 make
Không cần dùng lệnh make install. 
Chạy Qt Designer, dùng lệnh: 
/usr/local/qt/bin/designer 
Xem thêm hướng dẫn dịch từ tarball ở đây. 

C ài đặt K Develop 3
Trong distribution
KDevelop­3 thường có sẵn trong distribution. Bản KDevelop trước 3 có tên Gideon..
Nếu chưa có sẵn trong distribution thì bản download source và dịch theo hướng dẫn sau đây. 
tarball
Download KDevelop tại KDevelop website. Khi viết bài này, bản KDevelop mới nhất là 3.0 và 
source version là 3.0.4. Packages mới nhất là kdevelop­3.0.4.tar.bz2, có thể download ở đây. 
Dịch KDevelop 3: cần qt­3.1.0 và kdelibs­3.1.0 trở lên. QTDIR  và KDEDIR trỏ tới thư mục cài 2 gói 
trên. 
Set biến path cho KDE và Qt:
export PATH=$QTDIR/bin:$KDEDIR/bin:$PATH
export LD_LIBRARY_PATH=$QTDIR/lib:$LD_LIBRARY_PATH
Nếu không khởi động được KDevelop, giải pháp có thể có ở forum của KDevelop website. 
Nếu chưa từng sử dụng KDevelop, hãy làm quen với giao diện của KDevelop bằng cách thử tạo và 
dịch một chương trình. 
cvs H E A D
Dùng cvs để có bản mới nhất của KDevelop.
 mkdir KdevelopCVS
 cd KDevelopCVS
 export CVSROOT=:pserver::/home/kde
 cvs login
 (enter for password)
 cvs co kdevelop
Sau khi download xong: 
 make ­f Makefile.cvs
 ./configure ­­prefix='kde­config ­­prefix'
 make
 make install (as root)
Xem thêm hướng dẫn dịch ở  KDevelop website.
T huật ngữ

• Widget: là một thành phần của giao diện đồ hoạ (như cửa sổ, nút, ô nhập kí tự, …). 
• Layout management: miêu tả cách sắp xếp các widget trong một của sổ. Thông thường, các 
widget được đặt ở một vị trí nhất định. Khi user resize cửa sổ, các widget đó cần phải ở 
đúng vị trí và thay đổi kích thước cho phù hợp. Linux hỗ trợ tính năng này bằng cách đặt 
các widget trong layouts. 
• Signal and slot: Signals và slots dung để “liên lạc” giữa các đối tượng. Kĩ thuật signal/slot 
là điểm đặc trưng của Qt. Signals được objects phát ra khi nó thay đổi trạng thái. Slots 
dùng để nhận các signals, nó chỉ đơn giản là một member function. Nhiều signal có thể liên 
kết với một slot cũng như một signal có thể liên kết được với nhiều slot. (Xem thêm 
TrollTech documentation on signals and slots)
C hương 3. X ây dựng chương trình
K hởi tạo project
T ạo fra me work với K D evelop
Framework là cái khung chứa chương trình. Chúng ta sẽ dùng KDevelop để tạo framework. Chạy 
KDevelop, chọn New Project trong menu Project. Trong cửa sổ Application Wizard chọn C++ ­> 
KDE ­> Simple KDE Application. Điền  tên chương trình (SigCreate), tên tác giả,  email (như hình 
1). 
Click Next. Click Finish. KDevelop sẽ tạo các file cần thiết để dịch project. Ta có thể dung file 
selector để xem code của 3 files which are main.cpp, sigcreate.cpp and sigcreate.h (hình 2). 
Dịch thử chương trình: Chọn Build ­> Run automake & friends rồi Build ­> Run configure. Nếu trong của 
sổ Messages output window có dòng sau là được: 
" Good ­ your configure finished. Start make now
*
* *** Success ***
Khi đó có thể "make" bằng cách chọn Build ­> Build Project (hoặc F8). Rồi chọn Build ­> Install. Rồi Build 
­> Execute program (or F9). Khi chương trình chạy, ta có thể thấy cửa sổ như hình 3. 
Picture 3: The KDE Simple Application 
Bây giờ, sau khi đã có framework, chúng ta bắt tay vào viết chương trình
Có thể set QTDIR và KDEDIR trong menu Project ­> Project Options... ­> Configure Options. 
Picture 6: Project Options 

D ù ng Qt D esigner
Qt Designer là công cụ để thiết kế và sinh mã tạo giao diện chương trình. Dùng Qt Designer, có 
thể sắp xếp các widget, tạo layout một cách hợp lí (xem thêm Qt Designer manual). Qt Designer 
cũng có code editor nhưng chúng ta sẽ dùng KDevelop để edit và modify code. 
Bây giờ chúng ta sẽ tạo giao diện chương trình bằng Qt Designer. Các form của Qt Designer được 
save trong các file .ui và dùng chương trình uic để tạo các file .h và .cpp tương ứng (công việc này 
được KDevelop đảm nhiệm).
C h ú  ý
Mỗi khi add/remove một file trong KDevelop project, Makefile.am sẽ bị thay đổi bởi KDevelop. Ta phải 
Run automake & friends sau mỗi thay đổi đó. 
Trong KDevelop, chọn File ­> New. Điền tên file: sigcreatedlg, chọn Widget (.ui) trong combo 
box. Check "Add to project" để KDevelop tự động update file Makefile.am. 
Click the Ok button. The Automake manager dialog then pops up. 
Click the OK button. 
Nếu file  sigcreatedlg.ui  không được mở trong Qt Designer, chọn Automake Manager, right­
click file và chọn Open With, chọn Qt Designer. 
C h ú  ý
Về cách đặt tên: tên của một dialog nên kết thúc bằng dlg. sigcreatedlg cho biết rằng nó là một 
dialog và chỉ là một lớp tạo giao diện.
Giao diện của Qt Designer có thể chia ra làm 3 khu vực chính. Bên trái là toolbox (ta có thể chọn các widget 
ở đây). Bên phải, quan trọng nhất là Property Editor dialog để điều chỉnh các thuộc tính của widget (resize, 
đổi màu, …). Ở giữa là cửa sổ thiết kế. 
C h ú  ý
Sau khi tạo file sigcreatedlg.ui, phải chạy Run Automake & friends và Run configure trước khi 
build, để chắc chắn là file Makefile.am mới đã được sử dụng. 
T hiết kế giao diện chương trình
Chúng ta sẽ thiết kế một chương trình có giao diện như hình dưới. Đó là một cửa sổ với một số 
widget để user điền các thông tin cần thiết. Khi thiết kế chương trình ta phải đứng trên quan điểm 
của user để tạo sự tiện lợi cho user khi sử dụng. 
Chương trình này sẽ tạo ra chữ kí và hiển thị trên màn hình. User điền tên, địa chỉ email và chọn 

comment. Sau đó click Create! và chương trình sẽ sinh chữ kí trong một MultiLineEdit widget. 
Click Cancel để thoát khỏi chương trình 
C h ú  ý
Chương trình này chỉ dùng để ví dụ, nó khác xa thực tế.