Como criar um widget deslizante (GTK +, Rapidamente)

Question

Recentemente, vi esse widget no Gedit:

Aparece quando você pressiona Ctrl + F . O que eu estou interessado é em como obter o efeito de deslizamento. Qualquer sugestão será apreciada.

    

Answer 1

Eu consegui um efeito de fade-out usando pure GTK e CSS.

Ele está apenas trabalhando no GTK 3.6 e eu não tenho certeza se um efeito slide in / out seria possível, no entanto, se você quiser, você pode olhar para a fonte em launchpad.net/uberwriter

Funciona por meio de uma mudança de estado e, em seguida, do GTK Transitions ... Talvez com altura // largura que seria possível também.

EDITAR

Como as pessoas obviamente me depreciam, eis outra explicação mais detalhada:

Este é o CSS que usei:

GtkLabel:insensitive {
    color: rgba(255,255,255,0);
    transition: 500ms ease-in-out;
}

Se você usar isso como CSS (espero que eu possa referenciar uma explicação de mim mesmo, como: link ) então você pode usar Gtk.StateFlags para diminuir o rótulo.

por exemplo:

label.set_state_flags(Gtk.StateFlags.INSENSITIVE, True)

Então você começa uma transição para zero de opacidade.

No entanto, como eu notei, não há muitas opções para influenciar o posicionamento / largura com CSS, então acho que é limitado a cores / opacidade, etc.

Aproveite.

PS: Note que este somente funciona no Gtk 3.6, desde o Ubuntu 12.10

    

Answer 2

Essa animação não é alcançável no puro GTK +. Não há mecanismos que possam processá-lo.

Eu dei uma olhada rápida no código-fonte do gedit, está claro que eles processam essa animação por conta própria. Não examinei detalhes, pois o código relacionado às animações está bastante expandido, mas observei que eles incorporam recursos de desenho do Cairo para o widget de pesquisa animado. O mais provável é que o widget seja animado movendo sua posição quadro a quadro e redesenhando-o em um local diferente na sobreposição usada em uma única área de exibição de texto.

Essa parece ser a solução mais simples. (o código do gedit parece estar preparado para muitas animações compartilhando a mesma base de código, portanto, pode ser um exagero usar a abordagem exata em um aplicativo simples.)

Para reproduzir esse efeito, você precisará:

• Use um widget personalizado para a parte da interface do usuário que você deseja inserir / excluir.
• Faça reagir em desenhar eventos e tempos limite periódicos (para redesenhar cada quadro de animação)
• Crie uma sobreposição transparente sobre o restante de seus widgets (ou qualquer área que precise aparecer como se estivesse abaixo do widget deslizante)
• Desenhe o widget animado manualmente nessa superposição.

Eu não consigo encontrar uma solução mais fácil. No entanto, considerando o fato de que desenvolvedores de gedit conhecem o GTK + provavelmente como muito pouco, pode não haver um truque mais simples para obter tal efeito.

    

Answer 3

Você pode usar uma combinação entre Gtk.fixed (), GObject.timeout_add e a função move, aqui está um exemplo em python:

#!/usr/bin/python*
from gi.repository import Gtk, GObject

class TestWindow(Gtk.Window):
     def animateImage(self):
        GObject.timeout_add(150,self.slideImage)

     def slideImage(self):
        self.positionX += 50;
        if(self.positionX > 800):
          self.fixedWidget.move(self.logo,self.positionX,200)
          return True        
        else:
          return False 

     def __init__(self):
        Gtk.Window.__init__(self, title='Registration')

        self.positionX = 500
        self.fixedWidget = Gtk.Fixed()
        self.fixedWidget.set_size_request(1920,1080)
        self.fixedWidget.show()

        self.logo = Gtk.Image.new_from_file('picture.png')
        self.logo.show()
        self.fixedWidget.put(self.logo,self.positionX,200)

        self.button1 = Gtk.Button('Click me to slide image!')
        self.button1.show()
        self.button1.connect('clicked', self.animateImage)
        self.button1.set_size_request(75,30)
        self.fixedWidget.put(self.button1,750,750)
        self.add(self.fixedWidget)

testWindow = TestWindow()
testWindow.set_size_request(1920,1080)
testWindow.set_name('testWindow')
testWindow.show()

Gtk.main()

    

Answer 4

Hoje em dia, há uma resposta real para essa questão. Desde que foi originalmente perguntado e respondido, o código para revelar um widget de libgd - que presumo que é o que o GEdit estava usando naquela época - foi transferido para o GTK + como GtkRevealer :

link

GtkRevealer suporta várias formas de transição, incluindo as direções cardeais do slide e um enfraquecimento da opacidade.

Atualmente, é tão simples quanto adicionar o widget que você deseja fazer a transição para um GtkRevealer e usar suas propriedades :transition-(type|duration) e :reveal-child .