2022-04-21 16:53:28 +02:00
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
|
<html lang="en">
|
|
|
|
|
|
<head>
|
|
|
|
|
|
<meta charset="utf-8" />
|
|
|
|
|
|
<meta name="generator" content="pandoc" />
|
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
|
|
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<title>GTK 4 tutorial</title>
|
2022-04-21 16:53:28 +02:00
|
|
|
|
<style>
|
|
|
|
|
|
code{white-space: pre-wrap;}
|
|
|
|
|
|
span.smallcaps{font-variant: small-caps;}
|
|
|
|
|
|
span.underline{text-decoration: underline;}
|
|
|
|
|
|
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
|
|
|
|
|
div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}
|
|
|
|
|
|
ul.task-list{list-style: none;}
|
|
|
|
|
|
pre{overflow: visible;}
|
|
|
|
|
|
pre > code.sourceCode { white-space: pre; position: relative; }
|
|
|
|
|
|
pre > code.sourceCode > span { display: inline-block; line-height: 1.25; }
|
|
|
|
|
|
pre > code.sourceCode > span:empty { height: 1.2em; }
|
|
|
|
|
|
code.sourceCode > span { color: inherit; text-decoration: inherit; }
|
|
|
|
|
|
div.sourceCode { margin: 1em 0; }
|
|
|
|
|
|
pre.sourceCode { margin: 0; }
|
|
|
|
|
|
@media screen {
|
|
|
|
|
|
div.sourceCode { overflow: auto; }
|
2022-04-17 13:54:42 +02:00
|
|
|
|
}
|
2022-04-21 16:53:28 +02:00
|
|
|
|
@media print {
|
|
|
|
|
|
pre > code.sourceCode { white-space: pre-wrap; }
|
|
|
|
|
|
pre > code.sourceCode > span { text-indent: -5em; padding-left: 5em; }
|
|
|
|
|
|
}
|
|
|
|
|
|
pre.numberSource code
|
|
|
|
|
|
{ counter-reset: source-line 0; }
|
|
|
|
|
|
pre.numberSource code > span
|
|
|
|
|
|
{ position: relative; left: -4em; counter-increment: source-line; }
|
|
|
|
|
|
pre.numberSource code > span > a:first-child::after
|
|
|
|
|
|
{ content: counter(source-line);
|
|
|
|
|
|
position: relative; left: -1em; text-align: right; vertical-align: baseline;
|
|
|
|
|
|
border: none; display: inline-block;
|
|
|
|
|
|
-webkit-touch-callout: none; -webkit-user-select: none;
|
|
|
|
|
|
-khtml-user-select: none; -moz-user-select: none;
|
|
|
|
|
|
-ms-user-select: none; user-select: none;
|
|
|
|
|
|
padding: 0 4px; width: 4em;
|
|
|
|
|
|
color: #aaaaaa;
|
|
|
|
|
|
}
|
|
|
|
|
|
pre.numberSource { margin-left: 3em; border-left: 1px solid #aaaaaa; padding-left: 4px; }
|
|
|
|
|
|
div.sourceCode
|
|
|
|
|
|
{ }
|
|
|
|
|
|
@media screen {
|
|
|
|
|
|
pre > code.sourceCode > span > a:first-child::before { text-decoration: underline; }
|
|
|
|
|
|
}
|
|
|
|
|
|
code span.al { color: #ff0000; font-weight: bold; } /* Alert */
|
|
|
|
|
|
code span.an { color: #60a0b0; font-weight: bold; font-style: italic; } /* Annotation */
|
|
|
|
|
|
code span.at { color: #7d9029; } /* Attribute */
|
|
|
|
|
|
code span.bn { color: #40a070; } /* BaseN */
|
|
|
|
|
|
code span.bu { } /* BuiltIn */
|
|
|
|
|
|
code span.cf { color: #007020; font-weight: bold; } /* ControlFlow */
|
|
|
|
|
|
code span.ch { color: #4070a0; } /* Char */
|
|
|
|
|
|
code span.cn { color: #880000; } /* Constant */
|
|
|
|
|
|
code span.co { color: #60a0b0; font-style: italic; } /* Comment */
|
|
|
|
|
|
code span.cv { color: #60a0b0; font-weight: bold; font-style: italic; } /* CommentVar */
|
|
|
|
|
|
code span.do { color: #ba2121; font-style: italic; } /* Documentation */
|
|
|
|
|
|
code span.dt { color: #902000; } /* DataType */
|
|
|
|
|
|
code span.dv { color: #40a070; } /* DecVal */
|
|
|
|
|
|
code span.er { color: #ff0000; font-weight: bold; } /* Error */
|
|
|
|
|
|
code span.ex { } /* Extension */
|
|
|
|
|
|
code span.fl { color: #40a070; } /* Float */
|
|
|
|
|
|
code span.fu { color: #06287e; } /* Function */
|
|
|
|
|
|
code span.im { } /* Import */
|
|
|
|
|
|
code span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Information */
|
|
|
|
|
|
code span.kw { color: #007020; font-weight: bold; } /* Keyword */
|
|
|
|
|
|
code span.op { color: #666666; } /* Operator */
|
|
|
|
|
|
code span.ot { color: #007020; } /* Other */
|
|
|
|
|
|
code span.pp { color: #bc7a00; } /* Preprocessor */
|
|
|
|
|
|
code span.sc { color: #4070a0; } /* SpecialChar */
|
|
|
|
|
|
code span.ss { color: #bb6688; } /* SpecialString */
|
|
|
|
|
|
code span.st { color: #4070a0; } /* String */
|
|
|
|
|
|
code span.va { color: #19177c; } /* Variable */
|
|
|
|
|
|
code span.vs { color: #4070a0; } /* VerbatimString */
|
|
|
|
|
|
code span.wa { color: #60a0b0; font-weight: bold; font-style: italic; } /* Warning */
|
|
|
|
|
|
div.sourceCode { margin: 10px; padding: 16px 10px 8px 10px; border: 2px solid silver; background-color: ghostwhite; overflow-x:scroll}
|
|
|
|
|
|
pre:not(.sourceCode) { margin: 10px; padding: 16px 10px 8px 10px; border: 2px solid silver; background-color: ghostwhite; overflow-x:scroll}
|
|
|
|
|
|
table {margin-left: auto; margin-right: auto; border-collapse: collapse; border: 1px solid;}
|
|
|
|
|
|
th {padding: 2px 6px; border: 1px solid; background-color: ghostwhite;}
|
|
|
|
|
|
td {padding: 2px 6px; border: 1px solid;}
|
|
|
|
|
|
img {display: block; margin-left: auto; margin-right: auto;}
|
|
|
|
|
|
figcaption {text-align: center;}
|
|
|
|
|
|
</style>
|
|
|
|
|
|
</head>
|
|
|
|
|
|
<body style="padding-top: 70px;">
|
|
|
|
|
|
<div class="container">
|
|
|
|
|
|
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-primary">
|
|
|
|
|
|
<div class="container-fluid">
|
|
|
|
|
|
<span class="navbar-brand">Gtk4 tutorial</span>
|
|
|
|
|
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
|
|
|
|
|
<span class="navbar-toggler-icon"></span>
|
|
|
|
|
|
</button>
|
|
|
|
|
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
|
|
|
|
|
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
|
|
|
|
|
<li class="nav-item">
|
|
|
|
|
|
<a class="nav-link" href="index.html">Home</a>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
<li class="nav-item">
|
|
|
|
|
|
<a class="nav-link" href="sec23.html">Prev: section23</a>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
<li class="nav-item">
|
|
|
|
|
|
<a class="nav-link" href="sec25.html">Next: section25</a>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</nav>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<h1 id="combine-gtkdrawingarea-and-tfetextview">Combine GtkDrawingArea
|
|
|
|
|
|
and TfeTextView</h1>
|
|
|
|
|
|
<p>Now, we will make a new application which has GtkDrawingArea and
|
|
|
|
|
|
TfeTextView in it. Its name is “color”. If you write a name of a color
|
|
|
|
|
|
in TfeTextView and click on the <code>run</code> button, then the color
|
|
|
|
|
|
of GtkDrawingArea changes to the color given by you.</p>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<figure>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<img src="image/color.png" alt="color" />
|
|
|
|
|
|
<figcaption aria-hidden="true">color</figcaption>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
</figure>
|
|
|
|
|
|
<p>The following colors are available.</p>
|
|
|
|
|
|
<ul>
|
|
|
|
|
|
<li>white</li>
|
|
|
|
|
|
<li>black</li>
|
|
|
|
|
|
<li>red</li>
|
|
|
|
|
|
<li>green</li>
|
|
|
|
|
|
<li>blue</li>
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
<p>In addition the following two options are also available.</p>
|
|
|
|
|
|
<ul>
|
|
|
|
|
|
<li>light: Make the color of the drawing area lighter.</li>
|
|
|
|
|
|
<li>dark: Make the color of the drawing area darker.</li>
|
|
|
|
|
|
</ul>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<p>This application can only do very simple things. However, it tells us
|
|
|
|
|
|
that if we add powerful parser to it, we will be able to make it more
|
|
|
|
|
|
efficient. I want to show it to you in the later section by making a
|
|
|
|
|
|
turtle graphics language like Logo program language.</p>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<p>In this section, we focus on how to bind the two objects.</p>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<h2 id="color.ui-and-color.gresource.xml">Color.ui and
|
|
|
|
|
|
color.gresource.xml</h2>
|
|
|
|
|
|
<p>First, We need to make the ui file of the widgets. The image in the
|
|
|
|
|
|
previous subsection gives us the structure of the widgets. Title bar,
|
|
|
|
|
|
four buttons in the tool bar and two widgets textview and drawing area.
|
|
|
|
|
|
The ui file is as follows.</p>
|
|
|
|
|
|
<div class="sourceCode" id="cb1"><pre
|
|
|
|
|
|
class="sourceCode numberSource xml numberLines"><code class="sourceCode xml"><span id="cb1-1"><a href="#cb1-1"></a><span class="fu"><?xml</span><span class="ot"> version=</span><span class="st">"1.0"</span><span class="ot"> encoding=</span><span class="st">"UTF-8"</span><span class="fu">?></span></span>
|
|
|
|
|
|
<span id="cb1-2"><a href="#cb1-2"></a><<span class="kw">interface</span>></span>
|
|
|
|
|
|
<span id="cb1-3"><a href="#cb1-3"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkApplicationWindow"</span><span class="ot"> id=</span><span class="st">"win"</span>></span>
|
|
|
|
|
|
<span id="cb1-4"><a href="#cb1-4"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"title"</span>>color changer</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-5"><a href="#cb1-5"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"default-width"</span>>600</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-6"><a href="#cb1-6"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"default-height"</span>>400</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-7"><a href="#cb1-7"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-8"><a href="#cb1-8"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkBox"</span><span class="ot"> id=</span><span class="st">"boxv"</span>></span>
|
|
|
|
|
|
<span id="cb1-9"><a href="#cb1-9"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"orientation"</span>>GTK_ORIENTATION_VERTICAL</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-10"><a href="#cb1-10"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-11"><a href="#cb1-11"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkBox"</span><span class="ot"> id=</span><span class="st">"boxh1"</span>></span>
|
|
|
|
|
|
<span id="cb1-12"><a href="#cb1-12"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"orientation"</span>>GTK_ORIENTATION_HORIZONTAL</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-13"><a href="#cb1-13"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-14"><a href="#cb1-14"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkLabel"</span><span class="ot"> id=</span><span class="st">"dmy1"</span>></span>
|
|
|
|
|
|
<span id="cb1-15"><a href="#cb1-15"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"width-chars"</span>>10</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-16"><a href="#cb1-16"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-17"><a href="#cb1-17"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-18"><a href="#cb1-18"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-19"><a href="#cb1-19"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkButton"</span><span class="ot"> id=</span><span class="st">"btnr"</span>></span>
|
|
|
|
|
|
<span id="cb1-20"><a href="#cb1-20"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"label"</span>>Run</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-21"><a href="#cb1-21"></a> <<span class="kw">signal</span><span class="ot"> name=</span><span class="st">"clicked"</span><span class="ot"> handler=</span><span class="st">"run_cb"</span>></<span class="kw">signal</span>></span>
|
|
|
|
|
|
<span id="cb1-22"><a href="#cb1-22"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-23"><a href="#cb1-23"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-24"><a href="#cb1-24"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-25"><a href="#cb1-25"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkButton"</span><span class="ot"> id=</span><span class="st">"btno"</span>></span>
|
|
|
|
|
|
<span id="cb1-26"><a href="#cb1-26"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"label"</span>>Open</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-27"><a href="#cb1-27"></a> <<span class="kw">signal</span><span class="ot"> name=</span><span class="st">"clicked"</span><span class="ot"> handler=</span><span class="st">"open_cb"</span>></<span class="kw">signal</span>></span>
|
|
|
|
|
|
<span id="cb1-28"><a href="#cb1-28"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-29"><a href="#cb1-29"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-30"><a href="#cb1-30"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-31"><a href="#cb1-31"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkLabel"</span><span class="ot"> id=</span><span class="st">"dmy2"</span>></span>
|
|
|
|
|
|
<span id="cb1-32"><a href="#cb1-32"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"hexpand"</span>>TRUE</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-33"><a href="#cb1-33"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-34"><a href="#cb1-34"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-35"><a href="#cb1-35"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-36"><a href="#cb1-36"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkButton"</span><span class="ot"> id=</span><span class="st">"btns"</span>></span>
|
|
|
|
|
|
<span id="cb1-37"><a href="#cb1-37"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"label"</span>>Save</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-38"><a href="#cb1-38"></a> <<span class="kw">signal</span><span class="ot"> name=</span><span class="st">"clicked"</span><span class="ot"> handler=</span><span class="st">"save_cb"</span>></<span class="kw">signal</span>></span>
|
|
|
|
|
|
<span id="cb1-39"><a href="#cb1-39"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-40"><a href="#cb1-40"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-41"><a href="#cb1-41"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-42"><a href="#cb1-42"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkButton"</span><span class="ot"> id=</span><span class="st">"btnc"</span>></span>
|
|
|
|
|
|
<span id="cb1-43"><a href="#cb1-43"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"label"</span>>Close</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-44"><a href="#cb1-44"></a> <<span class="kw">signal</span><span class="ot"> name=</span><span class="st">"clicked"</span><span class="ot"> handler=</span><span class="st">"close_cb"</span>></<span class="kw">signal</span>></span>
|
|
|
|
|
|
<span id="cb1-45"><a href="#cb1-45"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-46"><a href="#cb1-46"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-47"><a href="#cb1-47"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-48"><a href="#cb1-48"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkLabel"</span><span class="ot"> id=</span><span class="st">"dmy3"</span>></span>
|
|
|
|
|
|
<span id="cb1-49"><a href="#cb1-49"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"width-chars"</span>>10</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-50"><a href="#cb1-50"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-51"><a href="#cb1-51"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-52"><a href="#cb1-52"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-53"><a href="#cb1-53"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-54"><a href="#cb1-54"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-55"><a href="#cb1-55"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkBox"</span><span class="ot"> id=</span><span class="st">"boxh2"</span>></span>
|
|
|
|
|
|
<span id="cb1-56"><a href="#cb1-56"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"orientation"</span>>GTK_ORIENTATION_HORIZONTAL</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-57"><a href="#cb1-57"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"homogeneous"</span>>TRUE</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-58"><a href="#cb1-58"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-59"><a href="#cb1-59"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkScrolledWindow"</span><span class="ot"> id=</span><span class="st">"scr"</span>></span>
|
|
|
|
|
|
<span id="cb1-60"><a href="#cb1-60"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"hexpand"</span>>TRUE</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-61"><a href="#cb1-61"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"vexpand"</span>>TRUE</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-62"><a href="#cb1-62"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-63"><a href="#cb1-63"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"TfeTextView"</span><span class="ot"> id=</span><span class="st">"tv"</span>></span>
|
|
|
|
|
|
<span id="cb1-64"><a href="#cb1-64"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"wrap-mode"</span>>GTK_WRAP_WORD_CHAR</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-65"><a href="#cb1-65"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-66"><a href="#cb1-66"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-67"><a href="#cb1-67"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-68"><a href="#cb1-68"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-69"><a href="#cb1-69"></a> <<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-70"><a href="#cb1-70"></a> <<span class="kw">object</span><span class="ot"> class=</span><span class="st">"GtkDrawingArea"</span><span class="ot"> id=</span><span class="st">"da"</span>></span>
|
|
|
|
|
|
<span id="cb1-71"><a href="#cb1-71"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"hexpand"</span>>TRUE</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-72"><a href="#cb1-72"></a> <<span class="kw">property</span><span class="ot"> name=</span><span class="st">"vexpand"</span>>TRUE</<span class="kw">property</span>></span>
|
|
|
|
|
|
<span id="cb1-73"><a href="#cb1-73"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-74"><a href="#cb1-74"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-75"><a href="#cb1-75"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-76"><a href="#cb1-76"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-77"><a href="#cb1-77"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-78"><a href="#cb1-78"></a> </<span class="kw">child</span>></span>
|
|
|
|
|
|
<span id="cb1-79"><a href="#cb1-79"></a> </<span class="kw">object</span>></span>
|
|
|
|
|
|
<span id="cb1-80"><a href="#cb1-80"></a></<span class="kw">interface</span>></span></code></pre></div>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<ul>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<li>10-53: This part is the tool bar which has four buttons,
|
|
|
|
|
|
<code>Run</code>, <code>Open</code>, <code>Save</code> and
|
|
|
|
|
|
<code>Close</code>. This is similar to the toolbar of tfe text editor in
|
|
|
|
|
|
<a href="sec9.html">Section 9</a>. There are two differences.
|
|
|
|
|
|
<code>Run</code> button replaces <code>New</code> button. A signal
|
|
|
|
|
|
element is added to each button object. It has “name” attribute which is
|
|
|
|
|
|
a signal name and “handler” attribute which is the name of its signal
|
|
|
|
|
|
handler function. Options “-WI, –export-dynamic” CFLAG is necessary when
|
|
|
|
|
|
you compile the application. You can achieve this by adding
|
|
|
|
|
|
“export_dynamic: true” argument to executable function in
|
|
|
|
|
|
<code>meson.build</code>. And be careful that the handler must be
|
|
|
|
|
|
defined without ‘static’ class.</li>
|
|
|
|
|
|
<li>54-76: Puts GtkScrolledWindow and GtkDrawingArea into GtkBox. GtkBox
|
|
|
|
|
|
has “homogeneous property” with TRUE value, so the two children have the
|
|
|
|
|
|
same width in the box. TfeTextView is a child of GtkScrolledWindow.</li>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
</ul>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<p>The xml file for the resource compiler is almost same as before. Just
|
|
|
|
|
|
substitute “color” for “tfe”.</p>
|
|
|
|
|
|
<div class="sourceCode" id="cb2"><pre
|
|
|
|
|
|
class="sourceCode numberSource xml numberLines"><code class="sourceCode xml"><span id="cb2-1"><a href="#cb2-1"></a><span class="fu"><?xml</span><span class="ot"> version=</span><span class="st">"1.0"</span><span class="ot"> encoding=</span><span class="st">"UTF-8"</span><span class="fu">?></span></span>
|
|
|
|
|
|
<span id="cb2-2"><a href="#cb2-2"></a><<span class="kw">gresources</span>></span>
|
|
|
|
|
|
<span id="cb2-3"><a href="#cb2-3"></a> <<span class="kw">gresource</span><span class="ot"> prefix=</span><span class="st">"/com/github/ToshioCP/color"</span>></span>
|
|
|
|
|
|
<span id="cb2-4"><a href="#cb2-4"></a> <<span class="kw">file</span>>color.ui</<span class="kw">file</span>></span>
|
|
|
|
|
|
<span id="cb2-5"><a href="#cb2-5"></a> </<span class="kw">gresource</span>></span>
|
|
|
|
|
|
<span id="cb2-6"><a href="#cb2-6"></a></<span class="kw">gresources</span>></span></code></pre></div>
|
|
|
|
|
|
<h2 id="tfetextview.h-tfetextview.c-and-color.h">Tfetextview.h,
|
|
|
|
|
|
tfetextview.c and color.h</h2>
|
|
|
|
|
|
<p>First two files are the same as before. Color.h just includes
|
|
|
|
|
|
tfetextview.h.</p>
|
|
|
|
|
|
<div class="sourceCode" id="cb3"><pre
|
|
|
|
|
|
class="sourceCode numberSource C numberLines"><code class="sourceCode c"><span id="cb3-1"><a href="#cb3-1"></a><span class="pp">#include </span><span class="im"><gtk/gtk.h></span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb3-2"><a href="#cb3-2"></a></span>
|
|
|
|
|
|
<span id="cb3-3"><a href="#cb3-3"></a><span class="pp">#include </span><span class="im">"../tfetextview/tfetextview.h"</span></span></code></pre></div>
|
|
|
|
|
|
<h2 id="colorapplication.c">Colorapplication.c</h2>
|
|
|
|
|
|
<p>This is the main file. It deals with:</p>
|
|
|
|
|
|
<ul>
|
|
|
|
|
|
<li>Building widgets by GtkBuilder.</li>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<li>Setting a drawing function of GtkDrawingArea. And connecting a
|
|
|
|
|
|
handler to “resize” signal on GtkDrawingArea.</li>
|
|
|
|
|
|
<li>Implementing each call back functions. Particularly,
|
|
|
|
|
|
<code>Run</code> signal handler is the point in this program.</li>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
</ul>
|
|
|
|
|
|
<p>The following is <code>colorapplication.c</code>.</p>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<div class="sourceCode" id="cb4"><pre
|
|
|
|
|
|
class="sourceCode numberSource C numberLines"><code class="sourceCode c"><span id="cb4-1"><a href="#cb4-1"></a><span class="pp">#include </span><span class="im">"color.h"</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-2"><a href="#cb4-2"></a></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-3"><a href="#cb4-3"></a><span class="dt">static</span> GtkWidget <span class="op">*</span>win<span class="op">;</span></span>
|
|
|
|
|
|
<span id="cb4-4"><a href="#cb4-4"></a><span class="dt">static</span> GtkWidget <span class="op">*</span>tv<span class="op">;</span></span>
|
|
|
|
|
|
<span id="cb4-5"><a href="#cb4-5"></a><span class="dt">static</span> GtkWidget <span class="op">*</span>da<span class="op">;</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-6"><a href="#cb4-6"></a></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-7"><a href="#cb4-7"></a><span class="dt">static</span> cairo_surface_t <span class="op">*</span>surface <span class="op">=</span> NULL<span class="op">;</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-8"><a href="#cb4-8"></a></span>
|
|
|
|
|
|
<span id="cb4-9"><a href="#cb4-9"></a><span class="dt">static</span> <span class="dt">void</span></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-10"><a href="#cb4-10"></a>run <span class="op">(</span><span class="dt">void</span><span class="op">)</span> <span class="op">{</span></span>
|
|
|
|
|
|
<span id="cb4-11"><a href="#cb4-11"></a> GtkTextBuffer <span class="op">*</span>tb <span class="op">=</span> gtk_text_view_get_buffer <span class="op">(</span>GTK_TEXT_VIEW <span class="op">(</span>tv<span class="op">));</span></span>
|
|
|
|
|
|
<span id="cb4-12"><a href="#cb4-12"></a> GtkTextIter start_iter<span class="op">;</span></span>
|
|
|
|
|
|
<span id="cb4-13"><a href="#cb4-13"></a> GtkTextIter end_iter<span class="op">;</span></span>
|
|
|
|
|
|
<span id="cb4-14"><a href="#cb4-14"></a> <span class="dt">char</span> <span class="op">*</span>contents<span class="op">;</span></span>
|
|
|
|
|
|
<span id="cb4-15"><a href="#cb4-15"></a> cairo_t <span class="op">*</span>cr<span class="op">;</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-16"><a href="#cb4-16"></a></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-17"><a href="#cb4-17"></a> gtk_text_buffer_get_bounds <span class="op">(</span>tb<span class="op">,</span> <span class="op">&</span>start_iter<span class="op">,</span> <span class="op">&</span>end_iter<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-18"><a href="#cb4-18"></a> contents <span class="op">=</span> gtk_text_buffer_get_text <span class="op">(</span>tb<span class="op">,</span> <span class="op">&</span>start_iter<span class="op">,</span> <span class="op">&</span>end_iter<span class="op">,</span> FALSE<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-19"><a href="#cb4-19"></a> <span class="cf">if</span> <span class="op">(</span>surface<span class="op">)</span> <span class="op">{</span></span>
|
|
|
|
|
|
<span id="cb4-20"><a href="#cb4-20"></a> cr <span class="op">=</span> cairo_create <span class="op">(</span>surface<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-21"><a href="#cb4-21"></a> <span class="cf">if</span> <span class="op">(</span>g_strcmp0 <span class="op">(</span><span class="st">"red"</span><span class="op">,</span> contents<span class="op">)</span> <span class="op">==</span> <span class="dv">0</span><span class="op">)</span></span>
|
|
|
|
|
|
<span id="cb4-22"><a href="#cb4-22"></a> cairo_set_source_rgb <span class="op">(</span>cr<span class="op">,</span> <span class="dv">1</span><span class="op">,</span> <span class="dv">0</span><span class="op">,</span> <span class="dv">0</span><span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-23"><a href="#cb4-23"></a> <span class="cf">else</span> <span class="cf">if</span> <span class="op">(</span>g_strcmp0 <span class="op">(</span><span class="st">"green"</span><span class="op">,</span> contents<span class="op">)</span> <span class="op">==</span> <span class="dv">0</span><span class="op">)</span></span>
|
|
|
|
|
|
<span id="cb4-24"><a href="#cb4-24"></a> cairo_set_source_rgb <span class="op">(</span>cr<span class="op">,</span> <span class="dv">0</span><span class="op">,</span> <span class="dv">1</span><span class="op">,</span> <span class="dv">0</span><span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-25"><a href="#cb4-25"></a> <span class="cf">else</span> <span class="cf">if</span> <span class="op">(</span>g_strcmp0 <span class="op">(</span><span class="st">"blue"</span><span class="op">,</span> contents<span class="op">)</span> <span class="op">==</span> <span class="dv">0</span><span class="op">)</span></span>
|
|
|
|
|
|
<span id="cb4-26"><a href="#cb4-26"></a> cairo_set_source_rgb <span class="op">(</span>cr<span class="op">,</span> <span class="dv">0</span><span class="op">,</span> <span class="dv">0</span><span class="op">,</span> <span class="dv">1</span><span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-27"><a href="#cb4-27"></a> <span class="cf">else</span> <span class="cf">if</span> <span class="op">(</span>g_strcmp0 <span class="op">(</span><span class="st">"white"</span><span class="op">,</span> contents<span class="op">)</span> <span class="op">==</span> <span class="dv">0</span><span class="op">)</span></span>
|
|
|
|
|
|
<span id="cb4-28"><a href="#cb4-28"></a> cairo_set_source_rgb <span class="op">(</span>cr<span class="op">,</span> <span class="dv">1</span><span class="op">,</span> <span class="dv">1</span><span class="op">,</span> <span class="dv">1</span><span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-29"><a href="#cb4-29"></a> <span class="cf">else</span> <span class="cf">if</span> <span class="op">(</span>g_strcmp0 <span class="op">(</span><span class="st">"black"</span><span class="op">,</span> contents<span class="op">)</span> <span class="op">==</span> <span class="dv">0</span><span class="op">)</span></span>
|
|
|
|
|
|
<span id="cb4-30"><a href="#cb4-30"></a> cairo_set_source_rgb <span class="op">(</span>cr<span class="op">,</span> <span class="dv">0</span><span class="op">,</span> <span class="dv">0</span><span class="op">,</span> <span class="dv">0</span><span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-31"><a href="#cb4-31"></a> <span class="cf">else</span> <span class="cf">if</span> <span class="op">(</span>g_strcmp0 <span class="op">(</span><span class="st">"light"</span><span class="op">,</span> contents<span class="op">)</span> <span class="op">==</span> <span class="dv">0</span><span class="op">)</span></span>
|
|
|
|
|
|
<span id="cb4-32"><a href="#cb4-32"></a> cairo_set_source_rgba <span class="op">(</span>cr<span class="op">,</span> <span class="dv">1</span><span class="op">,</span> <span class="dv">1</span><span class="op">,</span> <span class="dv">1</span><span class="op">,</span> <span class="fl">0.5</span><span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-33"><a href="#cb4-33"></a> <span class="cf">else</span> <span class="cf">if</span> <span class="op">(</span>g_strcmp0 <span class="op">(</span><span class="st">"dark"</span><span class="op">,</span> contents<span class="op">)</span> <span class="op">==</span> <span class="dv">0</span><span class="op">)</span></span>
|
|
|
|
|
|
<span id="cb4-34"><a href="#cb4-34"></a> cairo_set_source_rgba <span class="op">(</span>cr<span class="op">,</span> <span class="dv">0</span><span class="op">,</span> <span class="dv">0</span><span class="op">,</span> <span class="dv">0</span><span class="op">,</span> <span class="fl">0.5</span><span class="op">);</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-35"><a href="#cb4-35"></a> <span class="cf">else</span></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-36"><a href="#cb4-36"></a> cairo_set_source_surface <span class="op">(</span>cr<span class="op">,</span> surface<span class="op">,</span> <span class="dv">0</span><span class="op">,</span> <span class="dv">0</span><span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-37"><a href="#cb4-37"></a> cairo_paint <span class="op">(</span>cr<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-38"><a href="#cb4-38"></a> cairo_destroy <span class="op">(</span>cr<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-39"><a href="#cb4-39"></a> <span class="op">}</span></span>
|
|
|
|
|
|
<span id="cb4-40"><a href="#cb4-40"></a> g_free <span class="op">(</span>contents<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-41"><a href="#cb4-41"></a><span class="op">}</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-42"><a href="#cb4-42"></a></span>
|
|
|
|
|
|
<span id="cb4-43"><a href="#cb4-43"></a><span class="dt">void</span></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-44"><a href="#cb4-44"></a>run_cb <span class="op">(</span>GtkWidget <span class="op">*</span>btnr<span class="op">)</span> <span class="op">{</span></span>
|
|
|
|
|
|
<span id="cb4-45"><a href="#cb4-45"></a> run <span class="op">();</span></span>
|
|
|
|
|
|
<span id="cb4-46"><a href="#cb4-46"></a> gtk_widget_queue_draw <span class="op">(</span>GTK_WIDGET <span class="op">(</span>da<span class="op">));</span></span>
|
|
|
|
|
|
<span id="cb4-47"><a href="#cb4-47"></a><span class="op">}</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-48"><a href="#cb4-48"></a></span>
|
|
|
|
|
|
<span id="cb4-49"><a href="#cb4-49"></a><span class="dt">void</span></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-50"><a href="#cb4-50"></a>open_cb <span class="op">(</span>GtkWidget <span class="op">*</span>btno<span class="op">)</span> <span class="op">{</span></span>
|
|
|
|
|
|
<span id="cb4-51"><a href="#cb4-51"></a> tfe_text_view_open <span class="op">(</span>TFE_TEXT_VIEW <span class="op">(</span>tv<span class="op">),</span> GTK_WINDOW <span class="op">(</span>win<span class="op">));</span></span>
|
|
|
|
|
|
<span id="cb4-52"><a href="#cb4-52"></a><span class="op">}</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-53"><a href="#cb4-53"></a></span>
|
|
|
|
|
|
<span id="cb4-54"><a href="#cb4-54"></a><span class="dt">void</span></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-55"><a href="#cb4-55"></a>save_cb <span class="op">(</span>GtkWidget <span class="op">*</span>btns<span class="op">)</span> <span class="op">{</span></span>
|
|
|
|
|
|
<span id="cb4-56"><a href="#cb4-56"></a> tfe_text_view_save <span class="op">(</span>TFE_TEXT_VIEW <span class="op">(</span>tv<span class="op">));</span></span>
|
|
|
|
|
|
<span id="cb4-57"><a href="#cb4-57"></a><span class="op">}</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-58"><a href="#cb4-58"></a></span>
|
|
|
|
|
|
<span id="cb4-59"><a href="#cb4-59"></a><span class="dt">void</span></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-60"><a href="#cb4-60"></a>close_cb <span class="op">(</span>GtkWidget <span class="op">*</span>btnc<span class="op">)</span> <span class="op">{</span></span>
|
|
|
|
|
|
<span id="cb4-61"><a href="#cb4-61"></a> <span class="cf">if</span> <span class="op">(</span>surface<span class="op">)</span></span>
|
|
|
|
|
|
<span id="cb4-62"><a href="#cb4-62"></a> cairo_surface_destroy <span class="op">(</span>surface<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-63"><a href="#cb4-63"></a> gtk_window_destroy <span class="op">(</span>GTK_WINDOW <span class="op">(</span>win<span class="op">));</span></span>
|
|
|
|
|
|
<span id="cb4-64"><a href="#cb4-64"></a><span class="op">}</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-65"><a href="#cb4-65"></a></span>
|
|
|
|
|
|
<span id="cb4-66"><a href="#cb4-66"></a><span class="dt">static</span> <span class="dt">void</span></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-67"><a href="#cb4-67"></a>resize_cb <span class="op">(</span>GtkDrawingArea <span class="op">*</span>drawing_area<span class="op">,</span> <span class="dt">int</span> width<span class="op">,</span> <span class="dt">int</span> height<span class="op">,</span> gpointer user_data<span class="op">)</span> <span class="op">{</span></span>
|
|
|
|
|
|
<span id="cb4-68"><a href="#cb4-68"></a> <span class="cf">if</span> <span class="op">(</span>surface<span class="op">)</span></span>
|
|
|
|
|
|
<span id="cb4-69"><a href="#cb4-69"></a> cairo_surface_destroy <span class="op">(</span>surface<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-70"><a href="#cb4-70"></a> surface <span class="op">=</span> cairo_image_surface_create <span class="op">(</span>CAIRO_FORMAT_ARGB32<span class="op">,</span> width<span class="op">,</span> height<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-71"><a href="#cb4-71"></a> run <span class="op">();</span></span>
|
|
|
|
|
|
<span id="cb4-72"><a href="#cb4-72"></a><span class="op">}</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-73"><a href="#cb4-73"></a></span>
|
|
|
|
|
|
<span id="cb4-74"><a href="#cb4-74"></a><span class="dt">static</span> <span class="dt">void</span></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-75"><a href="#cb4-75"></a>draw_func <span class="op">(</span>GtkDrawingArea <span class="op">*</span>drawing_area<span class="op">,</span> cairo_t <span class="op">*</span>cr<span class="op">,</span> <span class="dt">int</span> width<span class="op">,</span> <span class="dt">int</span> height<span class="op">,</span> gpointer user_data<span class="op">)</span> <span class="op">{</span></span>
|
|
|
|
|
|
<span id="cb4-76"><a href="#cb4-76"></a> <span class="cf">if</span> <span class="op">(</span>surface<span class="op">)</span> <span class="op">{</span></span>
|
|
|
|
|
|
<span id="cb4-77"><a href="#cb4-77"></a> cairo_set_source_surface <span class="op">(</span>cr<span class="op">,</span> surface<span class="op">,</span> <span class="dv">0</span><span class="op">,</span> <span class="dv">0</span><span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-78"><a href="#cb4-78"></a> cairo_paint <span class="op">(</span>cr<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-79"><a href="#cb4-79"></a> <span class="op">}</span></span>
|
|
|
|
|
|
<span id="cb4-80"><a href="#cb4-80"></a><span class="op">}</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-81"><a href="#cb4-81"></a></span>
|
|
|
|
|
|
<span id="cb4-82"><a href="#cb4-82"></a><span class="dt">static</span> <span class="dt">void</span></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-83"><a href="#cb4-83"></a>app_activate <span class="op">(</span>GApplication <span class="op">*</span>application<span class="op">)</span> <span class="op">{</span></span>
|
|
|
|
|
|
<span id="cb4-84"><a href="#cb4-84"></a> gtk_widget_show <span class="op">(</span>win<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-85"><a href="#cb4-85"></a><span class="op">}</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-86"><a href="#cb4-86"></a></span>
|
|
|
|
|
|
<span id="cb4-87"><a href="#cb4-87"></a><span class="dt">static</span> <span class="dt">void</span></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-88"><a href="#cb4-88"></a>app_startup <span class="op">(</span>GApplication <span class="op">*</span>application<span class="op">)</span> <span class="op">{</span></span>
|
|
|
|
|
|
<span id="cb4-89"><a href="#cb4-89"></a> GtkApplication <span class="op">*</span>app <span class="op">=</span> GTK_APPLICATION <span class="op">(</span>application<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-90"><a href="#cb4-90"></a> GtkBuilder <span class="op">*</span>build<span class="op">;</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-91"><a href="#cb4-91"></a></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-92"><a href="#cb4-92"></a> build <span class="op">=</span> gtk_builder_new_from_resource <span class="op">(</span><span class="st">"/com/github/ToshioCP/color/color.ui"</span><span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-93"><a href="#cb4-93"></a> win <span class="op">=</span> GTK_WIDGET <span class="op">(</span>gtk_builder_get_object <span class="op">(</span>build<span class="op">,</span> <span class="st">"win"</span><span class="op">));</span></span>
|
|
|
|
|
|
<span id="cb4-94"><a href="#cb4-94"></a> gtk_window_set_application <span class="op">(</span>GTK_WINDOW <span class="op">(</span>win<span class="op">),</span> app<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-95"><a href="#cb4-95"></a> tv <span class="op">=</span> GTK_WIDGET <span class="op">(</span>gtk_builder_get_object <span class="op">(</span>build<span class="op">,</span> <span class="st">"tv"</span><span class="op">));</span></span>
|
|
|
|
|
|
<span id="cb4-96"><a href="#cb4-96"></a> da <span class="op">=</span> GTK_WIDGET <span class="op">(</span>gtk_builder_get_object <span class="op">(</span>build<span class="op">,</span> <span class="st">"da"</span><span class="op">));</span></span>
|
|
|
|
|
|
<span id="cb4-97"><a href="#cb4-97"></a> g_object_unref<span class="op">(</span>build<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-98"><a href="#cb4-98"></a> g_signal_connect <span class="op">(</span>GTK_DRAWING_AREA <span class="op">(</span>da<span class="op">),</span> <span class="st">"resize"</span><span class="op">,</span> G_CALLBACK <span class="op">(</span>resize_cb<span class="op">),</span> NULL<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-99"><a href="#cb4-99"></a> gtk_drawing_area_set_draw_func <span class="op">(</span>GTK_DRAWING_AREA <span class="op">(</span>da<span class="op">),</span> draw_func<span class="op">,</span> NULL<span class="op">,</span> NULL<span class="op">);</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-100"><a href="#cb4-100"></a></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-101"><a href="#cb4-101"></a>GdkDisplay <span class="op">*</span>display<span class="op">;</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-102"><a href="#cb4-102"></a></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-103"><a href="#cb4-103"></a> display <span class="op">=</span> gtk_widget_get_display <span class="op">(</span>GTK_WIDGET <span class="op">(</span>win<span class="op">));</span></span>
|
|
|
|
|
|
<span id="cb4-104"><a href="#cb4-104"></a> GtkCssProvider <span class="op">*</span>provider <span class="op">=</span> gtk_css_provider_new <span class="op">();</span></span>
|
|
|
|
|
|
<span id="cb4-105"><a href="#cb4-105"></a> gtk_css_provider_load_from_data <span class="op">(</span>provider<span class="op">,</span> <span class="st">"textview {padding: 10px; font-family: monospace; font-size: 12pt;}"</span><span class="op">,</span> <span class="op">-</span><span class="dv">1</span><span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-106"><a href="#cb4-106"></a> gtk_style_context_add_provider_for_display <span class="op">(</span>display<span class="op">,</span> GTK_STYLE_PROVIDER <span class="op">(</span>provider<span class="op">),</span> GTK_STYLE_PROVIDER_PRIORITY_USER<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-107"><a href="#cb4-107"></a><span class="op">}</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-108"><a href="#cb4-108"></a></span>
|
|
|
|
|
|
<span id="cb4-109"><a href="#cb4-109"></a><span class="pp">#define APPLICATION_ID "com.github.ToshioCP.color"</span></span>
|
|
|
|
|
|
<span id="cb4-110"><a href="#cb4-110"></a></span>
|
|
|
|
|
|
<span id="cb4-111"><a href="#cb4-111"></a><span class="dt">int</span></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-112"><a href="#cb4-112"></a>main <span class="op">(</span><span class="dt">int</span> argc<span class="op">,</span> <span class="dt">char</span> <span class="op">**</span>argv<span class="op">)</span> <span class="op">{</span></span>
|
|
|
|
|
|
<span id="cb4-113"><a href="#cb4-113"></a> GtkApplication <span class="op">*</span>app<span class="op">;</span></span>
|
|
|
|
|
|
<span id="cb4-114"><a href="#cb4-114"></a> <span class="dt">int</span> stat<span class="op">;</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-115"><a href="#cb4-115"></a></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-116"><a href="#cb4-116"></a> app <span class="op">=</span> gtk_application_new <span class="op">(</span>APPLICATION_ID<span class="op">,</span> G_APPLICATION_FLAGS_NONE<span class="op">);</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-117"><a href="#cb4-117"></a></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-118"><a href="#cb4-118"></a> g_signal_connect <span class="op">(</span>app<span class="op">,</span> <span class="st">"startup"</span><span class="op">,</span> G_CALLBACK <span class="op">(</span>app_startup<span class="op">),</span> NULL<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-119"><a href="#cb4-119"></a> g_signal_connect <span class="op">(</span>app<span class="op">,</span> <span class="st">"activate"</span><span class="op">,</span> G_CALLBACK <span class="op">(</span>app_activate<span class="op">),</span> NULL<span class="op">);</span></span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb4-120"><a href="#cb4-120"></a></span>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<span id="cb4-121"><a href="#cb4-121"></a> stat <span class="op">=</span>g_application_run <span class="op">(</span>G_APPLICATION <span class="op">(</span>app<span class="op">),</span> argc<span class="op">,</span> argv<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-122"><a href="#cb4-122"></a> g_object_unref <span class="op">(</span>app<span class="op">);</span></span>
|
|
|
|
|
|
<span id="cb4-123"><a href="#cb4-123"></a> <span class="cf">return</span> stat<span class="op">;</span></span>
|
|
|
|
|
|
<span id="cb4-124"><a href="#cb4-124"></a><span class="op">}</span></span></code></pre></div>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<ul>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<li>109-124: The function <code>main</code> is almost same as before but
|
|
|
|
|
|
there are some differences. The application ID is
|
|
|
|
|
|
“com.github.ToshioCP.color”. <code>G_APPLICATION_FLAGS_NONE</code> is
|
|
|
|
|
|
specified so no open signal handler is necessary.</li>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<li>87-107: Startup handler.</li>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<li>92-97: Builds widgets. The pointers of the top window, TfeTextView
|
|
|
|
|
|
and GtkDrawingArea objects are stored to static variables
|
|
|
|
|
|
<code>win</code>, <code>tv</code> and <code>da</code> respectively. This
|
|
|
|
|
|
is because these objects are often used in handlers. They never be
|
|
|
|
|
|
rewritten so they’re thread safe.</li>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<li>98: connects “resize” signal and the handler.</li>
|
|
|
|
|
|
<li>99: sets the drawing function.</li>
|
|
|
|
|
|
<li>82-85: Activate handler, which just shows the widgets.</li>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<li>74-80: The drawing function. It just copies <code>surface</code> to
|
|
|
|
|
|
destination.</li>
|
|
|
|
|
|
<li>66-72: Resize handler. Re-creates the surface to fit its width and
|
|
|
|
|
|
height for the drawing area and paints by calling the function
|
|
|
|
|
|
<code>run</code>.</li>
|
|
|
|
|
|
<li>59-64: Close handler. It destroys <code>surface</code> if it exists.
|
|
|
|
|
|
Then it destroys the top-level window and quits the application.</li>
|
|
|
|
|
|
<li>49-57: Open and save handler. They just call the corresponding
|
|
|
|
|
|
functions of TfeTextView.</li>
|
|
|
|
|
|
<li>43-47: Run handler. It calls run function to paint the surface.
|
|
|
|
|
|
After that <code>gtk_widget_queue_draw</code> is called. This function
|
|
|
|
|
|
adds the widget (GtkDrawingArea) to the queue to be redrawn. It is
|
|
|
|
|
|
important to know that the window is redrawn whenever it is necessary.
|
|
|
|
|
|
For example, when another window is moved and uncovers part of the
|
|
|
|
|
|
widget, or when the window containing it is resized. But repainting
|
|
|
|
|
|
<code>surface</code> is not automatically notified to gtk. Therefore,
|
|
|
|
|
|
you need to call <code>gtk_widget_queue_draw</code> to redraw the
|
|
|
|
|
|
widget.</li>
|
|
|
|
|
|
<li>9-41: Run function paints the surface. First, it gets the contents
|
|
|
|
|
|
of GtkTextBuffer. Then it compares it to “red”, “green” and so on. If it
|
|
|
|
|
|
matches the color, then the surface is painted the color. If it matches
|
|
|
|
|
|
“light” or “dark”, then the color of the surface is lightened or
|
|
|
|
|
|
darkened respectively. Alpha channel is used.</li>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
</ul>
|
|
|
|
|
|
<h2 id="meson.build">Meson.build</h2>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<p>This file is almost same as before. An argument “export_dynamic:
|
|
|
|
|
|
true” is added to executable function.</p>
|
|
|
|
|
|
<div class="sourceCode" id="cb5"><pre
|
|
|
|
|
|
class="sourceCode numberSource numberLines"><code class="sourceCode"><span id="cb5-1"><a href="#cb5-1"></a>project('color', 'c')</span>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<span id="cb5-2"><a href="#cb5-2"></a></span>
|
|
|
|
|
|
<span id="cb5-3"><a href="#cb5-3"></a>gtkdep = dependency('gtk4')</span>
|
|
|
|
|
|
<span id="cb5-4"><a href="#cb5-4"></a></span>
|
|
|
|
|
|
<span id="cb5-5"><a href="#cb5-5"></a>gnome=import('gnome')</span>
|
|
|
|
|
|
<span id="cb5-6"><a href="#cb5-6"></a>resources = gnome.compile_resources('resources','color.gresource.xml')</span>
|
|
|
|
|
|
<span id="cb5-7"><a href="#cb5-7"></a></span>
|
|
|
|
|
|
<span id="cb5-8"><a href="#cb5-8"></a>sourcefiles=files('colorapplication.c', '../tfetextview/tfetextview.c')</span>
|
|
|
|
|
|
<span id="cb5-9"><a href="#cb5-9"></a></span>
|
|
|
|
|
|
<span id="cb5-10"><a href="#cb5-10"></a>executable('color', sourcefiles, resources, dependencies: gtkdep, export_dynamic: true)</span></code></pre></div>
|
|
|
|
|
|
<h2 id="compile-and-execute-it">Compile and execute it</h2>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<p>First you need to export some variables (refer to <a
|
|
|
|
|
|
href="sec2.html">Section 2</a>) if you’ve installed GTK 4 from the
|
|
|
|
|
|
source. If you’ve installed GTK 4 from the distribution packages, you
|
|
|
|
|
|
don’t need to do this.</p>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<pre><code>$ . env.sh</code></pre>
|
|
|
|
|
|
<p>Then type the following to compile it.</p>
|
|
|
|
|
|
<pre><code>$ meson _build
|
|
|
|
|
|
$ ninja -C _build</code></pre>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<p>The application is made in <code>_build</code> directory. Type the
|
|
|
|
|
|
following to execute it.</p>
|
2022-04-17 13:54:42 +02:00
|
|
|
|
<pre><code>$ _build/color</code></pre>
|
2022-11-21 14:48:20 +01:00
|
|
|
|
<p>Type “red”, “green”, “blue”, “white”, black”, “light” or “dark” in
|
|
|
|
|
|
the TfeTextView. Then, click on <code>Run</code> button. Make sure the
|
|
|
|
|
|
color of GtkDrawingArea changes.</p>
|
|
|
|
|
|
<p>In this program TfeTextView is used to change the color. You can use
|
|
|
|
|
|
buttons or menus instead of textview. Probably it is more appropriate.
|
|
|
|
|
|
Using textview is unnatural. It is a good practice to make such
|
|
|
|
|
|
application by yourself.</p>
|
2022-04-21 16:53:28 +02:00
|
|
|
|
</div>
|
|
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
</html>
|
