图形界面应用程序设计


目录

课题要求 .................................................................................................. 1 一.课题目的 ............................................................................................. 1

二.运行环境 ............................................................................................. 1 正文 .......................................................................................................... 1

一.课题分析 ............................................................................................. 1 二.方案设计 ............................................................................................. 1

(一)安装与建立 Qt 桌面运行环境 ............................. 1

(二)使用 Qt Designer 编写程序、编译、本机上运行 ............ 4

(三)移植 QT/E 到 ARM 设备 .................................. 9

三.技术实现问题 ....................................................................................11

(一)通过 FTP 向开发板传送可执行文件........................ 11

(二)释放用户权限 ......................................... 11

四.总结与体会 ........................................................................................11

设计性实验报告成绩:

指导教师签名: ....... 11

课题要求
一.课题目的
了解在 Linux 下安装 Qt 的基本步骤。学会在 Qt 环境在 X11 平台下程序设计的方法。 学会在使用 Qt Designer 编写程序,编译,本机上运行。学会 QT/E 在 ARM 设备上的移 植方法与步骤。学习 QT 中信号与槽的编程。掌握 QT/E 在 ARM 设备上的常用输入输出 设备移植方法。设计一个简单图形界面的应用。
二.运行环境
硬件:up-Star 认证考试实践板、PC 机 Pentumn500 以上, 硬盘 80G 以上。 软件:PC 机操作系统 RHEL4 +xshell + ARM-Linux 开发环境 qt-embedded-linux-opensource-src-4.4.0.tar.bz2 tslib-1.4.tar.bz2 arm-linux-gcc-3.4.1.tar.bz2
正文
一.课题分析
图形界面应用程序设计这一课题实现过程相对较复杂,从 Qt 的安装到最终的移植实现 大致要经过三个步骤。首先,在 Linux 下安装与建立 Qt 桌面运行环境;其次,熟悉 Qt Designer,并使用 Qt Designer 编写程序、编译,在本机运行;最后,移植 QT/E 到 ARM 设备。
二.方案设计
(一)安装与建立 Qt 桌面运行环境
编译 QT-X11 环境: 将/up-Star2410/gui/Qt/src 下实验用到的三个文件拷贝到/home/sprife/for_pc 目录
下。拷贝库文件: #cd /home/
1

#mkdir sprife //新建文件夹 sprife

#cd sprife

//打开文件夹 sprife

#mkdir for_pc

#cd for_pc

#cp /up-Star2410/gui/Qt/src/qt-x11-opensource-src-4.4.0.tar.gz ./ //拷贝文件

安装编译器 arm-linux-gcc-3.4.1:

[root@BC src]#cd /up-Star2410/gui/Qt/tools //打开 tools 文件夹

[root@BC tools]#tar xjvf arm-linux-gcc-3.4.1.tar.bz2 -C ./ //解压缩文件

[root@BC tools]#vi /root/.bash_profile //打开文件

将 该 文 件 中 的 PATH 变 量 改 为 PATH=$PATH:$HOME/bin:/up-Star2410/gui/Qt/tools

/usr/local/arm/3.4.1/bin/,存盘后退出。

[root@BC tools]# source /root/.bash_profile

如果安装正确的话,在任意路径下输入 ar 后按 Tab 键即可列出编译器文件。

Qt 本机环境的搭建:

#cd /home/sprife/for_pc

#tar xzvf qt-x11-opensource-src-4.4.0.tar.gz //文件解压缩

#cd qt-x11-opensource-src-4.4.0

#./configure -prefix /usr/local/Trolltech/Qt-x11-4.4.0 //对 Qt 进行配置

出现安装提示时选择 yes 注意大小写

#gmake

//编译 QT 环境

#gmake install //安装 QT 环境

以上各步都成功编译通过后,通过运行 Qt/Embedded 自带的 demo 来查看运行结果。

#cd /home/sprife/for_pc/qt-x11-opensource-src-4.4.0/examples/widgets/wiggly/

#./wiggly

//运行可执行文件

运行结果如图 1:

2

