Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UI redesign #11

Draft
wants to merge 14 commits into
base: main
Choose a base branch
from
Binary file modified data/screenshots/main.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions src/dynamic_wallpaper.gresource.xml
Original file line number Diff line number Diff line change
Expand Up @@ -4,5 +4,6 @@
<file>window.ui</file>
<file>wallpaper_picker.ui</file>
<file>gtk/help-overlay.ui</file>
<file>wallpaper_picker.css</file>
</gresource>
</gresources>
6 changes: 5 additions & 1 deletion src/main.py
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
gi.require_version('Gtk', '4.0')
gi.require_version('Adw', '1')

from gi.repository import Gtk, Gio, Adw
from gi.repository import Gtk, Gio, Adw, Gdk
from .window import DynamicWallpaperWindow
from .about_dialog import AboutDialog

Expand All @@ -33,6 +33,10 @@ class DynamicWallpaperApplication(Adw.Application):
def __init__(self):
super().__init__(application_id='me.dusansimic.DynamicWallpaper',
flags=Gio.ApplicationFlags.FLAGS_NONE)
display = Gdk.Display.get_default()
provider = Gtk.CssProvider()
provider.load_from_resource('/me/dusansimic/DynamicWallpaper/wallpaper_picker.css')
Gtk.StyleContext.add_provider_for_display(display, provider, Gtk.STYLE_PROVIDER_PRIORITY_APPLICATION)
self.create_action('quit', self.quit, ['<primary>q'])
self.create_action('about', self.on_about_action)

Expand Down
11 changes: 11 additions & 0 deletions src/wallpaper_picker.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
.picture-thumbnail {
border-radius: 6px;
}

.remove-button {
padding: 2px;
min-width: 0;
min-height: 0;
margin: 6px;
}

43 changes: 31 additions & 12 deletions src/wallpaper_picker.py
Original file line number Diff line number Diff line change
@@ -1,26 +1,46 @@
from gi.repository import Gtk, Adw, Gio
from enum import Enum
import os
import uuid

class WallpaperType(Enum):
LIGHT = 1
DARK = 2

def label(self):
return {
'LIGHT': _('Light'),
'DARK': _('Dark'),
}[self.name]

def icon(self):
return {
'LIGHT': 'weather-clear',
'DARK': 'weather-clear-night',
}[self.name]

@Gtk.Template(resource_path='/me/dusansimic/DynamicWallpaper/wallpaper_picker.ui')
class WallpaperPicker(Adw.Bin):
__gtype_name__ = 'WallpaperPicker'

wallpaper = None

picker_button = Gtk.Template.Child()
picker_button_content = Gtk.Template.Child()
wallpaper_action_row = Gtk.Template.Child()
delete_button = Gtk.Template.Child()
label = Gtk.Template.Child()
icon = Gtk.Template.Child()
picture_overlay = Gtk.Template.Child()
wallpaper_picture = Gtk.Template.Child()
#delete_button = Gtk.Template.Child()

def __init__(self, parent, label, uid = None):
def __init__(self, parent, type, uid = None):
Adw.Bin.__init__(self)

self._uid = uuid.uuid4() if uid == None else uid

self.picker_button.set_action_name('win.{}_open'.format(self._uid))
self.delete_button.set_action_name('win.{}_delete'.format(self._uid))
self.picker_button_content.set_label(label)
#self.delete_button.set_action_name('win.{}_delete'.format(self._uid))
self.label.set_label(type.label())
self.icon.set_from_icon_name(type.icon())

self._update_state()
self._setup_actions(parent)
Expand Down Expand Up @@ -52,12 +72,10 @@ def _setup_actions(self, parent):

def _update_state(self):
self.picker_button.set_visible(bool(not self.wallpaper))
self.wallpaper_action_row.set_visible(bool(self.wallpaper))
self.picture_overlay.set_visible(bool(self.wallpaper))

def _update_action_row_labels(self):
self.wallpaper_action_row.set_title(self.wallpaper.filename)
size = os.path.getsize(self.wallpaper.path)
self.wallpaper_action_row.set_subtitle(self._humanize(size))
def _update_image(self):
self.picture_overlay.set_from_file(self.wallpaper.path)

def _on_open_action(self, _action, _param):
self.wallpaper_chooser.show()
Expand All @@ -72,8 +90,9 @@ def _on_wallpaper_chooser_response(self, dialog, response):
filename = os.path.basename(path)
_, extension = os.path.splitext(path)
self.wallpaper = Wallpaper(path, filename, extension)
self.wallpaper_picture.set_filename(path)
self._update_state()
self._update_action_row_labels()
self._update_image()

