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.

Sign up for GitHub

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

Jump to bottom

Implement a global Color Picker #432

Merged
merged 17 commits into from
Sep 3, 2020
Merged

Implement a global Color Picker #432

Show file tree
Hide file tree
Changes from 12 commits
Commits
Show all changes
17 commits
Select commit Hold shift + click to select a range
1fbd271
port color picker widget from https://github.com/RonnyDo/ColorPicker
isneezy Aug 29, 2020
f269f7f
prevent cursor flickering by reducing the max zoom level
isneezy Aug 30, 2020
bc1c495
add eye dropper to FillItem
isneezy Aug 30, 2020
9c8c5a4
fix linting issues
isneezy Aug 30, 2020
ddbda16
update eyedropper button icon and add a tooltip
isneezy Aug 31, 2020
43ced46
fix typo
isneezy Aug 31, 2020
aba5adc
move CorlorPicker to utils
isneezy Aug 31, 2020
e0063c5
add eyedropper to border item
isneezy Aug 31, 2020
6818ffa
fix lint issues
isneezy Aug 31, 2020
ac3e1b4
Merge branch 'master' into feature/global-color-picker
isneezy Aug 31, 2020
adc343d
[WIP] color picker global action
isneezy Sep 1, 2020
22c1133
Merge branch 'master' into feature/global-color-picker
Alecaddd Sep 2, 2020
f6b1a1c
remove unnecessary method calls
isneezy Sep 2, 2020
f798c76
implement color picker global action
isneezy Sep 2, 2020
d444ddd
fix color picker licence and indentation
isneezy Sep 2, 2020
4c37923
update meson.build
isneezy Sep 2, 2020
c0d819e
fix issue with some listeners not being triggered
isneezy Sep 2, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
34 changes: 32 additions & 2 deletions src/Layouts/Partials/BorderItem.vala
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,12 +17,14 @@
* along with Akira. If not, see <https://www.gnu.org/licenses/>.
*
* Authored by: Alessandro "alecaddd" Castellani <[email protected]>
* Authored by: Ivan "isneezy" Vilanculo <[email protected]>
*/

