布局练习之计算器

接下来,我们做一个布局练习,如下图:

我们用表格布局实现,表格布局参考坐标如下:

这里我们用到行编辑控件( GtkEntry )。

行编辑的创建:

GtkWidget * gtk_entry_new(void);

返回值:行编辑指针行

编辑内容的设置:

void gtk_entry_set_text (GtkEntry *entry,

const gchar *text);

entry: 行编辑

text: 需要设置的内容

设置行编辑是否允许编辑:

void gtk_editable_set_editable(GtkEditable *editable,

gboolean is_editable);

editable:行编辑

is_editable:TRUE代表可编辑,FALSE不允许编辑

完整代码如下:

#include <gtk/gtk.h> 	// 头文件

int main( int   argc, char *argv[] )
{
	gtk_init (&argc, &argv); 	// 初始化

	// 窗口的操作
	GtkWidget *window = gtk_window_new (GTK_WINDOW_TOPLEVEL); 	 // 创建窗口
	gtk_widget_set_size_request(window, 270, 320);

	// 表格的操作
	GtkWidget *table = gtk_table_new(5, 4, TRUE);   // 表格布局,5行4列  

	// 行编辑的操作
	GtkWidget *entry = gtk_entry_new();		// 行编辑的创建
	gtk_entry_set_text(GTK_ENTRY(entry), "2+2=4");	// 给行编辑设置内容
	gtk_editable_set_editable(GTK_EDITABLE(entry), FALSE);// 设置行编辑不允许编辑,只做显示用

	// 按钮的操作
	GtkWidget *button0 = gtk_button_new_with_label("0");	// 按钮0
	GtkWidget *button1 = gtk_button_new_with_label("1");	// 按钮1
	GtkWidget *button2 = gtk_button_new_with_label("2");	// 按钮2
	GtkWidget *button3 = gtk_button_new_with_label("3");	// 按钮3
	GtkWidget *button4 = gtk_button_new_with_label("4");	// 按钮4
	GtkWidget *button5 = gtk_button_new_with_label("5");	// 按钮5
	GtkWidget *button6 = gtk_button_new_with_label("6");	// 按钮6
	GtkWidget *button7 = gtk_button_new_with_label("7");	// 按钮7
	GtkWidget *button8 = gtk_button_new_with_label("8");	// 按钮8
	GtkWidget *button9 = gtk_button_new_with_label("9");	// 按钮9
	GtkWidget *button_add = gtk_button_new_with_label("+");			// 加
	GtkWidget *button_minus = gtk_button_new_with_label("-");	 	// 减
	GtkWidget *button_multiply = gtk_button_new_with_label("*");	// 乘
	GtkWidget *button_divide = gtk_button_new_with_label("/");		// 除
	GtkWidget *button_equal = gtk_button_new_with_label("=");		// 等于
	GtkWidget *button_detele = gtk_button_new_with_label("c");		// 退格

	// 布局操作
	gtk_container_add(GTK_CONTAINER(window), table); // 表格放入窗口
	gtk_table_attach_defaults(GTK_TABLE(table), entry, 0, 4, 0, 1);	// 行编辑放入表格
	gtk_table_attach_defaults(GTK_TABLE(table), button0, 0, 1, 4, 5);// 按钮放入表格
	gtk_table_attach_defaults(GTK_TABLE(table), button1, 0, 1, 3, 4);
	gtk_table_attach_defaults(GTK_TABLE(table), button2, 1, 2, 3, 4);
	gtk_table_attach_defaults(GTK_TABLE(table), button3, 2, 3, 3, 4);
	gtk_table_attach_defaults(GTK_TABLE(table), button4, 0, 1, 2, 3);
	gtk_table_attach_defaults(GTK_TABLE(table), button5, 1, 2, 2, 3);
	gtk_table_attach_defaults(GTK_TABLE(table), button6, 2, 3, 2, 3);
	gtk_table_attach_defaults(GTK_TABLE(table), button7, 0, 1, 1, 2);
	gtk_table_attach_defaults(GTK_TABLE(table), button8, 1, 2, 1, 2);
	gtk_table_attach_defaults(GTK_TABLE(table), button9, 2, 3, 1, 2);
	gtk_table_attach_defaults(GTK_TABLE(table), button_add, 1, 2, 4, 5);
	gtk_table_attach_defaults(GTK_TABLE(table), button_minus, 2, 3, 4, 5);
	gtk_table_attach_defaults(GTK_TABLE(table), button_multiply, 3, 4, 2, 3);
	gtk_table_attach_defaults(GTK_TABLE(table), button_divide, 3, 4, 3, 4);
	gtk_table_attach_defaults(GTK_TABLE(table), button_equal, 3, 4, 4, 5);
	gtk_table_attach_defaults(GTK_TABLE(table), button_detele, 3, 4, 1, 2);

	gtk_widget_show_all(window);  // 显示所有控件

	gtk_main();  //进入事件循环 

	return 0;
} 

