|
Packit |
1470ea |
|
|
Packit |
1470ea |
<page xmlns="http://projectmallard.org/1.0/" xmlns:its="http://www.w3.org/2005/11/its" xmlns:xi="http://www.w3.org/2001/XInclude" type="guide" style="task" id="toolbar.js" xml:lang="ko">
|
|
Packit |
1470ea |
<info>
|
|
Packit |
1470ea |
<title type="text">Toolbar (JavaScript)</title>
|
|
Packit |
1470ea |
<link type="guide" xref="beginner.js#menu-combo-toolbar"/>
|
|
Packit |
1470ea |
<revision version="0.1" date="2012-05-30" status="draft"/>
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
<credit type="author copyright">
|
|
Packit |
1470ea |
<name>Tiffany Antopolski</name>
|
|
Packit |
1470ea |
<email its:translate="no">tiffany.antopolski@gmail.com</email>
|
|
Packit |
1470ea |
<years>2012</years>
|
|
Packit |
1470ea |
</credit>
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
<desc>도구 표시줄</desc>
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
<mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
|
|
Packit |
1470ea |
<mal:name>조성호</mal:name>
|
|
Packit |
1470ea |
<mal:email>shcho@gnome.org</mal:email>
|
|
Packit |
1470ea |
<mal:years>2017</mal:years>
|
|
Packit |
1470ea |
</mal:credit>
|
|
Packit |
1470ea |
</info>
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
<title>Toolbar</title>
|
|
Packit |
1470ea |
<media type="image" mime="image/png" src="media/toolbar.png"/>
|
|
Packit |
1470ea |
Toolbar에는 텍스트나 스톡 아이콘을 넣을 수 있습니다. 이 예제에서는 스톡 아이콘을 사용하겠습니다. 이 예제에는 전체 화면 기능이 있습니다.
|
|
Packit |
1470ea |
SimpleAction(창과 앱)을 활용하는 예제입니다. 앱 동작은 앱 메뉴에서 쉽게 추가할 수 있습니다.
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
#!/usr/bin/gjs
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
imports.gi.versions.Gdk = '3.0';
|
|
Packit |
1470ea |
imports.gi.versions.Gtk = '3.0';
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
const Gdk = imports.gi.Gdk;
|
|
Packit |
1470ea |
const Gio = imports.gi.Gio;
|
|
Packit |
1470ea |
const GLib = imports.gi.GLib;
|
|
Packit |
1470ea |
const Gtk = imports.gi.Gtk;
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
class Application {
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//create the application
|
|
Packit |
1470ea |
constructor() {
|
|
Packit |
1470ea |
this.application = new Gtk.Application({
|
|
Packit |
1470ea |
application_id: 'org.example.myapp',
|
|
Packit |
1470ea |
flags: Gio.ApplicationFlags.FLAGS_NONE
|
|
Packit |
1470ea |
});
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//connect to 'activate' and 'startup' signals to the callback functions
|
|
Packit |
1470ea |
this.application.connect('activate', this._onActivate.bind(this));
|
|
Packit |
1470ea |
this.application.connect('startup', this._onStartup.bind(this));
|
|
Packit |
1470ea |
}
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//create the UI (in this case it's just the ApplicationWindow
|
|
Packit |
1470ea |
_buildUI() {
|
|
Packit |
1470ea |
this._window = new Gtk.ApplicationWindow({
|
|
Packit |
1470ea |
application: this.application,
|
|
Packit |
1470ea |
window_position: Gtk.WindowPosition.CENTER,
|
|
Packit |
1470ea |
title: "Toolbar Example",
|
|
Packit |
1470ea |
default_height: 200,
|
|
Packit |
1470ea |
default_width: 400
|
|
Packit |
1470ea |
});
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
this._grid = new Gtk.Grid();
|
|
Packit |
1470ea |
this._window.add(this._grid);
|
|
Packit |
1470ea |
this._grid.show();
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
this._createToolbar();
|
|
Packit |
1470ea |
this._toolbar.set_hexpand(true);
|
|
Packit |
1470ea |
this._grid.attach(this._toolbar, 0, 0, 1, 1);
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//show the toolbar and window
|
|
Packit |
1470ea |
this._toolbar.show();
|
|
Packit |
1470ea |
this._window.show();
|
|
Packit |
1470ea |
}
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//callback function for 'activate' signal
|
|
Packit |
1470ea |
_onActivate() {
|
|
Packit |
1470ea |
this._window.present();
|
|
Packit |
1470ea |
}
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//callback function for 'startup' signal
|
|
Packit |
1470ea |
_onStartup() {
|
|
Packit |
1470ea |
this._initMenus();
|
|
Packit |
1470ea |
this._buildUI();
|
|
Packit |
1470ea |
}
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//create the toolbar, its toolbuttons and their actions
|
|
Packit |
1470ea |
_createToolbar() {
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
this._toolbar = new Gtk.Toolbar();
|
|
Packit |
1470ea |
this._toolbar.get_style_context().add_class(Gtk.STYLE_CLASS_PRIMARY_TOOLBAR);
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//create the "New" ToolButton and its SimpleAction.
|
|
Packit |
1470ea |
//Using actions allows you to add them to the app menu
|
|
Packit |
1470ea |
//without duplicating code.
|
|
Packit |
1470ea |
let newAction = new Gio.SimpleAction({ name: 'new'});
|
|
Packit |
1470ea |
newAction.connect('activate', () => { this._newCB(); });
|
|
Packit |
1470ea |
this.application.add_action(newAction);//note: this action is added to the app
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
this._newButton = Gtk.ToolButton.new_from_stock(Gtk.STOCK_NEW);
|
|
Packit |
1470ea |
this._newButton.is_important = true;
|
|
Packit |
1470ea |
this._toolbar.add(this._newButton);
|
|
Packit |
1470ea |
this._newButton.show();
|
|
Packit |
1470ea |
this._newButton.action_name = "app.new";
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//create the "Open" ToolButton and its SimpleAction
|
|
Packit |
1470ea |
let openAction = new Gio.SimpleAction({ name: 'open'});
|
|
Packit |
1470ea |
openAction.connect('activate', () => { this._openCB(); });
|
|
Packit |
1470ea |
this.application.add_action(openAction);
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
this._openButton = Gtk.ToolButton.new_from_stock(Gtk.STOCK_OPEN);
|
|
Packit |
1470ea |
this._openButton.is_important = true;
|
|
Packit |
1470ea |
this._toolbar.add(this._openButton);
|
|
Packit |
1470ea |
this._openButton.show();
|
|
Packit |
1470ea |
this._openButton.action_name = "app.open";
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//create the "Undo" ToolButton and its SimpleAction
|
|
Packit |
1470ea |
let undoAction = new Gio.SimpleAction({ name: 'undo'});
|
|
Packit |
1470ea |
undoAction.connect('activate', () => { this._undoCB(); });
|
|
Packit |
1470ea |
this._window.add_action(undoAction);//note this action is added to the window
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
this._undoButton = Gtk.ToolButton.new_from_stock(Gtk.STOCK_UNDO);
|
|
Packit |
1470ea |
this._undoButton.is_important = true;
|
|
Packit |
1470ea |
this._toolbar.add(this._undoButton);
|
|
Packit |
1470ea |
this._undoButton.show();
|
|
Packit |
1470ea |
this._undoButton.action_name = "win.undo";
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//create the "Fullscreen" ToolButton and its SimpleAction
|
|
Packit |
1470ea |
let fullscreenToggleAction = new Gio.SimpleAction ({ name: 'fullscreenToggle' });
|
|
Packit |
1470ea |
fullscreenToggleAction.connect('activate', () => {
|
|
Packit |
1470ea |
this._fullscreenToggleCB();
|
|
Packit |
1470ea |
});
|
|
Packit |
1470ea |
this._window.add_action(fullscreenToggleAction);
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
this._fullscreenButton = Gtk.ToolButton.new_from_stock(Gtk.STOCK_FULLSCREEN);
|
|
Packit |
1470ea |
this._fullscreenButton.is_important = true;
|
|
Packit |
1470ea |
this._toolbar.add(this._fullscreenButton);
|
|
Packit |
1470ea |
this._fullscreenButton.show();
|
|
Packit |
1470ea |
this._fullscreenButton.action_name = "win.fullscreenToggle";
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//create the "leaveFullscreen" ToolButton, and set the action name to "win.fullscreenToggle"
|
|
Packit |
1470ea |
this._leaveFullscreenButton = Gtk.ToolButton.new_from_stock(Gtk.STOCK_LEAVE_FULLSCREEN);
|
|
Packit |
1470ea |
this._leaveFullscreenButton.is_important = true;
|
|
Packit |
1470ea |
this._toolbar.add(this._leaveFullscreenButton);
|
|
Packit |
1470ea |
this._leaveFullscreenButton.action_name = "win.fullscreenToggle";
|
|
Packit |
1470ea |
}
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
_initMenus() {
|
|
Packit |
1470ea |
let menu = new Gio.Menu();
|
|
Packit |
1470ea |
menu.append("New", 'app.new');
|
|
Packit |
1470ea |
menu.append("Open", 'app.open');
|
|
Packit |
1470ea |
menu.append("Quit", 'app.quit');
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
this.application.set_app_menu(menu);
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
let quitAction = new Gio.SimpleAction({name: 'quit' });
|
|
Packit |
1470ea |
quitAction.connect('activate', () => { this._window.destroy(); });
|
|
Packit |
1470ea |
this.application.add_action(quitAction);
|
|
Packit |
1470ea |
}
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
_newCB() {
|
|
Packit |
1470ea |
print("You clicked 'New'.");
|
|
Packit |
1470ea |
}
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
_openCB() {
|
|
Packit |
1470ea |
print("You clicked 'Open'.");
|
|
Packit |
1470ea |
}
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
_undoCB() {
|
|
Packit |
1470ea |
print ("You clicked 'Undo'.");
|
|
Packit |
1470ea |
}
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
_fullscreenToggleCB() {
|
|
Packit |
1470ea |
if ((this._window.get_window().get_state() & Gdk.WindowState.FULLSCREEN) != 0 ) {
|
|
Packit |
1470ea |
this._window.unfullscreen();
|
|
Packit |
1470ea |
this._leaveFullscreenButton.hide();
|
|
Packit |
1470ea |
this._fullscreenButton.show();
|
|
Packit |
1470ea |
} else {
|
|
Packit |
1470ea |
this._window.fullscreen();
|
|
Packit |
1470ea |
this._fullscreenButton.hide();
|
|
Packit |
1470ea |
this._leaveFullscreenButton.show();
|
|
Packit |
1470ea |
}
|
|
Packit |
1470ea |
}
|
|
Packit |
1470ea |
};
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
//run the application
|
|
Packit |
1470ea |
let app = new Application();
|
|
Packit |
1470ea |
app.application.run(ARGV);
|
|
Packit |
1470ea |
|
|
Packit |
1470ea |
이 예제는 다음 참고자료가 필요합니다:
|
|
Packit |
1470ea |
<list>
|
|
Packit |
1470ea |
<item><link href="http://www.roojs.org/seed/gir-1.2-gtk-3.0/gjs/Gtk.Window.html">Gtk.Window</link> </item>
|
|
Packit |
1470ea |
<item><link href="http://www.roojs.org/seed/gir-1.2-gtk-3.0/gjs/Gtk.Toolbar.html">Gtk.Toolbar</link> </item>
|
|
Packit |
1470ea |
<item><link href="http://www.roojs.org/seed/gir-1.2-gtk-3.0/gjs/Gtk.ToolButton.html">Gtk.ToolButton</link> </item>
|
|
Packit |
1470ea |
<item><link href="http://www.roojs.org/seed/gir-1.2-gtk-3.0/gjs/Gtk.html">Gtk에 들어있는 항목</link> </item>
|
|
Packit |
1470ea |
<item><link href="http://www.roojs.org/seed/gir-1.2-gtk-3.0/gjs/Gdk.WindowState.html">Gdk.WindowState</link> </item>
|
|
Packit |
1470ea |
</list>
|
|
Packit |
1470ea |
</page>
|