[shotwell] Use dark theme
- From: Jens Georg <jensgeorg src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [shotwell] Use dark theme
- Date: Sun, 6 May 2018 06:57:06 +0000 (UTC)
commit 7ecca041fa8640400d834c0c6320809c93a5e2d5
Author: Jens Georg <mail jensge org>
Date: Sat Apr 21 15:02:29 2018 +0200
Use dark theme
https://bugzilla.gnome.org/show_bug.cgi?id=718212
misc/org.yorba.shotwell.gschema.xml | 8 +-
src/CheckerboardLayout.vala | 37 ++++++------
src/config/Config.vala | 93 +------------------------------
src/config/ConfigurationInterfaces.vala | 20 +++---
src/config/GSettingsEngine.vala | 4 +-
src/dialogs/Preferences.vala | 12 ++++
src/main.vala | 3 +
src/util/image.vala | 5 --
ui/preferences_dialog.ui | 56 +++++++++++++------
9 files changed, 89 insertions(+), 149 deletions(-)
---
diff --git a/misc/org.yorba.shotwell.gschema.xml b/misc/org.yorba.shotwell.gschema.xml
index 2bd9003..b3f0c1b 100644
--- a/misc/org.yorba.shotwell.gschema.xml
+++ b/misc/org.yorba.shotwell.gschema.xml
@@ -156,10 +156,10 @@
<description>Pin toolbar in fullscreen, or not.</description>
</key>
- <key name="background-color" type="s">
- <default>'#444'</default>
- <summary>background color</summary>
- <description>A grayscale color for use as the background color.</description>
+ <key name="use-dark-theme" type="b">
+ <default>true</default>
+ <summary>prefer GTK's dark theme</summary>
+ <description>Whether to use the dark theme of GTK for Shotwell or not.</description>
</key>
<key name="transparent-background-type" type="s">
diff --git a/src/CheckerboardLayout.vala b/src/CheckerboardLayout.vala
index de5869b..7a1eb4a 100644
--- a/src/CheckerboardLayout.vala
+++ b/src/CheckerboardLayout.vala
@@ -567,7 +567,7 @@ public abstract class CheckerboardItem : ThumbnailView {
}
private int get_selection_border_width(int scale) {
- return ((scale <= ((Thumbnail.MIN_SCALE + Thumbnail.MAX_SCALE) / 3)) ? 2 : 3)
+ return ((scale <= ((Thumbnail.MIN_SCALE + Thumbnail.MAX_SCALE) / 3)) ? 5 : 4)
+ BORDER_WIDTH;
}
@@ -588,7 +588,7 @@ public abstract class CheckerboardItem : ThumbnailView {
}
public void paint(Gtk.StyleContext style_context, Cairo.Context ctx, Gdk.RGBA bg_color, Gdk.RGBA
selected_color,
- Gdk.RGBA? border_color) {
+ Gdk.RGBA? border_color, Gdk.RGBA? focus_color) {
ctx.save();
ctx.translate(allocation.x + FRAME_WIDTH,
allocation.y + FRAME_WIDTH);
@@ -614,8 +614,8 @@ public abstract class CheckerboardItem : ThumbnailView {
// draw a border for the cursor with the selection width and normal border color
if (is_cursor) {
ctx.save();
- ctx.set_source_rgba(border_color.red, border_color.green, border_color.blue,
- border_color.alpha);
+ ctx.set_source_rgba(focus_color.red, focus_color.green, focus_color.blue,
+ focus_color.alpha);
paint_border(ctx, pixbuf_dim, pixbuf_origin,
get_selection_border_width(int.max(pixbuf_dim.width, pixbuf_dim.height)));
ctx.restore();
@@ -630,15 +630,6 @@ public abstract class CheckerboardItem : ThumbnailView {
ctx.restore();
}
- // draw border
- if (border_color != null) {
- ctx.save();
- ctx.set_source_rgba(border_color.red, border_color.green, border_color.blue,
- border_color.alpha);
- paint_border(ctx, pixbuf_dim, pixbuf_origin, BORDER_WIDTH);
- ctx.restore();
- }
-
if (display_pixbuf != null) {
ctx.save();
ctx.set_source_rgba(bg_color.red, bg_color.green, bg_color.blue, bg_color.alpha);
@@ -851,6 +842,7 @@ public class CheckerboardLayout : Gtk.DrawingArea {
private string message = null;
private Gdk.RGBA selected_color;
private Gdk.RGBA unselected_color;
+ private Gdk.RGBA focus_color;
private Gdk.RGBA border_color;
private Gdk.RGBA bg_color;
private Gdk.Rectangle visible_page = Gdk.Rectangle();
@@ -1903,13 +1895,22 @@ public class CheckerboardLayout : Gtk.DrawingArea {
private void set_colors(bool in_focus = true) {
// set up selected/unselected colors
- var val = get_style_context().get_property("border-color", Gtk.StateFlags.SELECTED);
//Config.Facade.get_instance().get_unselected_color();
+ var ctx = get_style_context();
+ ctx.save();
+ ctx.add_class("view");
+ var val = ctx.get_property("border-color", Gtk.StateFlags.NORMAL);
+ focus_color = *(Gdk.RGBA*)val.get_boxed();
+
+ val = ctx.get_property("border-color", Gtk.StateFlags.FOCUSED);
+ border_color = *(Gdk.RGBA*)val.get_boxed();
+
+ // Checked in GtkIconView - The selection is drawn using render_background
+ val = ctx.get_property("background-color", Gtk.StateFlags.FOCUSED | Gtk.StateFlags.SELECTED);
selected_color = *(Gdk.RGBA*)val.get_boxed();
- Config.Facade.get_instance().get_selected_color(in_focus);
- val = get_style_context().get_property("color", Gtk.StateFlags.NORMAL);
//Config.Facade.get_instance().get_unselected_color();
+ val = ctx.get_property("color", Gtk.StateFlags.NORMAL);
unselected_color = *(Gdk.RGBA*)val.get_boxed();
- border_color = Config.Facade.get_instance().get_border_color();
+ ctx.restore();
}
public override void size_allocate(Gtk.Allocation allocation) {
@@ -1942,7 +1943,7 @@ public class CheckerboardLayout : Gtk.DrawingArea {
// have all items in the exposed area paint themselves
foreach (CheckerboardItem item in intersection(visible_page)) {
item.paint(get_style_context(), ctx, bg_color, item.is_selected() ? selected_color :
unselected_color,
- border_color);
+ border_color, focus_color);
}
} else {
// draw the message in the center of the window
diff --git a/src/config/Config.vala b/src/config/Config.vala
index f80bfce..5675567 100644
--- a/src/config/Config.vala
+++ b/src/config/Config.vala
@@ -20,25 +20,9 @@ public class Facade : ConfigurationFacade {
public const int HEIGHT_DEFAULT = 768;
public const int SIDEBAR_MIN_POSITION = 180;
public const int SIDEBAR_MAX_POSITION = 1000;
- public const string DEFAULT_BG_COLOR = "#444";
public const int NO_VIDEO_INTERPRETER_STATE = -1;
- private const double BLACK_THRESHOLD = 0.61;
- private const string DARK_SELECTED_COLOR = "#0AD";
- private const string LIGHT_SELECTED_COLOR = "#2DF";
- private const string DARK_UNSELECTED_COLOR = "#000";
- private const string LIGHT_UNSELECTED_COLOR = "#FFF";
- private const string DARK_BORDER_COLOR = "#999";
- private const string LIGHT_BORDER_COLOR = "#AAA";
- private const string DARK_UNFOCUSED_SELECTED_COLOR = "#6fc4dd";
- private const string LIGHT_UNFOCUSED_SELECTED_COLOR = "#99efff";
-
- private string bg_color = null;
- private string selected_color = null;
- private string unselected_color = null;
- private string unfocused_selected_color = null;
- private string border_color = null;
-
+
private static Facade instance = null;
public signal void colors_changed();
@@ -46,7 +30,6 @@ public class Facade : ConfigurationFacade {
private Facade() {
base(new GSettingsConfigurationEngine());
- bg_color_name_changed.connect(on_color_name_changed);
transparent_background_type_changed.connect(on_color_name_changed);
transparent_background_color_changed.connect(on_color_name_changed);
}
@@ -61,80 +44,6 @@ public class Facade : ConfigurationFacade {
private void on_color_name_changed() {
colors_changed();
}
-
- private void set_text_colors(Gdk.RGBA bg_color) {
- // since bg color is greyscale, we only need to compare the red value to the threshold,
- // which determines whether the background is dark enough to need light text and selection
- // colors or vice versa
- if (bg_color.red > BLACK_THRESHOLD) {
- selected_color = DARK_SELECTED_COLOR;
- unselected_color = DARK_UNSELECTED_COLOR;
- unfocused_selected_color = DARK_UNFOCUSED_SELECTED_COLOR;
- border_color = DARK_BORDER_COLOR;
- } else {
- selected_color = LIGHT_SELECTED_COLOR;
- unselected_color = LIGHT_UNSELECTED_COLOR;
- unfocused_selected_color = LIGHT_UNFOCUSED_SELECTED_COLOR;
- border_color = LIGHT_BORDER_COLOR;
- }
- }
-
- private void get_colors() {
- bg_color = base.get_bg_color_name();
-
- if (!is_color_parsable(bg_color))
- bg_color = DEFAULT_BG_COLOR;
-
- set_text_colors(parse_color(bg_color));
- }
-
- public Gdk.RGBA get_bg_color() {
- if (is_string_empty(bg_color))
- get_colors();
-
- return parse_color(bg_color);
- }
-
- public Gdk.RGBA get_selected_color(bool in_focus = true) {
- if (in_focus) {
- if (is_string_empty(selected_color))
- get_colors();
-
- return parse_color(selected_color);
- } else {
- if (is_string_empty(unfocused_selected_color))
- get_colors();
-
- return parse_color(unfocused_selected_color);
- }
- }
-
- public Gdk.RGBA get_unselected_color() {
- if (is_string_empty(unselected_color))
- get_colors();
-
- return parse_color(unselected_color);
- }
-
- public Gdk.RGBA get_border_color() {
- if (is_string_empty(border_color))
- get_colors();
-
- return parse_color(border_color);
- }
-
- public void set_bg_color(Gdk.RGBA color) {
- uint8 col_tmp = (uint8) (color.red * 255.0);
-
- bg_color = "#%02X%02X%02X".printf(col_tmp, col_tmp, col_tmp);
- set_bg_color_name(bg_color);
-
- set_text_colors(color);
- }
-
- public void commit_bg_color() {
- base.set_bg_color_name(bg_color);
- }
}
// preconfigure may be deleted if not used.
diff --git a/src/config/ConfigurationInterfaces.vala b/src/config/ConfigurationInterfaces.vala
index c785144..8af5a73 100644
--- a/src/config/ConfigurationInterfaces.vala
+++ b/src/config/ConfigurationInterfaces.vala
@@ -21,7 +21,7 @@ public enum FuzzyPropertyState {
public enum ConfigurableProperty {
AUTO_IMPORT_FROM_LIBRARY = 0,
- BG_COLOR_NAME,
+ GTK_THEME_VARIANT,
TRANSPARENT_BACKGROUND_TYPE,
TRANSPARENT_BACKGROUND_COLOR,
COMMIT_METADATA_TO_MASTERS,
@@ -100,8 +100,8 @@ public enum ConfigurableProperty {
case AUTO_IMPORT_FROM_LIBRARY:
return "AUTO_IMPORT_FROM_LIBRARY";
- case BG_COLOR_NAME:
- return "BG_COLOR_NAME";
+ case GTK_THEME_VARIANT:
+ return "GTK_THEME_VARIANT";
case TRANSPARENT_BACKGROUND_TYPE:
return "TRANSPARENT_BACKGROUND_TYPE";
@@ -376,7 +376,7 @@ public abstract class ConfigurationFacade : Object {
auto_import_from_library_changed();
break;
- case ConfigurableProperty.BG_COLOR_NAME:
+ case ConfigurableProperty.GTK_THEME_VARIANT:
bg_color_name_changed();
break;
@@ -449,21 +449,21 @@ public abstract class ConfigurationFacade : Object {
}
//
- // bg color name
+ // GTK theme variant
//
- public virtual string get_bg_color_name() {
+ public virtual bool get_gtk_theme_variant() {
try {
- return get_engine().get_string_property(ConfigurableProperty.BG_COLOR_NAME);
+ return get_engine().get_bool_property(ConfigurableProperty.GTK_THEME_VARIANT);
} catch (ConfigurationError err) {
on_configuration_error(err);
- return "";
+ return true;
}
}
- public virtual void set_bg_color_name(string color_name) {
+ public virtual void set_gtk_theme_variant(bool dark) {
try {
- get_engine().set_string_property(ConfigurableProperty.BG_COLOR_NAME, color_name);
+ get_engine().set_bool_property(ConfigurableProperty.GTK_THEME_VARIANT, dark);
} catch (ConfigurationError err) {
on_configuration_error(err);
return;
diff --git a/src/config/GSettingsEngine.vala b/src/config/GSettingsEngine.vala
index 89116a7..a1b830d 100644
--- a/src/config/GSettingsEngine.vala
+++ b/src/config/GSettingsEngine.vala
@@ -30,7 +30,7 @@ public class GSettingsConfigurationEngine : ConfigurationEngine, GLib.Object {
schema_names = new string[ConfigurableProperty.NUM_PROPERTIES];
schema_names[ConfigurableProperty.AUTO_IMPORT_FROM_LIBRARY] = FILES_PREFS_SCHEMA_NAME;
- schema_names[ConfigurableProperty.BG_COLOR_NAME] = UI_PREFS_SCHEMA_NAME;
+ schema_names[ConfigurableProperty.GTK_THEME_VARIANT] = UI_PREFS_SCHEMA_NAME;
schema_names[ConfigurableProperty.TRANSPARENT_BACKGROUND_TYPE] = UI_PREFS_SCHEMA_NAME;
schema_names[ConfigurableProperty.TRANSPARENT_BACKGROUND_COLOR] = UI_PREFS_SCHEMA_NAME;
schema_names[ConfigurableProperty.COMMIT_METADATA_TO_MASTERS] = FILES_PREFS_SCHEMA_NAME;
@@ -104,7 +104,7 @@ public class GSettingsConfigurationEngine : ConfigurationEngine, GLib.Object {
key_names = new string[ConfigurableProperty.NUM_PROPERTIES];
key_names[ConfigurableProperty.AUTO_IMPORT_FROM_LIBRARY] = "auto-import";
- key_names[ConfigurableProperty.BG_COLOR_NAME] = "background-color";
+ key_names[ConfigurableProperty.GTK_THEME_VARIANT] = "use-dark-theme";
key_names[ConfigurableProperty.TRANSPARENT_BACKGROUND_TYPE] = "transparent-background-type";
key_names[ConfigurableProperty.TRANSPARENT_BACKGROUND_COLOR] = "transparent-background-color";
key_names[ConfigurableProperty.COMMIT_METADATA_TO_MASTERS] = "commit-metadata";
diff --git a/src/dialogs/Preferences.vala b/src/dialogs/Preferences.vala
index acf53c6..17b16cf 100644
--- a/src/dialogs/Preferences.vala
+++ b/src/dialogs/Preferences.vala
@@ -19,6 +19,9 @@ public class PreferencesDialog : Gtk.Dialog {
private static PreferencesDialog preferences_dialog;
[GtkChild]
+ private Gtk.Switch switch_dark;
+
+ [GtkChild]
private Gtk.ComboBox photo_editor_combo;
[GtkChild]
private Gtk.ComboBox raw_editor_combo;
@@ -138,6 +141,8 @@ public class PreferencesDialog : Gtk.Dialog {
default_raw_developer_combo.append_text(RawDeveloper.SHOTWELL.get_label());
set_raw_developer_combo(Config.Facade.get_instance().get_default_raw_developer());
default_raw_developer_combo.changed.connect(on_default_raw_developer_changed);
+ switch_dark.active = Gtk.Settings.get_default().gtk_application_prefer_dark_theme;
+ switch_dark.notify["active"].connect(on_theme_variant_changed);
}
public void populate_preference_options() {
@@ -152,6 +157,13 @@ public class PreferencesDialog : Gtk.Dialog {
lowercase.set_active(Config.Facade.get_instance().get_use_lowercase_filenames());
}
+ private void on_theme_variant_changed(GLib.Object o, GLib.ParamSpec ps) {
+ var config = Config.Facade.get_instance();
+ config.set_gtk_theme_variant(switch_dark.active);
+
+ Gtk.Settings.get_default().gtk_application_prefer_dark_theme = switch_dark.active;
+ }
+
private void on_radio_changed() {
var config = Config.Facade.get_instance();
diff --git a/src/main.vala b/src/main.vala
index b25b909..f767872 100644
--- a/src/main.vala
+++ b/src/main.vala
@@ -355,6 +355,9 @@ void main(string[] args) {
try {
Gtk.init_with_args(ref args, _("[FILE]"), CommandlineOptions.get_options(),
Resources.APP_GETTEXT_PACKAGE);
+
+ var use_dark = Config.Facade.get_instance().get_gtk_theme_variant();
+ Gtk.Settings.get_default().gtk_application_prefer_dark_theme = use_dark;
} catch (Error e) {
print(e.message + "\n");
print(_("Run “%s --help” to see a full list of available command line options.\n"), args[0]);
diff --git a/src/util/image.vala b/src/util/image.vala
index 81210df..0a30339 100644
--- a/src/util/image.vala
+++ b/src/util/image.vala
@@ -4,11 +4,6 @@
* See the COPYING file in this distribution.
*/
-bool is_color_parsable(string spec) {
- var color = Gdk.RGBA ();
- return color.parse(spec);
-}
-
Gdk.RGBA parse_color(string spec) {
return fetch_color(spec);
}
diff --git a/ui/preferences_dialog.ui b/ui/preferences_dialog.ui
index 4dbaa1f..5dbe765 100644
--- a/ui/preferences_dialog.ui
+++ b/ui/preferences_dialog.ui
@@ -44,7 +44,7 @@
</object>
<packing>
<property name="left_attach">1</property>
- <property name="top_attach">3</property>
+ <property name="top_attach">4</property>
</packing>
</child>
<child>
@@ -54,7 +54,7 @@
</object>
<packing>
<property name="left_attach">1</property>
- <property name="top_attach">13</property>
+ <property name="top_attach">14</property>
</packing>
</child>
<child>
@@ -90,7 +90,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">2</property>
+ <property name="top_attach">3</property>
<property name="width">2</property>
</packing>
</child>
@@ -106,7 +106,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">3</property>
+ <property name="top_attach">4</property>
</packing>
</child>
<child>
@@ -122,7 +122,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">4</property>
+ <property name="top_attach">5</property>
<property name="width">2</property>
</packing>
</child>
@@ -141,7 +141,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">5</property>
+ <property name="top_attach">6</property>
<property name="width">2</property>
</packing>
</child>
@@ -157,7 +157,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">6</property>
+ <property name="top_attach">7</property>
</packing>
</child>
<child>
@@ -170,7 +170,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">8</property>
+ <property name="top_attach">9</property>
</packing>
</child>
<child>
@@ -186,7 +186,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">9</property>
+ <property name="top_attach">10</property>
<property name="width">2</property>
</packing>
</child>
@@ -204,7 +204,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">10</property>
+ <property name="top_attach">11</property>
<property name="width">2</property>
</packing>
</child>
@@ -221,7 +221,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">11</property>
+ <property name="top_attach">12</property>
<property name="width">2</property>
</packing>
</child>
@@ -239,7 +239,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">12</property>
+ <property name="top_attach">13</property>
<property name="width">2</property>
</packing>
</child>
@@ -255,7 +255,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">13</property>
+ <property name="top_attach">14</property>
</packing>
</child>
<child>
@@ -265,7 +265,7 @@
</object>
<packing>
<property name="left_attach">1</property>
- <property name="top_attach">6</property>
+ <property name="top_attach">7</property>
</packing>
</child>
<child>
@@ -278,7 +278,7 @@
</object>
<packing>
<property name="left_attach">1</property>
- <property name="top_attach">7</property>
+ <property name="top_attach">8</property>
</packing>
</child>
<child>
@@ -329,7 +329,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">7</property>
+ <property name="top_attach">8</property>
</packing>
</child>
<child>
@@ -343,7 +343,7 @@
</object>
<packing>
<property name="left_attach">0</property>
- <property name="top_attach">1</property>
+ <property name="top_attach">2</property>
</packing>
</child>
<child>
@@ -428,11 +428,31 @@
</object>
<packing>
<property name="left_attach">1</property>
+ <property name="top_attach">2</property>
+ </packing>
+ </child>
+ <child>
+ <object class="GtkLabel">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="halign">end</property>
+ <property name="label" translatable="yes">Use dark theme:</property>
+ </object>
+ <packing>
+ <property name="left_attach">0</property>
<property name="top_attach">1</property>
</packing>
</child>
<child>
- <placeholder/>
+ <object class="GtkSwitch" id="switch_dark">
+ <property name="visible">True</property>
+ <property name="can_focus">True</property>
+ <property name="halign">start</property>
+ </object>
+ <packing>
+ <property name="left_attach">1</property>
+ <property name="top_attach">1</property>
+ </packing>
</child>
</object>
</child>
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]