源代码下载请点此处。

时间: 2024-11-10 10:07:29

布局练习之计算器的相关文章

Java图形化界面设计——布局管理器之GridLayout(网格布局) 之计算器

代码如下: import java.awt.*; import javax.swing.*; public class GridFrame extends JFrame { // 定义字符串数组,为按钮的显示文本赋值 String str[] = { "MC", "MR", "MS", "M+", "←", "C", "%", "π", "

GTK入门学习:布局练习之计算器

接下来,我们做一个布局练习,如下图: 我们用表格布局实现,表格布局参考坐标如下: 这里我们用到行编辑控件( GtkEntry ). 行编辑的创建: GtkWidget * gtk_entry_new(void); 返回值:行编辑指针行 编辑内容的设置: void gtk_entry_set_text (GtkEntry *entry,const gchar *text); entry: 行编辑 text: 需要设置的内容 设置行编辑是否允许编辑: void gtk_editable_set_ed

从零开始学android&lt;使用嵌套布局实现计算器界面.十七.&gt;

所谓的嵌套布局就是在一个文件中嵌套多个布局文件 <span style="font-size:18px;"> <LinearLayout android:layout_width="match_parent" android:layout_height="fill_parent" android:orientation="vertical" > <FrameLayout android:layou

Android GridLayout简介,以计算器为例

 <Android GridLayout简介,以计算器为例> Android GridLayout默认从左往右水平布局元素.可以通过设置属性:android:orientation=,控制子元素布局的方向为水平还是垂直. GridLayout的属性 android:layout_row 和 android:layout_column 设定常数值则指定GridLayout显示的行列数. 设定 android:layout_rowSpan 或者 android:layout_columnSpa

GTK+学习之旅

00.背上行囊1——程序员学习之道 01.背上行囊2——为什么要学习GTK 02.背上行囊3——GUI概述 03.背上行囊4——GTK简介 04.背上行囊5——GTK环境搭建( Linux ) 05.背上行囊6——GTK环境搭建( windows )   06.踏上旅途1——一个简单的空白窗口 07.踏上旅途2——控件的添加 08.踏上旅途3——布局容器之水平布局 09.踏上旅途4——布局容器之垂直布局 10.踏上旅途5——布局容器之表格布局 11.踏上旅途6——布局容器之固定布局 12.踏上旅

Coding源码学习第四部分(Masonry介绍与使用(二))

接上篇,本篇继续对Masonry 进行学习,接上篇示例: (6)Masonry 布局实现iOS 计算器 1 - (void)exp4 { 2 WS(weakSelf); 3 // 申明区域,displayView 是显示布局,keyboardView 是键盘区域 4 UIView *displayView = [UIView new]; // 创建并添加 显示区域 5 [displayView setBackgroundColor:[UIColor blackColor]]; 6 [self.v

我的Android学习路线(一)

最近实在是闲的无聊,本着不能让自己的时间白白流失的目的,我就决定完成一下之前的诺言:把 Android 开发学了.正好手头有一本<Android 4编程入门经典>,于是便用两天时间把视图部分的代码全部敲了一遍. 然后寻思着这么一个现阶段的入门学习路线: 撸一个计算器出来,并且做到屏幕自动适配. 利用四大组件,给计算器加入各种鬼畜功能. 之前在入门 Java 的时候,老师在教我们 Java 图形界面之后便叫我们制作一个计算器,算是对图形界面的入门.其实当时写计算器的时候我偷了个懒,布局使用了绝对

一步一步学习GTK+

00.背上行囊1——程序员学习之道 01.背上行囊2——为什么要学习GTK 02.背上行囊3——GUI概述 03.背上行囊4——GTK简介 04.背上行囊5——GTK环境搭建( Linux ) 05.背上行囊6——GTK环境搭建( windows ) 06.踏上旅途1——一个简单的空白窗口 07.踏上旅途2——控件的添加 08.踏上旅途3——布局容器之水平布局 09.踏上旅途4——布局容器之垂直布局 10.踏上旅途5——布局容器之表格布局 11.踏上旅途6——布局容器之固定布局 12.踏上旅途7

Linux之GTK系列教程

00.背上行囊1--程序员学习之道 01.背上行囊2--为什么要学习GTK 02.背上行囊3--GUI概述 03.背上行囊4--GTK简介 04.背上行囊5--GTK环境搭建( Linux ) 05.背上行囊6--GTK环境搭建( windows ) 06.踏上旅途1--一个简单的空白窗口 07.踏上旅途2--控件的添加 08.踏上旅途3--布局容器之水平布局 09.踏上旅途4--布局容器之垂直布局 10.踏上旅途5--布局容器之表格布局 11.踏上旅途6--布局容器之固定布局 12.踏上旅途7