图1 Hello ,QT!程序设计:
在已经建立好了在本机上开发Qt 应用程序环境下,编写一个“Hello ,QT!”的程序来 了解Qt 程序设计。 建立一个名为 hello 的目录,在目录下建立一个名为 hello.cpp 的 c++源文件: #cd /home/sprife/ #mkdir hello #vi hello.c 编辑 hello.cpp 源文件,填入程序代码,如图 2:
图2 第 1 行和第 2 行包含了两个类的定义:QApplication 和 QLabel。对于每一个 Qt 的类,都会有一个同名的头文件,头文件里包含了这个类的定义。 第 3 行是程序的入口。几乎在使用 Qt 的所有情况下,main()函数只需要在把控制权 转交给 Qt 库之前执行一些初始化,然后 Qt 库通过事件来向程序告知用户的行 为。argc
3

是命令行变量的数量,argv 是命令行变量的数组。这是一个 C/C++特征。它不是 Qt 专 有的,无论如何 Qt 需要处理这些变量
第 5 行定义了一个 QApplication 对象 App。QApplication 管理了各种各样的应用 程序的广泛资源,比如默认的字体和光标。App 的创建需要 argc 和 argv 是因为Qt 支 持一些自己的命令行参数。在每一个使用 Qt 的应用程序中都必须使用一个QApplication 对象,并且在任何 Qt 的窗口系统部件被使用之前创建此对象是必须的。App 在这里被创 建并且处理后面的命令行变量(比如在 X 窗口下的-display) 。需注意,所有被 Qt 识 别的命令行参数都会从 argv 中被移除(并且 argc 也因此而减少) 。
第 6 行创建了一个 QLabel 窗口部件(widget) ,用来显示“Hello,Qt!” 。 第 7 行使我们创建的 QLabel 可见。当窗口部件被创建的时候,它总是隐藏的,必须 调用 show()来使它可见。通过这个特点我们可以在显示这些窗口部件之前定制它们,这 样就不会出现闪烁的情况。 第 8 行就是 main()将控制权交给 Qt。在这里,程序进入了事件循环。事件循环是一 种 stand-by 的模式,程序会等待用户的动作(比如按下鼠标或者是键盘) 。用户的动 作将会产生程序可以做出反应的事件(也被称为“消息” ) 。程序对这些事件的反应通 常是执行一个或几个函数。 为了简单起见,我们没有在 main()函数的结尾处调用 delete 来删除 QLabel 对象。这种内存泄露是无害的,因为像这样的小程序,在结束时操作系统 将会释放程序占用的内存堆。
编译、运行程序,如图 3:

#/home/sprife/for_pc/qt-x11-opensource-src-4.4.0/bin/qmake -project

#/home/sprife/for_pc/qt-x11-opensource-src-4.4.0/bin/qmake

#make

#./hello

//执行程序

图3
(二)使用 Qt Designer 编写程序、编译、本机上运行
使用Qt Designer实现一个对话框,包括以下步骤:
4

1)、创建并初始化子窗口部件。 2)、将子窗口部件放置到布局当中。 3)、对Tab 的顺序进行设置。 4)、放置信号和槽的连接。
5)、完成对话框的通用槽的功能。

编写 QT-X11 程序

进入QT for X11 目录中进行设计

[root@vm-dev ~]# cd /home/sprife/for_pc/

[root@vm-dev for_pc]# mkdir testqt-x11

//建立实验目录

[root@vm-dev for_pc]# cd testqt-x11/

//打开文件夹

[root@vm-dev testqt-x11]#

使用designer 编辑程序控件:

[root@vm-dev testqt-x11]#

/home/sprife/for_pc/qt-x11-opensource-src-4.4.0/bin/designer //运行Qt Designer

在弹出designer 界面,可以看到在窗口左上方有一个“templates\forms”的菜单,

下面有四个可供选择的模板。第一个和第二个都是对话框,区别在于对话框中按钮的位置

不同。第三个是主窗口,第四个是窗口部件。一般我们选择Widget 就可以了。

选择一个窗口布局Widget 点击->创建,如图4 和图5:

图4
5

图5 拖拽几个简单的控件(TextEdit、PushBotton、TextLabel)进行界面设计,初始化控件及 相关属性内容,如图6:
图6 建立信号与槽的连接,在弹出窗口中,show 按钮与文本编辑框的连接clicked->clear, 如图7:
6

