GTK 揭示者和窗格

问题描述 投票:0回答:2

我希望本质上有一个图像/绘图表面作为主要小部件,但随后有某种可以显示的面板或小部件。

----------------

      Image

----------------
xxxxxxxxxxxxxxxx
----------------

xxx 基本上是用户可以用来与应用程序交互的东西(gtk 小部件),但他们可以将其最小化,应用程序也可以将其最小化(例如幻灯片放映)。

因此,A 窗格允许用户调整大小以适合他们,但我还需要能够完全最小化和恢复其大小(许多应用程序都有一个箭头,如 Photoshop,可以显示底层小部件)并且也能够轻松地做到这一点以编程方式。

这是因为该应用程序有两种模式:主要查看图像,其中不应该看到任何其他内容,然后是编辑模式,该模式具有浮动工具栏和底部区域,可提供更高级的编辑功能和内容。用户和应用程序需要能够在这些模式之间轻松切换。

有什么想法吗?我是 gtk 新手,所以这可能是显而易见的。我认为垂直窗格可以很好地工作,我可以添加一个小按钮,可用于展开或折叠底部容器部分......但我看到那里的揭示者,它似乎可以为我做这一切,但不是确定如何使用它。

gtk gtk3 glade
2个回答
2
投票

嗯,这个问题在很多方面都很广泛,因为有很多方法、设计意见等等。

事实上,GtkPaned 不是最好的选择,尽管它适合您的目的。关于 GtkRevealer 它是一个不错的选择,并且与 GtkOverlay 结合它会很好地工作。

GtkRevealer 基本上是一个小部件容器,可以使用方法/函数

set_reveal_child
切换可见性。此动作可以有动画过渡。

GtkOverlay 允许小部件彼此堆叠。

这是一个简单的例子。不确定我是否完全理解你的目标:

右上角的按钮将切换编辑/查看模式,编辑模式在底部显示“工具栏”。

这是空地 ui 文件(名为

idea.ui
否则更改代码以反映更改):

