add ColorHistory, layout changes

This commit is contained in:
Ronny Dobra committed 2017-06-13 01:06:17 +02:00
1 parent 5937f9b5d6
commit 57401cdcd6
8 files changed
+262 -149

No files matched your search

BIN
View File
Binary file not shown.
-35
View File
@@ -60,41 +60,6 @@ namespace ColorPicker {
app.run(args);
/*
var window = new Gtk.Window ();
window.title = "Hello World!";-
//window.set_border_width (12);
//window.set_position (Gtk.WindowPosition.CENTER);
window.set_default_size (350, 70);
//window.destroy.connect (Gtk.main_quit);
var button_hello = new Gtk.Button.with_label ("Click me!");
button_hello.clicked.connect (() => {
var mouse_position = new ColorPicker.Widgets.MousePosition ();
mouse_position.show_all ();
mouse_position.moved.connect ((t, color) => {
button_hello.label = color.to_string ();
});
mouse_position.cancelled.connect (() => {
mouse_position.close ();
window.present ();
});
var win = mouse_position.get_window ();
mouse_position.picked.connect ((t, color) => {
mouse_position.close ();
window.present ();
});
});
window.add (button_hello);
window.show_all ();
*/
Gtk.main ();
return 0;
}
+105 -33
View File
@@ -22,57 +22,116 @@
namespace ColorPicker {
public class ColorPickerWindow: Gtk.Dialog {
public ColorPickerWindow () {
Object (application: application,
icon_name: "com.github.ronnydo.colorpicker",
title: "Color Picker",
resizable: false
// height_request: 500,
// width_request: 300
resizable: false,
//height_request: 500,
width_request: 500
);
}
}
construct {
// main box
var color_area = new ColorArea ();
var color_area = new ColorArea ();
color_area.margin_bottom = 12;
var hex_entry = new Gtk.Entry ();
hex_entry.placeholder_text = "rgb(255,255,255)";
hex_entry.set_icon_from_icon_name (Gtk.EntryIconPosition.SECONDARY, "edit-copy");
var button_hello = new Gtk.Button.with_label ("Pick Color");
button_hello.get_style_context ().add_class (Gtk.STYLE_CLASS_SUGGESTED_ACTION);
var hex_label = new Gtk.Label (null);
hex_label.halign = Gtk.Align.END;
hex_label.valign = Gtk.Align.END;
hex_label.set_selectable (true);
hex_label.set_use_markup (true);
hex_label.set_markup (Markup.printf_escaped (("<b>%s</b>"), "#FFFFFF"));
var box = get_content_area () as Gtk.Box;
box.border_width = 6;
box.pack_start (color_area);
box.pack_start (hex_entry);
box.pack_start (button_hello);
var pick_color_button = new Gtk.Button.with_label ("Pick Color");
pick_color_button.get_style_context ().add_class (Gtk.STYLE_CLASS_SUGGESTED_ACTION);
pick_color_button.halign = Gtk.Align.END;
pick_color_button.valign = Gtk.Align.BASELINE;
// TODO Just icon or text is displyed, but not both
// pick_color_button.set_image (new Gtk.Image.from_icon_name ("gtk-color-picker", Gtk.IconSize.BUTTON));
var main_right_box = new Gtk.Box (Gtk.Orientation.VERTICAL, 0);
main_right_box.pack_start (hex_label);
main_right_box.pack_start (pick_color_button, true, false);
var main_box = new Gtk.Box (Gtk.Orientation.HORIZONTAL, 0);
main_box.margin_bottom = 12;
main_box.pack_start (color_area);
main_box.pack_start (main_right_box);
// format box
var format_label = new Gtk.Label ("Format");
format_label.get_style_context ().add_class ("h4");
format_label.halign = Gtk.Align.START;
var format_entry = new Gtk.Entry ();
format_entry.placeholder_text = "rgb(255,255,255)";
format_entry.set_editable (false);
format_entry.set_icon_from_icon_name (Gtk.EntryIconPosition.SECONDARY, "edit-copy");
format_entry.margin_right = 6;
var color_format_combobox = new Gtk.ComboBoxText ();
color_format_combobox.append_text ("RGBA");
color_format_combobox.append_text ("CSS RGBA");
color_format_combobox.append_text ("QML QT RGBA");
color_format_combobox.active = 0;
var adjust_button = new Gtk.Button.from_icon_name ("media-eq-symbolic");
adjust_button.margin_left = 12;
// TODO implement change color dialog
var format_hbox = new Gtk.Box (Gtk.Orientation.HORIZONTAL, 0);
format_hbox.pack_start (format_entry);
format_hbox.pack_start (color_format_combobox, false, false);
var format_box = new Gtk.Box (Gtk.Orientation.VERTICAL, 0);
format_box.pack_start (format_label);
format_box.pack_start (format_hbox);
// TODO implement change color dialog
// format_box.pack_start (adjust_button);
// color history box
var color_history_label = new Gtk.Label ("Color History");
color_history_label.get_style_context ().add_class ("h4");
color_history_label.halign = Gtk.Align.START;
var color_history = new ColorHistory ();
var color_history_box = new Gtk.Box (Gtk.Orientation.VERTICAL, 0);
color_history_box.margin_top = 6;
color_history_box.margin_bottom = 0;
color_history_box.pack_start (color_history_label);
color_history_box.pack_start (color_history);
// tie together
var skeleton_box = new Gtk.Box (Gtk.Orientation.VERTICAL, 0);
skeleton_box.orientation = Gtk.Orientation.VERTICAL;
skeleton_box.margin = 6;
skeleton_box.margin_bottom = 0;
skeleton_box.pack_start (main_box);
skeleton_box.pack_start (format_box);
var content_box = get_content_area () as Gtk.Box;
content_box.pack_start (skeleton_box);
var content_box = get_content_area () as Gtk.Box;
content_box.border_width = 6;
content_box.add (box);
content_box.add (button_hello);
hex_entry.icon_press.connect ((pos, event) => {
format_entry.icon_press.connect ((pos, event) => {
if (pos == Gtk.EntryIconPosition.SECONDARY) {
Gtk.Clipboard.get_default (this.get_display ()).set_text (hex_entry.get_text (), -1);
Gtk.Clipboard.get_default (this.get_display ()).set_text (format_entry.get_text (), -1);
}
});
button_hello.clicked.connect (() => {
pick_color_button.clicked.connect (() => {
var mouse_position = new ColorPicker.Widgets.MousePosition ();
mouse_position.show_all ();
mouse_position.moved.connect ((t, color) => {
color_area.set_color (color);
var ext_color = (ExtRGBA) color;
color_area.set_color (ext_color);
color_area.queue_draw ();
hex_entry.text = color.to_string ();
hex_label.set_markup (Markup.printf_escaped ("<b>%s</b>", ext_color.to_uppercase_hex_string ()));
});
mouse_position.cancelled.connect (() => {
@@ -85,7 +144,20 @@ namespace ColorPicker {
mouse_position.picked.connect ((t, color) => {
color_area.set_color (color);
color_area.queue_draw ();
hex_entry.text = color.to_string ();
format_entry.text = color.to_string ();
color_history.add_color (color);
var l = new Gtk.Button.with_label ("Pick Color");
var color_list = color_history.get_color_list ();
if (color_history_box.get_parent () == null) {
if (color_list != null && color_list.size > 1) {
skeleton_box.pack_start (color_history_box);
color_history_box.show_all ();
}
}
mouse_position.close ();
this.present ();
});
@@ -96,4 +168,4 @@ namespace ColorPicker {
}
}
}
+17 -7
View File
@@ -21,15 +21,19 @@
namespace ColorPicker {
public class ColorPickerWindow: Gtk.Window {
public class ColorPickerWindow: Gtk.Dialog {
public ColorPickerWindow () {
Object (title: "Color Picker",
border_width: 12);
Object (application: application,
icon_name: "com.github.ronnydo.colorpicker",
title: "Color Picker",
resizable: false
// height_request: 500,
// width_request: 300
);
}
construct {
this.set_default_size (300, 420);
var color_area = new ColorArea ();
color_area.margin_bottom = 12;
@@ -40,13 +44,19 @@ namespace ColorPicker {
var button_hello = new Gtk.Button.with_label ("Pick Color");
button_hello.get_style_context ().add_class (Gtk.STYLE_CLASS_SUGGESTED_ACTION);
button_hello.can_default = true;
Gtk.Box box = new Gtk.Box (Gtk.Orientation.VERTICAL, 0);
var box = get_content_area () as Gtk.Box;
box.border_width = 6;
box.pack_start (color_area);
box.pack_start (hex_entry);
box.pack_start (button_hello);
this.add (box);
var content_box = get_content_area () as Gtk.Box;
content_box.border_width = 6;
content_box.add (box);
content_box.add (button_hello);
hex_entry.icon_press.connect ((pos, event) => {
+60
View File
@@ -0,0 +1,60 @@
namespace ColorPicker {
public struct ExtRGBA : Gdk.RGBA {
/* format like #3f92aa */
public string to_hex_string () {
string s = "#%02x%02x%02x"
.printf((uint) (this.red * 255),
(uint) (this.green * 255),
(uint) (this.blue * 255));
return s;
}
/* format like #3F92AA */
public string to_uppercase_hex_string () {
return this.to_hex_string ().up ();
}
/* format like rgb(211, 32, 128) */
public string to_css_rgb_string () {
string s = "rgb(%i, %i, %i)"
.printf((int) (this.red * 255),
(int) (this.green * 255),
(int) (this.blue * 255));
return s;
}
/* format like rgba(211, 32, 128, 1) */
public string to_css_rgba_string () {
string s = "rgba(%i, %i, %i, 1)"
.printf((int) (this.red * 255),
(int) (this.green * 255),
(int) (this.blue * 255));
return s;
}
/* format like Gdk.RGBA(211, 32, 128, 1) */
public string to_gdk_rgba_string () {
string s = "Gdk.RGBA(%i, %i, %i, 1.0)"
.printf((int) (this.red * 255),
(int) (this.green * 255),
(int) (this.blue * 255));
return s;
}
/* format like QML.Gdk.RGBA(211, 32, 128, 1) */
public string to_qml_qt_rgba_string () {
string s = "Qt.rgba(%i, %i, %i, 1.0)"
.printf((int) (this.red * 255),
(int) (this.green * 255),
(int) (this.blue * 255));
return s;
}
}
}
+1 -1
View File
@@ -26,7 +26,7 @@ namespace ColorPicker {
private Gdk.RGBA color;
public ColorArea () {
set_size_request (100, 100);
set_size_request (140, 140);
color.parse("#EEEEEE");
}
-73
View File
@@ -1,73 +0,0 @@
/*
* Copyright (c) 2017 Ronny Dobra (https://github.com/RonnyDo/ColorPicker)
*
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU General Public
* License as published by the Free Software Foundation; either
* version 2 of the License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
* General Public License for more details.
*
* You should have received a copy of the GNU General Public
* License along with this program; if not, write to the
* Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor,
* Boston, MA 02110-1301 USA
*
* Authored by: Ronny Dobra <ronnydobra at arcor dot de>
*/
namespace ColorPicker {
public class ColorArea: Gtk.DrawingArea {
private Gdk.RGBA color;
public ColorArea () {
set_size_request (100, 100);
color.parse("#EEEEEE");
}
/* Widget is asked to draw itself */
public override bool draw (Cairo.Context ctx) {
// Get necessary data:
weak Gtk.StyleContext style_context = get_style_context ();
int width = get_allocated_width ();
int height = get_allocated_height ();
// Draw an arc:
double xc = width / 2.0;
double yc = height / 2.0;
double radius = (int.min (width, height) / 2.0);
double angle1 = 0;
double angle2 = 2*Math.PI;
int shadow_width = 6;
double shadow_alpha = 1.0;
string shadow_color = "#A9A9A9";
for (int i = 1; i <= shadow_width; i++) {
ctx.arc (xc, yc, radius - i, angle1, angle2);
Gdk.RGBA c = new Gdk.RGBA();
c.parse(shadow_color);
//c.alpha = i* shadow_inc;
c.alpha = shadow_alpha / ((shadow_width - i + 1)*(shadow_width - i + 1));
Gdk.cairo_set_source_rgba (ctx, c);
ctx.stroke ();
}
ctx.arc (xc, yc, radius - shadow_width, angle1, angle2);
Gdk.cairo_set_source_rgba (ctx, this.color);
ctx.fill ();
return true;
}
public void set_color (Gdk.RGBA color) {
this.color = color;
}
}
}
+79
View File
@@ -0,0 +1,79 @@
namespace ColorPicker {
public class ColorHistory: Gtk.DrawingArea {
const int max_colors = 6;
Gee.ArrayList<Gdk.RGBA?> color_list;
public ColorHistory () {
set_size_request (100, 30);
color_list = new Gee.ArrayList<Gdk.RGBA?> ();
Gdk.RGBA c1 = new Gdk.RGBA();
c1.parse ("#FE3478");
//add_color (c1);
Gdk.RGBA c2 = new Gdk.RGBA();
c2.parse ("#82A32E");
//add_color (c2);
}
public void add_color (Gdk.RGBA color) {
if (color_list.size == max_colors) {
remove_oldest_color ();
}
color_list.add (color);
}
public void remove_oldest_color () {
color_list.remove_at (0);
}
public Gee.ArrayList<Gdk.RGBA?> get_color_list () {
return color_list;
}
/* Widget is asked to draw itself */
public override bool draw (Cairo.Context ctx) {
weak Gtk.StyleContext style_context = get_style_context ();
int width = get_allocated_width (); // better element_width / amount
int height = get_allocated_height ();
// draw colorlist
for (int i = 0; i < color_list.size; i++) {
ctx.move_to (i * width / color_list.size, 0);
ctx.rel_line_to (width / color_list.size, 0);
ctx.rel_line_to (0, height);
ctx.rel_line_to (-1 * width / color_list.size, 0);
ctx.close_path ();
Gdk.cairo_set_source_rgba (ctx, color_list.get(i));
ctx.fill ();
}
// draw triangle
if (color_list.size > 0) {
ctx.new_path ();
int triangle_height = 10;
int triangle_width = 20;
ctx.move_to (width - width / color_list.size / 2, height - triangle_height);
ctx.rel_line_to (triangle_width / 2, triangle_height);
ctx.rel_line_to (-1 * triangle_width, 0);
ctx.close_path ();
Gdk.RGBA c_grey = new Gdk.RGBA();
c_grey.parse ("#F5F5F5");
Gdk.cairo_set_source_rgba (ctx, c_grey);
ctx.fill ();
}
return true;
}
}
}