Расположение метки кадра gtk3 3.18 против 3.22 - PullRequest
Новая
       11

Расположение метки кадра gtk3 3.18 против 3.22

3 голосов
/ 12 марта 2019

Я получаю разные визуальные результаты, используя один и тот же код на Gtk 3.18 против Gtk 3.22.Код ниже создает Gtk.Frame и показывает его в окне.Рамка Gtk имеет красную рамку, а текст метки рамки гласит «Текст метки рамки».

Вот снимок экрана Gtk 3.18 .Текст метки кадра появляется над красной рамкой.

Вот снимок экрана Gtk 3.22 .Текст метки кадра отображается НИЖЕ красной границы рамки.

Мой вопрос, как я могу заставить Gtk 3.22 вести себя как Gtk 3.18 и показывать метку выше границы рамки?

Воткод: 

import gi
gi.require_version('Gtk', '3.0')
from gi.repository import Gtk # pylint: disable=wrong-import-position

class GtkWindow(Gtk.Window):
    def __init__(self):
        Gtk.Window.__init__(self)

    def showme(self):
        window = Gtk.Window()
        gtk_version = "Gtk Version major:{0}, minor:{1}, micro: {2}".format(Gtk.MAJOR_VERSION, Gtk.MINOR_VERSION, Gtk.MICRO_VERSION)
        window.set_title(gtk_version)
        window.set_default_size(480, 320)
        window.connect("delete-event", Gtk.main_quit)
        frame = Gtk.Frame.new("Frame Label Text")
        frame.set_label_align(0.0, 1.0)
        inner_label = Gtk.Label("I am a child label")
        frame.add(inner_label)
        window.add(frame)

        css = b'''
            .frame {
            border-radius : 10px;
            border: 5px solid red;
            background-color: gray;
            color : white;
            }
            .label {
                border-radius : 5px;
                border: 2px solid yellow;
                background-color : gray;
                color: white;
            }
        '''
        css_provider = Gtk.CssProvider()
        css_provider.load_from_data(css)
        frame_style_context = frame.get_style_context()
        frame_style_context.add_class("frame")
        frame_style_context.add_provider(css_provider, Gtk.STYLE_PROVIDER_PRIORITY_USER)
        label_style_context = frame.get_label_widget().get_style_context()
        label_style_context.add_class("label")
        label_style_context.add_provider(css_provider, Gtk.STYLE_PROVIDER_PRIORITY_USER)
        window.show_all()

if __name__ == "__main__":
    win = GtkWindow()
    win.showme()
    Gtk.main()

Ответы [ 2 ]

0 голосов
/ 12 марта 2019

TL; DR, Gtk 3.18 и Gtk 3.22 несовместимы и дают очень разные визуальные результаты из одного и того же кода. Я смог получить эффект, который искал на Gtk 3.22, настроив css, но это полностью сломало отображение в Gtk 3.18.

Вот результаты на Gtk 3.22

Вот результаты на Gtk 3.18

Ниже приведен код, основанный на коде Александра Дмитриева, который работает на Gtk 3.22. Это прежде всего css изменения. 

import gi
gi.require_version('Gtk', '3.0')
from gi.repository import Gtk # pylint: disable=wrong-import-position

class GtkWindow(Gtk.Window):
    def __init__(self):
        Gtk.Window.__init__(self)

    def showme(self):
        window = Gtk.Window()
        gtk_version = "Gtk Version major:{0}, minor:{1}, micro: {2}".format(Gtk.MAJOR_VERSION, Gtk.MINOR_VERSION, Gtk.MICRO_VERSION)
        window.set_title(gtk_version)
        window.set_default_size(480, 320)
        window.connect("delete-event", Gtk.main_quit)
        frame = Gtk.Frame.new("Frame Label Text")
        frame.set_label_align(0.0, 1.0)
        inner_label = Gtk.Label("I am a child label")
        frame.add(inner_label)
        window.add(frame)

        css = b'''
        .frame {
        border-radius: 0px;
        border: none;
        background-color: white;
        color: white;
        }

        .frame>border {
        border-radius: 10px;
        border: 5px solid red;
        background-color: gray;
        color: white;
        }

        .frame>label {
        border-radius: 5px;
        border: 2px solid yellow;
        background-color: gray;
        color: white;
        }'''

        css_provider = Gtk.CssProvider()
        css_provider.load_from_data(css)
        frame_style_context = frame.get_style_context()
        frame_style_context.add_class("frame")
        frame_style_context.add_provider(css_provider, Gtk.STYLE_PROVIDER_PRIORITY_USER)
        label_style_context = frame.get_label_widget().get_style_context()
        #label_style_context.add_class("label")
        label_style_context.add_provider(css_provider, Gtk.STYLE_PROVIDER_PRIORITY_USER)
        window.show_all()

if __name__ == "__main__":
    win = GtkWindow()
    win.showme()
    Gtk.main()

Для справки: Gtk 3.18.9 - это то, что поставляется с Ubuntu 16.04. Gtk 3.22.11 - это то, что поставляется с Raspbian Stretch на Raspberry Pi. Поэтому я думаю, что обновлюсь до Ubuntu 18.04, которая поставляется с Gtk 3.22. И тогда, я думаю, мне придется переписать свой уровень представления.

0 голосов
/ 12 марта 2019

GtkCss много изменилось в 3.20.

Я не эксперт в GtkCss, но, похоже, в 3.22 .frame класс относится ко всему виджету (см. Раздел «Узлы Css» здесь ). Чтобы все заработало, вы должны настроить правила CSS и определить точную версию Gtk.

Сравните следующие правила CSS:

3.14 (у меня нет 3.18, но выглядит так же) 

.frame {
  border-radius: 10px;
  border: 5px solid red;
  background-color: gray;
  color: white;
}

.label {
  border-radius: 5px;
  border: 2px solid yellow;
  background-color: gray;
  color: white;
}

.frame.border {
  border-radius: 5px;
  border: 2px solid green;
  background-color: cyan;
  color: magenta;
}

3,22 

.frame {
  border-radius: 10px;
  border: 5px solid red;
  background-color: gray;
  color: white;
}

.frame>border {
  border-radius: 5px;
  border: 2px solid green;
  background-color: cyan;
  color: magenta;
}

.frame>label {
  border-radius: 5px;
  border: 2px solid yellow;
  background-color: gray;
  color: white;
}

Они выглядят так . Также обратите внимание, что я установил вертикальное выравнивание метки кадра на 0,5, чтобы его было легко различить

...