<?xml version="1.0" encoding="UTF-8"?>
<!-- Generated with glade 3.20.0 -->
<interface>
  <requires lib="gtk+" version="3.20"/>
  <object class="GtkWindow" id="window1">
    <property name="can_focus">False</property>
    <child>
      <object class="GtkOverlay">
        <property name="visible">True</property>
        <property name="can_focus">False</property>
        <child>
          <object class="GtkImage">
            <property name="visible">True</property>
            <property name="can_focus">False</property>
            <property name="pixbuf">idea.png</property>
          </object>
          <packing>
            <property name="index">-1</property>
          </packing>
        </child>
        <child type="overlay">
          <object class="GtkRevealer" id="revealer1">
            <property name="visible">True</property>
            <property name="can_focus">False</property>
            <property name="transition_type">crossfade</property>
            <child>
              <object class="GtkButtonBox">
                <property name="visible">True</property>
                <property name="can_focus">False</property>
                <property name="halign">center</property>
                <property name="valign">end</property>
                <property name="margin_bottom">20</property>
                <property name="layout_style">expand</property>
                <child>
                  <object class="GtkButton">
                    <property name="visible">True</property>
                    <property name="can_focus">True</property>
                    <property name="receives_default">True</property>
                    <property name="valign">center</property>
                    <child>
                      <object class="GtkImage">
                        <property name="visible">True</property>
                        <property name="can_focus">False</property>
                        <property name="icon_name">document-edit-symbolic.symbolic</property>
                      </object>
                    </child>
                  </object>
                  <packing>
                    <property name="expand">True</property>
                    <property name="fill">True</property>
                    <property name="position">0</property>
                  </packing>
                </child>
                <child>
                  <object class="GtkButton">
                    <property name="visible">True</property>
                    <property name="can_focus">True</property>
                    <property name="receives_default">True</property>
                    <child>
                      <object class="GtkImage">
                        <property name="visible">True</property>
                        <property name="can_focus">False</property>
                        <property name="icon_name">edit-cut-symbolic.symbolic</property>
                      </object>
                    </child>
                  </object>
                  <packing>
                    <property name="expand">True</property>
                    <property name="fill">True</property>
                    <property name="position">1</property>
                  </packing>
                </child>
                <child>
                  <object class="GtkButton">
                    <property name="visible">True</property>
                    <property name="can_focus">True</property>
                    <property name="receives_default">True</property>
                    <child>
                      <object class="GtkImage">
                        <property name="visible">True</property>
                        <property name="can_focus">False</property>
                        <property name="icon_name">edit-clear-all-symbolic.symbolic</property>
                      </object>
                    </child>
                  </object>
                  <packing>
                    <property name="expand">True</property>
                    <property name="fill">True</property>
                    <property name="position">2</property>
                  </packing>
                </child>
                <child>
                  <object class="GtkButton">
                    <property name="visible">True</property>
                    <property name="can_focus">True</property>
                    <property name="receives_default">True</property>
                    <child>
                      <object class="GtkImage">
                        <property name="visible">True</property>
                        <property name="can_focus">False</property>
                        <property name="icon_name">color-select-symbolic.symbolic</property>
                      </object>
                    </child>
                  </object>
                  <packing>
                    <property name="expand">True</property>
                    <property name="fill">True</property>
                    <property name="position">3</property>
                  </packing>
                </child>
                <child>
                  <object class="GtkButton">
                    <property name="visible">True</property>
                    <property name="can_focus">True</property>
                    <property name="receives_default">True</property>
                    <child>
                      <object class="GtkImage">
                        <property name="visible">True</property>
                        <property name="can_focus">False</property>
                        <property name="icon_name">format-text-bold-symbolic.symbolic</property>
                      </object>
                    </child>
                  </object>
                  <packing>
                    <property name="expand">True</property>
                    <property name="fill">True</property>
                    <property name="position">4</property>
                  </packing>
                </child>
                <child>
                  <object class="GtkButton">
                    <property name="visible">True</property>
                    <property name="can_focus">True</property>
                    <property name="receives_default">True</property>
                    <child>
                      <object class="GtkImage">
                        <property name="visible">True</property>
                        <property name="can_focus">False</property>
                        <property name="icon_name">preferences-color-symbolic.symbolic</property>
                      </object>
                    </child>
                  </object>
                  <packing>
                    <property name="expand">True</property>
                    <property name="fill">True</property>
                    <property name="position">5</property>
                  </packing>
                </child>
                <child>
                  <object class="GtkButton">
                    <property name="visible">True</property>
                    <property name="can_focus">True</property>
                    <property name="receives_default">True</property>
                    <child>
                      <object class="GtkImage">
                        <property name="visible">True</property>
                        <property name="can_focus">False</property>
                        <property name="icon_name">folder-publicshare-symbolic.symbolic</property>
                      </object>
                    </child>
                  </object>
                  <packing>
                    <property name="expand">True</property>
                    <property name="fill">True</property>
                    <property name="position">6</property>
                  </packing>
                </child>
                <child>
                  <object class="GtkButton">
                    <property name="visible">True</property>
                    <property name="can_focus">True</property>
                    <property name="receives_default">True</property>
                    <child>
                      <object class="GtkImage">
                        <property name="visible">True</property>
                        <property name="can_focus">False</property>
                        <property name="icon_name">view-app-grid-symbolic.symbolic</property>
                      </object>
                    </child>
                  </object>
                  <packing>
                    <property name="expand">True</property>
                    <property name="fill">True</property>
                    <property name="position">7</property>
                  </packing>
                </child>
                <style>
                  <class name="linked"/>
                </style>
              </object>
            </child>
          </object>
        </child>
        <child type="overlay">
          <object class="GtkButton" id="button1">
            <property name="visible">True</property>
            <property name="can_focus">True</property>
            <property name="receives_default">True</property>
            <property name="halign">end</property>
            <property name="valign">start</property>
            <property name="margin_right">20</property>
            <property name="margin_top">20</property>
            <property name="relief">none</property>
            <child>
              <object class="GtkImage">
                <property name="visible">True</property>
                <property name="can_focus">False</property>
                <property name="icon_name">open-menu-symbolic.symbolic</property>
              </object>
            </child>
          </object>
          <packing>
            <property name="index">1</property>
          </packing>
        </child>
      </object>
    </child>
  </object>
</interface>

由于您没有指明任何编程语言,为了简单起见,我使用了一个简单的 python 代码来为按钮提供一些动态行为:

import gi
gi.require_version('Gtk', '3.0')
from gi.repository import Gtk

def onMenuClicked(self):
    revealer.set_reveal_child(not revealer.get_reveal_child()) 

builder = Gtk.Builder()
builder.add_from_file("idea.ui")

