Skip to content

Instantly share code, notes, and snippets.

@diazvictor
Created February 12, 2021 06:11
Show Gist options
  • Save diazvictor/905e7dd76a54c63f319c8355e2c2cf52 to your computer and use it in GitHub Desktop.
Save diazvictor/905e7dd76a54c63f319c8355e2c2cf52 to your computer and use it in GitHub Desktop.
How to change to dark theme of an application with LGI (Lua + GTK)
-- I require LGI
local lgi = require("lgi")
local Gtk = lgi.require("Gtk", "3.0")
-- I create the application
local app = Gtk.Application {
-- The application ID
application_id = "com.gists.github.diazvictor.ToggleDarkMode"
}
function app:on_startup()
-- I create a configuration
settings = Gtk.Settings.get_default()
settings.gtk_application_prefer_dark_theme = false
-- Creates the window
Gtk.ApplicationWindow {
application = self,
window_position = Gtk.WindowPosition.CENTER,
default_width = 600,
default_height = 400
}
end
function app:on_activate()
-- The window
local window = self.active_window
-- I create a header
local headerbar = Gtk.HeaderBar {
-- to display a widget
visible = true,
-- I show the buttons of the window (close, minimize and maximize).
show_close_button = true,
-- Here is the title of the window
title = "Toggle dark variant",
{
-- I create a button with two states (active and inactive)
Gtk.ToggleButton {
visible = true,
-- I add an image to know the current status
Gtk.Image {
id = 'state',
visible = true,
-- I set an icon
icon_name = 'weather-clear-night-symbolic'
},
on_toggled = function (self)
-- This is how I access the GtkImage
local state = self:get_parent().child.state
if self.active then
-- The icon for light mode
state.icon_name = 'weather-clear-symbolic'
else
-- The icon for dark mode
state.icon_name = 'weather-clear-night-symbolic'
end
-- Change to dark theme depending on button status (true or false)
settings.gtk_application_prefer_dark_theme = self.active
end
},
-- I place the button at the end
pack_type = 'END'
}
}
-- I add to the window the header
window:set_titlebar(headerbar)
--- This is just to fill in the window void.
-- I create a box
local box = Gtk.Box {
visible = true,
-- Change its orientation to vertical
orientation = Gtk.Orientation.VERTICAL,
-- I align it to the center both vertically and horizontally.
halign = Gtk.Align.CENTER,
valign = Gtk.Align.CENTER,
-- I add a label
Gtk.Label {
visible = true,
-- I add a text
label = 'Press the button above'
}
}
-- I add the box to the window
window:add(box)
window:present()
end
-- I run the application
app:run()
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment