Add a color edit element

Refactor color picker headers
Add support in HPPDrawer

framework/gui.cpp

@@ -1245,25 +1245,45 @@ void Drawer::text(const char *formatstr, ...)
 	va_end(args);
 }
 
-bool Drawer::color_picker(const char *caption, const char channel_count, float *color, uint16_t width, ImGuiColorEditFlags flags)
+bool Drawer::color_picker(const char *caption, std::array<float, 3> &color, float width, ImGuiColorEditFlags flags)
 {
-	assert((channel_count == 3 || channel_count == 4) && "Channel count value must be 3 or 4");
 	bool res;
-	if (width)
-		ImGui::PushItemWidth(width);
-	switch (channel_count)
-	{
-		case 3:
-			res = ImGui::ColorPicker3(caption, color, flags);
-			break;
-		case 4:
-			res = ImGui::ColorPicker4(caption, color, flags);
-			break;
-	}
+	ImGui::PushItemWidth(width);
+	res = ImGui::ColorPicker3(caption, color.data(), flags);
+	ImGui::PopItemWidth();
+	if (res)
+		dirty = true;
+	return res;
+}
+
+bool Drawer::color_picker(const char *caption, std::array<float, 4> &color, float width, ImGuiColorEditFlags flags)
+{
+	bool res;
+	ImGui::PushItemWidth(width);
+	res = ImGui::ColorPicker4(caption, color.data(), flags);
+	ImGui::PopItemWidth();
+	if (res)
+		dirty = true;
+	return res;
+}
+
+bool Drawer::color_edit(const char *caption, std::array<float, 3> &color, float width, ImGuiColorEditFlags flags)
+{
+	bool res;
+	ImGui::PushItemWidth(width);
+	res = ImGui::ColorEdit3(caption, color.data(), flags);
+	ImGui::PopItemWidth();
+	if (res)
+		dirty = true;
+	return res;
+}
+
+bool Drawer::color_edit(const char *caption, std::array<float, 4> &color, float width, ImGuiColorEditFlags flags)
+{
+	bool res;
+	res = ImGui::ColorEdit4(caption, color.data(), flags);
 	if (res)
-	{
 		dirty = true;
-	};
 	return res;
 }
 

framework/gui.h

@@ -176,12 +176,38 @@ class Drawer
 	/**
 	 * @brief Adds a color picker to the gui
 	 * @param caption The text to display
-	 * @param channel_count Number of channels. Must be 3 or 4.
 	 * @param color Color channel array on which the picker works. It contains values ranging from 0 to 1.
-	 * @param width Element width.
+	 * @param width Element width. Zero is a special value for the default element width.
 	 * @param flags Flags to modify the appearance and behavior of the element.
 	 */
-	bool color_picker(const char *caption, const char channel_count, float *color, uint16_t width = 0, ImGuiColorEditFlags flags = 0);
+	bool color_picker(const char *caption, std::array<float, 3> &color, float width = 0.0f, ImGuiColorEditFlags flags = 0);
+
+	/**
+	 * @brief Adds a color picker to the gui
+	 * @param caption The text to display
+	 * @param color Color channel array on which the picker works. It contains values ranging from 0 to 1.
+	 * @param width Element width. Zero is a special value for the default element width.
+	 * @param flags Flags to modify the appearance and behavior of the element.
+	 */
+	bool color_picker(const char *caption, std::array<float, 4> &color, float width = 0.0f, ImGuiColorEditFlags flags = 0);
+
+	/**
+	 * @brief Adds a color edit to the gui
+	 * @param caption The text to display
+	 * @param color Color channel array on which the picker works. It contains values ranging from 0 to 1.
+	 * @param width Element width. Zero is a special value for the default element width.
+	 * @param flags Flags to modify the appearance and behavior of the element.
+	 */
+	bool color_edit(const char *caption, std::array<float, 3> &color, float width = 0.0f, ImGuiColorEditFlags flags = 0);
+
+	/**
+	 * @brief Adds a color edit to the gui
+	 * @param caption The text to display
+	 * @param color Color channel array on which the picker works. It contains values ranging from 0 to 1.
+	 * @param width Element width. Zero is a special value for the default element width.
+	 * @param flags Flags to modify the appearance and behavior of the element.
+	 */
+	bool color_edit(const char *caption, std::array<float, 4> &color, float width = 0.0f, ImGuiColorEditFlags flags = 0);
 
   private:
 	bool dirty{false};