图7 同样建立第二组信号与槽的连接,在弹出窗口,exit 按钮与Form 的连接licked->closed, 图8:

图8

退出界面编辑保存为UI 格式 testx11.ui。

[root@vm-dev testqt-x11]# ls //查看文件夹下内容

testx11.ui

在/home/sprife/for_pc/testqt-x11路径下新建main.cpp文件。

编辑main.cpp 函数:

[root@vm-dev testqt-x11]# vi main.cpp //打开文件

#include "ui_testx11.h"

//界面文件生成的头文件

7

int main(int argc, char *argv[])

//程序入口

{

QApplication app(argc, argv);

//创建QApplication类对象app

QWidget *widget = new QWidget;

Ui::Form ui;

ui.setupUi(widget);

widget->show();

//显示

return app.exec();

//退出

}

[root@vm-dev testqt-x11]# ls

//查看文件夹内容

main.cpp testx11.ui

[root@vm-dev testqt-x11]#

编译程序生成工程文件.pro:

[root@vm-dev testqt-x11]#

/home/sprife/for_pc/qt-x11-opensource-src-4.4.0/bin/qmake -project

[root@vm-dev testqt-x11]# ls

testqt-x11.pro testx11.ui main.cpp

编译生成Makefile 文件:

[root@vm-dev testqt-x11]#

/home/sprife/for_pc/qt-x11-opensource-src-4.4.0/bin/qmake

[root@vm-dev testqt-x11]# ls

Makefile testqt-x11.pro testx11.ui main.cpp

编译生成可执行文件:

[root@vm-dev testqt-x11]# make

[root@vm-dev testqt-x11]# ls

main.cpp main.o Makefile testqt-x11 testqt-x11.pro testx11.ui

ui_testx11.h

执行编译好的程序测试下观察效果,如图 9

[root@vm-dev testqt-x11]# ./testqt-x11

图9
8

(三)移植 QT/E 到 ARM 设备
编译QT/E 环境
1、拷贝并解压QT/E 库及触摸屏库到实验目录for_arm #cd /home/sprife/ #mkdir for_arm #cd for_arm #cp /up-Star2410/gui/Qt/src/qt-embedded-linuxopensourcesrc-4.4.0.tar.bz2 ./ #cp /up-Star2410/gui/Qt/src/tslib-1.4.tar.bz2 ./ #tar xjvf qt-embedded-linux-opensource-src-4.4.0.tar.bz2 #tar xjvf tslib-1.4.tar.bz2 2、编译tslib1.4 触摸屏库 #cd tslib-1.4 #vi build.sh 修改该脚本文件为如下: #/bin/sh export CC=arm-linux-gcc ./autogen.sh echo "ac_cv_func_malloc_0_nonnull=yes" >arm-linux.cache ./configure --host=arm-linux --cache-file=arm-linux.cache -prefix=$PWD/../tslib1.4-install make make install 退出保存后编译: #./build.sh 3、编译QT/E 库 #cd /home/sprife/qt4/for_arm/ #cp -a tslib1.4-install/lib/* qt-embedded-linux-opensource-src-4.4.0/lib/ #cp -a tslib1.4-install/include/ts* qt-embedded-linux-opensource-src-4.4.0/include/ #cd qt-embedded-linux-opensource-src-4.4.0 #./configure -embedded arm -xplatform qws/linux-arm-g++ -depths 16-little-endian -qt-mouse-linuxtp -qt-mouse-tslib-I/home/sprife/qt4/for_arm/tslib1.4-install /include –L/home/sprife/qt4/for_arm/tslib1.4-install/lib -prefix /mnt/nfs/Trolltech/qt-embedded-4.4.0 #make #make install
编译QT/E 程序到ARM 设备上运行
在/home/sprife/路径下新建for_arm文件夹, 将/home/sprife/for_pc/路径下
9

testqt-x11文件夹拷贝到for_arm文件夹中。

编译QT/E 程序:

#cd /home/sprife/for_arm/

//进入目标文件夹

