GTK+3快速入门——第一个程序

创建项目目录
==========

$ cd src
$ mkdir gtk+
$ cd gtk+
$ mkdir empty-window
$ cd empty-window

编写程序
=======

$ gvim window-default.c
文件内容见附件

编译项目
=======

$ gcc `pkg-config –cflags gtk+-3.0` -o window-default window-default.c `pkg-config –libs gtk+-3.0`

错误处理
——-

如果出现“Package gtk+-3.0 was not found in the pkg-config search path.”错误,那么需要安装libgtk-3-dev(Development files for the GTK+ library),命令如下:

$ sudo aptitude install libgtk-3-dev

运行程序
=======

$ ./window-default

运行结果是一个标题为“window-default”的空白窗口,截图:

http://developer.gnome.org/gtk3/stable/window-default.png

参考资料
=======

* Getting Started with GTK+
+ http://developer.gnome.org/gtk3/stable/gtk-getting-started.html

附件
====

文件window-default.c的内容如下:


#include <gtk/gtk.h>

int main(int argc, char *argv[]){
GtkWidget *window;

gtk_init(&argc, &argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
g_signal_connect(window, "destroy", G_CALLBACK(gtk_main_quit), NULL);
gtk_widget_show(window);
gtk_main();

return 0;
}

在Qt上绑定SQLCipher

出处:http://www.google.com/url?sa=D&q=http://www.wiki.crossplatform.ru/index.php/%25D0%259F%25D1%2580%25D0%25B8%25D0%25B2%25D1%258F%25D0%25B7%25D0%25BA%25D0%25B0_SQLCipher_%25D0%25BA_Qt%23.D0.9E.D0.B1.D1.81.D1.83.D0.B6.D0.B4.D0.B5.D0.BD.D0.B8.D0.B5
(使用Google Translate翻译,然后人工整理)

SQLCipher简介
================

SQLCipher是一个开源的跨平台的SQLite扩展。SQLCipher只在数据库读取时解密,在数据库写入时加密,因此提供了一个完全加密的SQLite数据库。SQLCipher在后台解决了SQLite数据库加密的问题,你不需要掌握特别的知识,可以直接使用SQL的标准API。

更多关于SQLCipher的信息请访问官方网站:
http://www.zetetic.net/software/sqlcipher

准备整合
==========

为了在Qt应用程序中使用SQLCipher,我们需要重新创建qsqlite插件。

# 拷贝一份qsqlite插件的源代码
$ cd QTDIR/src/plugins/sqldrivers
$ cp -rf sqlite sqlcipher

安装和配置SQLCipher
=====================

安装和配置SQLCipher(Linux)
—————————

获取SQLCipher的最新源代码。先安装Git,然后执行:

$ git clone git://github.com/sjlombardo/sqlcipher.git

接下来编译安装SQLCipher(别忘了修改–prefix):

$ ./configure –prefix=/home/user/qtsdk/qt/src/plugins/sqldrivers/sqlcipher CFLAGS=”-DSQLITE_HAS_CODEC” LDFLAGS=”-lcrypto”
$ make
$ make install

现在,在~/qtsdk/qt/src/plugins/sqldrivers目录下我们拥有bin, include, lib目录,在此基础上我们就可以编译Qt插件了。

安装和配置SQLCipher(Windows)
—————————–

安装额外的软件
+++++++++++++++

下载安装MSYS。在安装结束时会问几个问题,选择同意并设置MinGW的路径(Qt提供的版本)。

http://downloads.sourceforge.net/mingw/MSYS-1.0.11.exe

下载安装Win32 OpenSSL v0.9.8m,安装过程中不要改变dll文件安装路径。

http://www.slproweb.com/download/Win32OpenSSL-0_9_8m.exe

下载安装TclTk(MinGW版)。在安装过程中指定MinGW的路径。找到文件MINGWPATH/bin/tclsh84.exe并重命名为tclsh.exe。

http://downloads.sourceforge.net/mingw/tcltk-8.4.1-1.exe

设置MSYS
+++++++++++

安装后完成后,我们还需要修改fstab文件,它位于etc目录下(即C:\msys\1.0\etc)。确保存在以下挂载点:

c:/Qt/2010.05/mingw /mingw
c:/Qt/2010.05/qt /qt
c:/ /c
(左侧路径可能需要修改)

配置和编译SQLCipher
+++++++++++++++++++++

要创建SQLCipher,我们需要启动MSYS并执行以下操作:

$ cd sqlcipher
$ ./configure –prefix=/qt/src/plugins/sqldrivers/sqlcipher –disable-tcl –disable-amalgamation
CFLAGS=”-DSQLITE_HAS_CODEC -DSQLITE_TEMP_STORE=2 -I/c/OpenSSL/include /c/Windows/System32/libeay32.dll -L/c/OpenSSL/lib/MinGW”
LDFLAGS=”-leay32″
$ make
$ make dll
$ make install
$ cp /c/OpenSSL-Win32/lib/MinGW/libeay32.a /qt/src/plugins/sqldrivers/sqlcipher/lib/

为Qt创建一个新的SQL插件
=======================

切换到之前创建的Qt新的SQL插件的目录下:

$ cd ~/qtsdk/qt/src/plugins/sqlcipher

重命名项目文件:

$ mv sqlite.pro sqlcipher.pro

用文本编辑器打开sqlcipher.pro,进行如下修改:

TARGET = qsqlcipher

HEADERS = ../../../sql/drivers/sqlite/qsql_sqlite.h
SOURCES = smain.cpp \
../../../sql/drivers/sqlite/qsql_sqlite.cpp

!system-sqlite:!contains( LIBS, .*sqlite.* ) {
CONFIG(release, debug|release):DEFINES *= NDEBUG
DEFINES += SQLITE_OMIT_LOAD_EXTENSION SQLITE_OMIT_COMPLETE

INCLUDEPATH += include

win32 {
LIBS += ./lib/libsqlite3.a ./lib/libeay32.a
}
unix {
QMAKE_RPATHDIR += lib
LIBS += -Llib -lsqlite3
}
} else {
LIBS *= $$QT_LFLAGS_SQLITE
QMAKE_CXXFLAGS *= $$QT_CFLAGS_SQLITE
}

include(../qsqldriverbase.pri)

修改smain.cpp文件:

#include
#include
#include “../../../../src/sql/drivers/sqlite/qsql_sqlite.h”

QT_BEGIN_NAMESPACE

class QSqlCipherDriverPlugin : public QSqlDriverPlugin
{
public:
QSqlCipherDriverPlugin();

QSqlDriver* create(const QString &);
QStringList keys() const;
};

QSqlCipherDriverPlugin::QSqlCipherDriverPlugin()
: QSqlDriverPlugin()
{
}

QSqlDriver* QSqlCipherDriverPlugin::create(const QString &name)
{
if (name == QLatin1String(“QSQLCIPHER”)) {
QSQLiteDriver* driver = new QSQLiteDriver();
return driver;
}
return 0;
}

QStringList QSqlCipherDriverPlugin::keys() const
{
QStringList l;
l << QLatin1String("QSQLCIPHER"); return l; } Q_EXPORT_STATIC_PLUGIN(QSQLiteDriverPlugin) Q_EXPORT_PLUGIN2(qsqlcipher, QSqlCipherDriverPlugin) QT_END_NAMESPACE 编译插件: $ ~/qtsdk/qt/bin/qmake $ make $ make install 现在在~/qtsdk/qt/plugins/sqldrivers目录下我们可以看到libqsqlcipher.so文件,这就是我们需要的数据库驱动。 创建一个测试程序 ================ $ cd /home/user/qtsdk/qt/examples/sql/sqlwidgetmapper 我们在Qt的sqlwidgetmapper的标准例子的基础上创建我们的测试程序。我们只需要修改window.cpp文件的setupModel方法: void Window::setupModel() { QSqlDatabase db = QSqlDatabase::addDatabase("QSQLCIPHER"); if (!QFile::exists("test.db")) { db.setDatabaseName("test.db"); if (!db.open()) { QMessageBox::critical(0, tr("Cannot open database"), tr("Unable to establish a database connection.\n" "This example needs SQLCipher support."), QMessageBox::Cancel); return; } QSqlQuery query; query.exec("pragma key = '12345';"); query.exec("create table person (id int primary key, " "name varchar(20), address varchar(200), typeid int)"); query.exec("insert into person values(1, 'Alice', " "'123 Main Street
Market Town
‘, 101)”);
query.exec(“insert into person values(2, ‘Bob’, ”
“‘PO Box 32
Mail Handling Service”

Service City
‘, 102)”);
query.exec(“insert into person values(3, ‘Carol’, ”
“‘The Lighthouse
Remote Island
‘, 103)”);
query.exec(“insert into person values(4, ‘Donald’, ”
“‘47338 Park Avenue
Big City
‘, 101)”);
query.exec(“insert into person values(5, ‘Emma’, ”
“‘Research Station
Base Camp

“Big Mountain
‘, 103)”);
//! [Set up the main table]

//! [Set up the address type table]
query.exec(“create table addresstype (id int, description varchar(20))”);
query.exec(“insert into addresstype values(101, ‘Home’)”);
query.exec(“insert into addresstype values(102, ‘Work’)”);
query.exec(“insert into addresstype values(103, ‘Other’)”);
} else {
db.setDatabaseName(“test.db”);
if (!db.open()) {
QMessageBox::critical(0, tr(“Cannot open database”),
tr(“Unable to establish a database connection.\n”
“This example needs SQLCipher support.”),
QMessageBox::Cancel);
return;
}

QSqlQuery query;
query.exec(“pragma key = ‘12345’;”);

{//===-Test-===
query.exec(“select * from addresstype;”);
if (query.lastError().type() != QSqlError::NoError) {
QMessageBox::critical(0, tr(“Cannot open database”),
tr(“%1”).arg(query.lastError().text()), QMessageBox::Cancel);
return;
}
}
}

model = new QSqlRelationalTableModel(this);
model->setTable(“person”);
model->setEditStrategy(QSqlTableModel::OnManualSubmit);

typeIndex = model->fieldIndex(“typeid”);

model->setRelation(typeIndex,
QSqlRelation(“addresstype”, “id”, “description”));
model->select();
}