framework/hpp_gui.cpp

@@ -1173,4 +1173,46 @@ void HPPDrawer::text(const char *formatstr, ...)
 	va_end(args);
 }
 
+bool HPPDrawer::color_picker(const char *caption, std::array<float, 3> &color, float width, ImGuiColorEditFlags flags)
+{
+	bool res;
+	ImGui::PushItemWidth(width);
+	res = ImGui::ColorPicker3(caption, color.data(), flags);
+	ImGui::PopItemWidth();
+	if (res)
+		dirty = true;
+	return res;
+}
+
+bool HPPDrawer::color_picker(const char *caption, std::array<float, 4> &color, float width, ImGuiColorEditFlags flags)
+{
+	bool res;
+	ImGui::PushItemWidth(width);
+	res = ImGui::ColorPicker4(caption, color.data(), flags);
+	ImGui::PopItemWidth();
+	if (res)
+		dirty = true;
+	return res;
+}
+
+bool HPPDrawer::color_edit(const char *caption, std::array<float, 3> &color, float width, ImGuiColorEditFlags flags)
+{
+	bool res;
+	ImGui::PushItemWidth(width);
+	res = ImGui::ColorEdit3(caption, color.data(), flags);
+	ImGui::PopItemWidth();
+	if (res)
+		dirty = true;
+	return res;
+}
+
+bool HPPDrawer::color_edit(const char *caption, std::array<float, 4> &color, float width, ImGuiColorEditFlags flags)
+{
+	bool res;
+	res = ImGui::ColorEdit4(caption, color.data(), flags);
+	if (res)
+		dirty = true;
+	return res;
+}
+
 }        // namespace vkb

framework/hpp_gui.h

@@ -161,6 +161,42 @@ class HPPDrawer
 	 */
 	void text(const char *formatstr, ...);
 
+	/**
+	 * @brief Adds a color picker to the gui
+	 * @param caption The text to display
+	 * @param color Color channel array on which the picker works. It contains values ranging from 0 to 1.
+	 * @param width Element width. Zero is a special value for the default element width.
+	 * @param flags Flags to modify the appearance and behavior of the element.
+	 */
+	bool color_picker(const char *caption, std::array<float, 3> &color, float width = 0.0f, ImGuiColorEditFlags flags = 0);
+
+	/**
+	 * @brief Adds a color picker to the gui
+	 * @param caption The text to display
+	 * @param color Color channel array on which the picker works. It contains values ranging from 0 to 1.
+	 * @param width Element width. Zero is a special value for the default element width.
+	 * @param flags Flags to modify the appearance and behavior of the element.
+	 */
+	bool color_picker(const char *caption, std::array<float, 4> &color, float width = 0.0f, ImGuiColorEditFlags flags = 0);
+
+	/**
+	 * @brief Adds a color edit to the gui
+	 * @param caption The text to display
+	 * @param color Color channel array on which the picker works. It contains values ranging from 0 to 1.
+	 * @param width Element width. Zero is a special value for the default element width.
+	 * @param flags Flags to modify the appearance and behavior of the element.
+	 */
+	bool color_edit(const char *caption, std::array<float, 3> &color, float width = 0.0f, ImGuiColorEditFlags flags = 0);
+
+	/**
+	 * @brief Adds a color edit to the gui
+	 * @param caption The text to display
+	 * @param color Color channel array on which the picker works. It contains values ranging from 0 to 1.
+	 * @param width Element width. Zero is a special value for the default element width.
+	 * @param flags Flags to modify the appearance and behavior of the element.
+	 */
+	bool color_edit(const char *caption, std::array<float, 4> &color, float width = 0.0f, ImGuiColorEditFlags flags = 0);
+
   private:
 	bool dirty = false;
 };

samples/extensions/color_write_enable/color_write_enable.cpp

@@ -539,7 +539,7 @@ void ColorWriteEnable::on_update_ui_overlay(vkb::Drawer &drawer)
 {
 	if (drawer.header("Background color"))
 	{
-		if (drawer.color_picker("", 3, background_color.data(), 200,
+		if (drawer.color_picker("", background_color, 300,
 		                        ImGuiColorEditFlags_NoSidePreview |
 		                            ImGuiColorEditFlags_NoSmallPreview |
 		                            ImGuiColorEditFlags_Float |