#cp /home/sprife/for_pc/testqt-x11/ . –arf //拷贝文件夹

#cd testqt-x11/

#/home/sprife/for_arm/qt-embedded-linux-opensource-src-4.4.0/bin/qmake –

project

//编译程序生成工程文件.pro

#/home/sprife/for_arm/qt-embedded-linux-opensource-src-4.4.0/bin/qmake

//编译生成Makefile 文件

#make

//编译生成可执行文件

ARM 端挂载mnt共享目录:

#mount –t nfs -o nolock 192.168.1.118:/home/sprife/for_pc/testqt-x11 /mnt

拷贝编译好的QT/E 程序到QT4Embedded文件夹:

#cd QT4Embedded

#cp /mnt/testqt-x11 . / –arf

输入以下命令对相关环境参量进行修改:

up-tech:~/QT4Embeded #vi qtg4demo.sh

参量修改如下:

export QTDIR=$PWD

export LD_LIBRARY_PATH=$PWD/lib:/lib

export QTDIR=$PWD

export TSLIB_TSDEVICE=/dev/event0

export TSLIB_PLUGINDIR=$PWD/lib/ts

export TSLIB_CONSOLEDEVICE=none

export QT_TSLIBDIR=$PWD/lib

export TSLIB_CONFFILE=$PWD/etc/ts.conf

export POINTERCAL_FILE=$PWD/etc/ts-calib.conf

export QWS_MOUSE_PROTO=tslib:/dev/event0

export TSLIB_CALIBFILE=$PWD/etc/ts-calib.conf

export QT_QWS_FONTDIR=$PWD/lib/fonts

export LANG=zh_CN

export QWS_DISPLAY="LinuxFb:mmWidth160:mmHeight120:0"

/root/QT4Embeded/testqt-x11 –qws ~ ~ ~ ~ - qtg4demo.sh 1/17 5%

//修改参量行

查看、运行可执行文件:

up-tech:~/QT4Embeded #ls

demo

etc

lib

up-tech:~/QT4Embeded #./qtg4demo.sh

paiwei

qtg4demo.sh testqt-x11

10

执行文件后,开发板上可观察到与图9相同界面窗口,在触摸屏上点击show便可清除文 本框内容(点击exit退出执行界面)。
三.技术实现问题
(一)通过 FTP 向开发板传送可执行文件
由于ARM 端挂载mnt共享目录时常出现挂在不上的问题,我们采用以FTP上传的方式将 可执行文件送到开发板,来达到同一目的。
首先,在Windows系统下,利用LeadFTP以登录名phy、密码123456登录虚拟机IP,选择 路径,将编译生成的可执行文件下载到指定文件夹。然后,再利用LeadFTP匿名登录开发 板IP,将刚下载的可执行文件上传至pub文件夹中。最后,再在Xshell上将pub中可执行文 件拷贝到执行目录下运行。拷贝语句如下: #cd /QT4Embedded/ #cp /var/ftp/pub/testqt-x11 . / –arf
在这里还应注意,若pub文件夹下已有需上传的同名文件是不能够覆盖掉的,同时也不 能直接在这里删除,文件的删除必须在Xshell下利用如下语句完成: #cd / var/ftp/pub/ #rm testqt-x11 删除完成后,重新上传即可。
(二)释放用户权限
在程序运行过程中,我们还遇到了用户权限不够的问题,在这里我们的解决方法是在 Xshell下利用如下语句来对用户权限进行释放: #chmod 777 testqt-x11
四.总结与体会

设计性实验报告成绩:

指导教师签名:

11


相关文档

8 第七讲 图形界面程序设计(基础)
04747Java语言程序设计(一)-图形界面设计(一)
第13章 Qt图形界面程序设计
Java语言程序设计4-1-java第4章$(图形界面-applet的生命周期-在HTML中使用Applet)
Qt动态生成图形界面程序的设计与实现
赵宏宇J2EE程序设计(第五章Java图形界面与事件响应)2006年8月
第13章 gtk+图形界面程序设计
第14章 Qt图形界面程序设计
面向对象之类与对象 - 图形界面程序设计
第12章 Gtk+图形界面程序设计
电脑版