然后运行程序:

$ ~/soft/qtsdk-2010.02/qt/bin/qmake
$ make

$ ./sqlwidgetmapper

关闭程序,打开test.db文件,我们可以看到所有数据都被加密了。如果注释掉query.exec(“pragma key = ‘12345’;”);这个语句,再次启动程序时,我们将遇到一个错误提示。

最流行的CSS框架Blueprint简介

Blueprint是当前互联网上最流行的CSS框架,它的缩写是BP。Blueprint框架是为了节约开发时间而设计的,我们可以在Blueprint框架的基础上构建我们的CSS。对于每个页面都有独特设计的网站,Blueprint框架最为适用。

通过学习Blueprint框架源代码包tests目录下网页的源代码,我们可以快速掌握Blueprint的特性。和一般意义上的框架不同,Blueprint不会告诉我们应该如何组织或编写CSS,它更像一个工具箱,我们可以根据需要选用。

Blueprint框架有三个组成部分:首先是重置CSS,移除了不同Web浏览器设置的CSS默认规则;二是排版规则,提供良好的默认排版效果和颜色;三是栅格,提供了用于创建栅格布局的CSS类。

除此之外,Blueprint框架还提供了两个脚本Compressor和Validator。Compressor脚本用于压缩和定制Blueprint源文件。Validator脚本用于校验Blueprint核心文件。这两个脚本都是用Ruby编写的。