public class Akira.Layouts.Partials.BorderItem : Gtk.Grid {
public weak Akira.Window window { get; construct; }

private Gtk.Grid color_chooser;
private Gtk.Button eyedropper_button;
private Gtk.Button hidden_button;
private Gtk.Button delete_button;
private Gtk.Image hidden_button_icon;
Expand All @@ -31,6 +33,7 @@ public class Akira.Layouts.Partials.BorderItem : Gtk.Grid {
public Akira.Partials.ColorField color_container;
private Gtk.Popover color_popover;
private Gtk.Grid color_picker;
private Akira.Utils.ColorPicker eyedropper;
private Gtk.ColorChooserWidget color_chooser_widget;

public Akira.Models.BordersItemModel model { get; construct; }
Expand Down Expand Up @@ -165,6 +168,15 @@ public class Akira.Layouts.Partials.BorderItem : Gtk.Grid {
color_chooser.attach (color_container, 1, 0, 1, 1);
color_chooser.attach (tickness_container, 2, 0, 1, 1);

eyedropper_button = new Gtk.Button ();
eyedropper_button.get_style_context ().add_class (Gtk.STYLE_CLASS_FLAT);
eyedropper_button.get_style_context ().add_class ("button-rounded");
eyedropper_button.can_focus = false;
eyedropper_button.valign = Gtk.Align.CENTER;
eyedropper_button.set_tooltip_text (_("Pick color"));
eyedropper_button.add (new Gtk.Image.from_icon_name ("preferences-color-symbolic",
Gtk.IconSize.SMALL_TOOLBAR));

hidden_button = new Gtk.Button ();
hidden_button.get_style_context ().add_class (Gtk.STYLE_CLASS_FLAT);
hidden_button.get_style_context ().add_class ("button-rounded");
Expand All @@ -191,20 +203,38 @@ public class Akira.Layouts.Partials.BorderItem : Gtk.Grid {
color_popover.add (color_picker);

attach (color_chooser, 0, 0, 1, 1);
attach (hidden_button, 1, 0, 1, 1);
attach (delete_button, 2, 0, 1, 1);
attach (eyedropper_button, 1, 0, 1, 1);
attach (hidden_button, 2, 0, 1, 1);
attach (delete_button, 3, 0, 1, 1);

set_color_chooser_color ();
set_button_color ();
}

private void create_event_bindings () {
eyedropper_button.clicked.connect (on_eyedropper_click);
delete_button.clicked.connect (on_delete_item);
hidden_button.clicked.connect (toggle_visibility);
model.notify.connect (on_model_changed);
color_chooser_widget.notify["rgba"].connect (on_color_changed);
}

private void on_eyedropper_click () {
eyedropper = new Akira.Utils.ColorPicker ();
eyedropper.show_all ();

eyedropper.picked.connect ((picked_color) => {
alpha = ((int)(picked_color.alpha * 255));
color_chooser_widget.set_rgba (picked_color);
on_color_changed ();
isneezy marked this conversation as resolved.
Show resolved Hide resolved
eyedropper.close ();
});

eyedropper.cancelled.connect (() => {
eyedropper.close ();
});
}

private void on_model_changed () {
model.item.reset_colors ();
set_button_color ();
Expand Down
34 changes: 32 additions & 2 deletions src/Layouts/Partials/FillItem.vala
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,14 @@
*
* Authored by: Giacomo "giacomoalbe" Alberini <[email protected]>
* Authored by: Alessandro "alecaddd" Castellani <[email protected]>
* Authored by: Ivan "isneezy" Vilanculo <[email protected]>
*/

public class Akira.Layouts.Partials.FillItem : Gtk.Grid {
public weak Akira.Window window { get; construct; }

private Gtk.Grid fill_chooser;
private Gtk.Button eyedropper_button;
private Gtk.Button hidden_button;
private Gtk.Button delete_button;
private Gtk.Image hidden_button_icon;
Expand All @@ -33,6 +35,7 @@ public class Akira.Layouts.Partials.FillItem : Gtk.Grid {
private Gtk.Popover color_popover;
private Gtk.Grid color_picker;
private Gtk.ColorChooserWidget color_chooser_widget;
private Akira.Utils.ColorPicker eyedropper;

public Akira.Models.FillsItemModel model { get; construct; }

Expand Down Expand Up @@ -167,6 +170,15 @@ public class Akira.Layouts.Partials.FillItem : Gtk.Grid {
fill_chooser.attach (color_container, 1, 0, 1, 1);
fill_chooser.attach (opacity_container, 2, 0, 1, 1);

eyedropper_button = new Gtk.Button ();
eyedropper_button.get_style_context ().add_class (Gtk.STYLE_CLASS_FLAT);
eyedropper_button.get_style_context ().add_class ("button-rounded");
eyedropper_button.can_focus = false;
eyedropper_button.valign = Gtk.Align.CENTER;
eyedropper_button.set_tooltip_text (_("Pick color"));
eyedropper_button.add (new Gtk.Image.from_icon_name ("preferences-color-symbolic",
Gtk.IconSize.SMALL_TOOLBAR));
isneezy marked this conversation as resolved.
Show resolved Hide resolved

hidden_button = new Gtk.Button ();
hidden_button.get_style_context ().add_class (Gtk.STYLE_CLASS_FLAT);
hidden_button.get_style_context ().add_class ("button-rounded");
Expand All @@ -193,20 +205,38 @@ public class Akira.Layouts.Partials.FillItem : Gtk.Grid {
color_popover.add (color_picker);

attach (fill_chooser, 0, 0, 1, 1);
attach (hidden_button, 1, 0, 1, 1);
attach (delete_button, 2, 0, 1, 1);
attach (eyedropper_button, 1, 0, 1, 1);
attach (hidden_button, 2, 0, 1, 1);
attach (delete_button, 3, 0, 1, 1);

set_color_chooser_color ();
set_button_color ();
}

private void create_event_bindings () {
eyedropper_button.clicked.connect (on_eyedropper_click);
delete_button.clicked.connect (on_delete_item);
hidden_button.clicked.connect (toggle_visibility);
model.notify.connect (on_model_changed);
color_chooser_widget.notify["rgba"].connect (on_color_changed);
}

private void on_eyedropper_click () {
eyedropper = new Akira.Utils.ColorPicker ();
eyedropper.show_all ();

eyedropper.picked.connect ((picked_color) => {
alpha = ((int)(picked_color.alpha * 255));
color_chooser_widget.set_rgba (picked_color);
on_color_changed ();
isneezy marked this conversation as resolved.
Show resolved Hide resolved
eyedropper.close ();
});

eyedropper.cancelled.connect (() => {
eyedropper.close ();
});
}

private void on_model_changed () {
model.item.reset_colors ();
set_button_color ();
Expand Down
43 changes: 43 additions & 0 deletions src/Services/ActionManager.vala
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@
* along with Akira. If not, see <https://www.gnu.org/licenses/>.
*
* Authored by: Alessandro "Alecaddd" Castellani <[email protected]>
* Authored by: Ivan "isneezy" Vilanculo <[email protected]>
*/

public class Akira.Services.ActionManager : Object {
Expand Down Expand Up @@ -64,6 +65,7 @@ public class Akira.Services.ActionManager : Object {
public const string ACTION_FLIP_V = "action_flip_v";
public const string ACTION_ESCAPE = "action_escape";
public const string ACTION_SHORTCUTS = "action_shortcuts";
public const string ACTION_PICK_COLOR = "action_pick_color";

public static Gee.MultiMap<string, string> action_accelerators = new Gee.HashMultiMap<string, string> ();
public static Gee.MultiMap<string, string> typing_accelerators = new Gee.HashMultiMap<string, string> ();
Expand Down Expand Up @@ -101,6 +103,7 @@ public class Akira.Services.ActionManager : Object {
{ ACTION_FLIP_V, action_flip_v },
{ ACTION_ESCAPE, action_escape },
{ ACTION_SHORTCUTS, action_shortcuts },
{ ACTION_PICK_COLOR, action_pick_color },
};

public ActionManager (Akira.Application akira_app, Akira.Window window) {
Expand Down Expand Up @@ -137,6 +140,7 @@ public class Akira.Services.ActionManager : Object {
action_accelerators.set (ACTION_FLIP_H, "<Control>bracketleft");
action_accelerators.set (ACTION_FLIP_V, "<Control>bracketright");
action_accelerators.set (ACTION_SHORTCUTS, "F1");
action_accelerators.set (ACTION_PICK_COLOR, "<Alt>c");

typing_accelerators.set (ACTION_ESCAPE, "Escape");
typing_accelerators.set (ACTION_ARTBOARD_TOOL, "a");
Expand Down Expand Up @@ -452,6 +456,45 @@ public class Akira.Services.ActionManager : Object {
dialog.present ();
}

private void action_pick_color () {
if (window.main_window.main_canvas.canvas.selected_bound_manager.selected_items.length() == 0) {
return;
}
bool is_holding_shift = false;
var color_picker = new Akira.Utils.ColorPicker ();
color_picker.show_all();
color_picker.key_press_event.connect((e) => {
if (e.keyval == Gdk.Key.Shift_R) {
is_holding_shift = true;
}
return true;
});
color_picker.key_release_event.connect((e) => {
if (e.keyval == Gdk.Key.Shift_R) {
is_holding_shift = false;
}
return true;
});
color_picker.cancelled.connect(() => {
color_picker.close();
});
color_picker.picked.connect(color => {
if (!is_holding_shift) {
// TODO change current selected shape fill color
for (int i = 0; i <= window.main_window.main_canvas.canvas.selected_bound_manager.selected_items.length (); i ++) {
var item = window.main_window.main_canvas.canvas.selected_bound_manager.selected_items.nth_data(i);
if(item != null) {
item.color = color;
}
}
} else {
// TODO change current selected shape border color
// window.main_window.main_canvas.canvas.selected_bound_manager.delete_selection ();
}
color_picker.close();
});
}

isneezy marked this conversation as resolved.
Show resolved Hide resolved
public static void action_from_group (string action_name, ActionGroup? action_group) {
action_group.activate_action (action_name, null);
}
Expand Down
Loading