def _on_delete_action(self, _action, _param):
self.wallpaper = None
Expand Down
49 changes: 38 additions & 11 deletions src/wallpaper_picker.ui
Original file line number Diff line number Diff line change
Expand Up @@ -7,22 +7,49 @@
<object class="GtkBox">
<child>
<object class="GtkButton" id="picker_button">
<property name="valign">center</property>
<property name="child">
<object class="AdwButtonContent" id="picker_button_content">
<property name="icon-name">document-open-symbolic</property>
<property name="label" translatable="yes">_Select wallpaper</property>
<property name="use-underline">True</property>
<child>
<object class="GtkBox">
<property name="orientation">vertical</property>
<property name="spacing">6</property>
<property name="margin-bottom">16</property>
<child>
<object class="GtkImage" id="icon">
<property name="width-request">128</property>
<property name="height-request">72</property>
<property name="icon-name">weather-clear</property>
<property name="pixel_size">32</property>
</object>
</child>
<child>
<object class="GtkLabel" id="label">
<property name="label" translatable="yes">Light</property>
</object>
</child>
</object>
</property>
</child>
</object>
</child>
<child>
<object class="AdwActionRow" id="wallpaper_action_row">
<object class="GtkOverlay" id="picture_overlay">
<style>
<class name="picture-thumbnail"/>
</style>
<child>
<object class="GtkButton" id="delete_button">
<property name="icon-name">edit-delete-symbolic</property>
<property name="valign">center</property>
<object class="GtkPicture" id="wallpaper_picture">
<property name="width-request">144</property>
<property name="height-request">108</property>
</object>
</child>
<child type="overlay">
<object class="GtkButton">
<property name="icon-name">window-close-symbolic</property>
<property name="halign">2</property> <!-- GTK_ALIGN_END -->
<property name="valign">1</property> <!-- GTK_ALIGN_START -->
<style>
<class name="osd"/>
<class name="circular"/>
<class name="remove-button"/>
</style>
</object>
</child>
</object>
Expand Down
6 changes: 3 additions & 3 deletions src/window.py
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
# 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.

from gi.repository import Gtk, Adw, Gio
from .wallpaper_picker import WallpaperPicker
from .wallpaper_picker import WallpaperPicker, WallpaperType
import os
import shutil
import xml.etree.cElementTree as ET
Expand All @@ -40,8 +40,8 @@ def __init__(self, **kwargs):

self.name_entry.grab_focus()

self.light_picker = WallpaperPicker(self, _('Select light wallpaper'))
self.dark_picker = WallpaperPicker(self, _('Select dark wallpaper'))
self.light_picker = WallpaperPicker(self, WallpaperType.LIGHT)
self.dark_picker = WallpaperPicker(self, WallpaperType.DARK)

self.picker_buttons.append(self.light_picker)
self.picker_buttons.append(self.dark_picker)
Expand Down
20 changes: 8 additions & 12 deletions src/window.ui
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,9 @@
<requires lib="gtk" version="4.0"/>
<requires lib="adw" version="1.0"/>
<template class="DynamicWallpaperWindow" parent="GtkApplicationWindow">
<property name="default-width">500</property>
<property name="default-height">450</property>
<property name="default-width">0</property>
<property name="default-height">0</property>
<property name="resizable">false</property>
<property name="title">Dynamic Wallpaper</property>
<child type="titlebar">
<object class="AdwHeaderBar">
Expand All @@ -30,27 +31,23 @@
<object class="GtkBox">
<property name="orientation">vertical</property>
<property name="valign">center</property>
<property name="spacing">48</property>
<property name="margin-top">36</property>
<property name="margin-end">36</property>
<property name="margin-bottom">36</property>
<property name="margin-start">36 </property>
<property name="spacing">24</property>
<property name="margin-end">42</property>
<property name="margin-bottom">42</property>
<property name="margin-start">42</property>
<child>
<object class="GtkEntry" id="name_entry">
<property name="placeholder-text" translatable="yes">Wallpaper name</property>
<property name="halign">center</property>
</object>
</child>
<child>
<object class="GtkBox" id="picker_buttons">
<property name="halign">center</property>
<property name="spacing">12</property>
<property name="spacing">24</property>
</object>
</child>
<child>
<object class="GtkButton">
<property name="label" translatable="yes">Create</property>
<property name="halign">center</property>
<property name="action_name">win.create</property>
<style>
<class name="suggested-action"/>
Expand All @@ -77,4 +74,3 @@
</section>
</menu>
</interface>