具体的用法如下(请按照屏幕提示操作):

$ sudo aptitude install ruby rubygems
$ sudo gem install bundler
$ cd ~/src/blueprint/lib
$ ruby validate.rb
$ ruby compress.rb

使用Blueprint框架的第一步,是在网页中包含screen.css、print.css和ie.css这3个文件。screen.css提供了显示器、投影机显示所需的CSS,print.css提供了打印所需的CSS,ie.css提供了针对IE浏览器的补丁。

具体的代码如下:

注意,不要修改Blueprint框架的源代码,当我们需要改变HTML元素的CSS时,我们应该在自己的CSS文件中编写或修改。这样,当Blueprint框架有新版本推出时,我们就可以无痛升级了。

下面简要介绍一下Blueprint框架的排版规则。Blueprint提供下面这些类,用于定制排版效果:

.smaller:让元素文本显示得更小
.larger:让元素文本显示得更大
.hide:隐藏元素
.quiet:柔化元素文本的颜色
.loud:让元素文本显示为黑色
.highlight:把文本背景颜色设置为黄色
.added:把文本背景颜色设置为绿色
.removed:把文本背景颜色设置为红色
.first:移除元素左侧的margin和padding
.last:移除元素右侧的margin和padding
.top:移除元素顶部的margin和padding
.bottom:移除元素底部的margin和padding

我们还可以使用下面这些类来定制表单的显示效果:

.text:让文本输入框的文本显示为正常大小
.title:让文本输入框的文本显示得更大
div.error:创建红色的错误消息框
div.notice:创建黄色的提示消息框
div.success:创建绿色的成功消息框

通过Blueprint框架提供的栅格CSS类,我们可以建立任何一种栅格布局的网站。默认的栅格有24列,每一列宽30px,列与列之间的margin是10px,总的宽度是950px。默认的栅格在1024×768分辨率下显示效果良好。

Blueprint框架的栅格CSS类包括:

.span-x:x为1~24。定义一个宽度为x列的栏。
.append-x:x为1~23。在当前栏右侧插入一个宽度为x的空白栏。
.prepend-x:x为1~23。在当前栏左侧插入一个宽度为x的空白栏。
.push-x:x为1~24。把当前栏左移x列。
.pull-x:x为1~24。把当前栏右移x列。
.border:设置当前栏的右边框线。
.colborder:定义一个中间带有边框线的空白栏。
.clear:强制把当前栏下移一列。
.showgrid:在container或当前栏显示栅格线。

下面代码定义了栅格布局的页面,除了页头和页尾外,具有3栏布局,两个边栏的宽度是中间内容的1/4。

The header

The center column

需要注意的是,Blueprint框架要求把所有页面内容都放在

之间,也就是说body内就应该是这个div。其次,除宽度为24列的栏(使用.span-24类)外,每一行的最后一栏必须带有.last类。

下面的代码展示了.append类和.border类的用法:

The first column with right border
The second column with a 4-column empty column on the right side
The third column with right border
The fourth (last) column

下面的代码展示了嵌套栅格布局的用法:

Top left
Top right
Bottom left
Bottom right
Second half of page

实践是学习Blueprint框架的最好方法,现在就让我们开始动手试试吧!

更新:Blueprint框架使用实例
海淀驾校

参考资料:
Blueprint Tutorial
https://github.com/joshuaclayton/blueprint-css/wiki/Quick-start-tutorial