window = builder.get_object("window1")
revealer = builder.get_object("revealer1")
menuButton = builder.get_object("button1")
menuButton.connect ("clicked", onMenuClicked)

window.connect ("destroy", Gtk.main_quit)
window.show_all()

Gtk.main()

“工具栏”按钮是虚拟按钮,不执行任何操作...这只是一个简单的模型。

您可以遵循许多其他方法,因此不确定这个问题是否适合SO指南,因为它的答案很模糊。不过祝你好运。

PS:对于绘图区域GtkImage,您可以使用其他图像。为了避免许可证问题,我使用了一些非常基本的东西:)如果您愿意,可以将林间空地文件更改为指向另一个图像或保存名为

idea.png
的图像。


0
投票

您好,用 C 语言编写相同的程序,很有趣

#include <gtk/gtk.h>
#include <gtksourceview/gtksource.h>
//application_03.c
/*  Compile with:
 *  gcc -std=c11 -Wall -fmax-errors=10 -Wextra idea.c -o idea `pkg-config --cflags --libs gtk+-3.0 `
 */
int CB_DEBUG = TRUE;

static void do_open(GtkApplication *app, gpointer *user_data)
{
    /* action préparatoire pour ouvrir des ressources */
    if (CB_DEBUG == TRUE)
        g_print("Action préparatoire ouverture des ressources................\n\n");
    /* Parametres inutilises */
    (void)app;
    (void)user_data;
}

static void do_startup(GtkApplication *app, gpointer *user_data)
{
    /* action au lancement */
    if (CB_DEBUG == TRUE)
        g_print("Action préparatoire au lancement.................\n\n");
    /* ajout d'un logo */
    (void)app;
    (void)user_data;
}

        
void onMenuClicked(GtkWidget *widget, gpointer revealer) 
{
    gtk_revealer_set_reveal_child(GTK_REVEALER(revealer), (! gtk_revealer_get_child_revealed(GTK_REVEALER(revealer))));
    (void)widget;
}   


static void do_activate (GtkApplication *app, gpointer user_data)
/* cb_ApplicationActivate est un call back qui prépare les tâches à réaliser
 * quand l'application sera lancée
 * les autres fonctions préparatives  startup et open, ni shutdown pour gérer 
 * la fin ne sont pas utilisées ici
 */
{
    /* Create a window with a title, and a default size */
    GtkWidget *windowz = gtk_application_window_new (app);
    gtk_window_set_title (GTK_WINDOW (windowz), "sourceview Example with gtksource view");
    gtk_window_set_default_size (GTK_WINDOW(windowz), 660, 500);
    
    GtkBuilder *builder= gtk_builder_new_from_file("idea.ui");
    GtkWidget *window = GTK_WIDGET (gtk_builder_get_object(builder,"window1"));
    GtkWidget *revealer = GTK_WIDGET (gtk_builder_get_object(builder,"revealer1"));
    GtkWidget * menuButton = GTK_WIDGET (gtk_builder_get_object(builder,"button1"));
    g_signal_connect(G_OBJECT(menuButton), "clicked", G_CALLBACK(onMenuClicked), revealer);

    gtk_widget_set_size_request(window,600,600);
    gtk_widget_show_all (window);
    gtk_widget_show_all (revealer);
    gtk_widget_show_all (menuButton);
    
    /* Parametres inutilises */
    (void)user_data;
    (void)app;
}

static void do_shutdown (GtkApplication *app, gpointer *user_data)
{
    /* action de fin */
    if (CB_DEBUG == TRUE)
        g_print("Action de sécurisation à la fermeture ..............\n\n");
    /* Parametres inutilises */
    (void)app;
    (void)user_data;
}


int main (int argc, char **argv)
{
    if (CB_DEBUG == TRUE)
    {
        g_print("Maquette fonction do_mon_oeuvre\n");
    }
    GtkApplication *app = gtk_application_new ("org.gtk.example1", G_APPLICATION_FLAGS_NONE);
    g_signal_connect (app, "open", G_CALLBACK (do_open), NULL);
    g_signal_connect (app, "startup", G_CALLBACK (do_startup), NULL);
    g_signal_connect (app, "activate", G_CALLBACK (do_activate), NULL);
    g_signal_connect (app, "shutdown", G_CALLBACK (do_shutdown), NULL);
    int status = g_application_run (G_APPLICATION (app), argc, argv);
    g_object_unref (app);
    return status;
}
© www.soinside.com 2019 - 2024. All rights reserved.