gt4 css transformation

transform.py

#!/usr/bin/env python

import gi
gi.require_version("Gtk", "4.0")
from gi.repository import Gtk, Gdk, GLib
import random

class TransformImageApp(Gtk.Application):
    def __init__(self):
        super().__init__(application_id="org.example.TransformImageApp")
        self.angle = 0

    def do_activate(self):
        self.window = Gtk.ApplicationWindow(application=self)
        self.window.set_title("Image Transformations")
        self.window.set_default_size(400, 400)

        self.picture = Gtk.Picture.new_for_filename("gtk4.jpg")

        self.picture.add_css_class("transform-picture")

        self.window.set_child(self.picture)

        self.css_provider = Gtk.CssProvider()
        self.load_css()
        Gtk.StyleContext.add_provider_for_display(
            Gdk.Display.get_default(),
            self.css_provider,
            Gtk.STYLE_PROVIDER_PRIORITY_APPLICATION,
        )

        GLib.timeout_add_seconds(1, self.update_transformation)

        self.window.present()

    def load_css(self):
        base_css = b"""
        .transform-picture {
            transform: rotate(0deg);
        }
        """
        self.css_provider.load_from_data(base_css)

    def update_transformation(self):
        self.angle += 15
        self.angle = self.angle % 360

        transformations = [
            f"rotate({self.angle}deg)",
            f"scale(1.5)",
            f"perspective(500px) rotateX({random.randint(10, 45)}deg)",
            f"perspective(300px) rotateY({random.randint(10, 45)}deg)",
            "rotate(0deg)",
        ]
        current_transformation = random.choice(transformations)
        updated_css = f"""
        .transform-picture {{
            transform: {current_transformation};
            transition: transform 0.5s ease-in-out;
        }}
        """

        self.css_provider.load_from_data(updated_css.encode("utf-8"))

        return True

app = TransformImageApp()
app.run([])

css-transform.mp4