Change color of icon of color picker

Change color of icon of color picker

Posted by: levanduyet on 11 January 2024, 1:27 am EST

• 

  levanduyet

  • Post Options:
  • Link
    Copy

  Posted 11 January 2024, 1:27 am EST - Updated 11 January 2024, 1:32 am EST

  Hi,
  
  I use colorpicker to let the user select the color. But when I select the icon for colorpicker, I want that after the user select the color, then show the color on the colorpicker.
  
  How I can do that.
  
  
  
  Thanks,
  
  Duyet Le

• 

  kartik.dua

  

  • Post Options:
  • Link
    Copy

  Posted 11 January 2024, 9:30 pm EST

  Hi Duyet,

  By default, the RibbonColorPicker changes its color automatically when the user selects a color from the dropdown. Please see the attached sample project for reference. If you have a different implementation, please update the attached project to show the issue you are facing, so we can investigate further and assist you in the best way possible.

  RibbonColorPicker.zip

  Thanks, and Best Regards,
  
  Kartik

• 

  levanduyet

  • Post Options:
  • Link
    Copy

  Posted 14 January 2024, 2:31 pm EST

  Hi Kartik,
  
  I have checked my setting, it’s same as your sample project. The only difference is that my C1.Win.Ribbon.4.5.2, your one is C.Win.Ribbon.4.8
  
  2024-01-15_10-17-42.zip

  Should be bug.
  
  Thanks,
  
  Duyet Le

• 

  kartik.dua

  

  • Post Options:
  • Link
    Copy

  Posted 14 January 2024, 9:49 pm EST

  Hi Duyet,

  Thank you for providing the video. We could see the behavior you mentioned on our end. To fix this behavior, you can manually create a CompositeIcon (that automatically changes colors) and assign it to the IconSet of the RibbonColorPicker.

  Please see the updated sample project for reference (RibbonColorPicker_Composite.zip).

  Best Regards,
  
  Kartik

• 

  levanduyet

  • Post Options:
  • Link
    Copy

  Posted 15 January 2024, 2:29 pm EST

  Hi Kartik,
  
  I did not get what you mean.

  Thanks,
  
  Duyet Le

• 

  kartik.dua

  

  • Post Options:
  • Link
    Copy

  Posted 15 January 2024, 2:36 pm EST

  Hi Duyet,

  Please download the updated sample project from our previous response and check the code we introduced in Form1.cs file. You can just copy this code and add it to your project. The “fillIcon” object in the code is the C1CompositeIcon object that you add to the IconSet collection of your RibbonColorPicker.

  Thanks, and Best Regards,
  
  Kartik

• 

  levanduyet

  • Post Options:
  • Link
    Copy

  Posted 16 January 2024, 12:06 am EST

  Hi Kartik,

  C1.Framework.C1CompositeIcon c1CompositeIcon1 = new C1.Framework.C1CompositeIcon();
              C1.Framework.C1PathIcon c1PathIcon1 = new C1.Framework.C1PathIcon();
  c1PathIcon1.AllowSmoothing = false;
              c1PathIcon1.Color = System.Drawing.Color.Red;
              c1PathIcon1.Data = "M-2.7755575615628892e-17,18.89795939167988 h24 v5.142857098579968 h-24 z";
              c1PathIcon1.Size = new System.Drawing.Size(16, 16);
              c1PathIcon1.Stroke = System.Drawing.Color.Empty;
              c1PathIcon1.ViewBox = new System.Drawing.Rectangle(0, 0, 24, 24);
              c1CompositeIcon1.Icons.Add(new C1.Framework.C1BitmapIcon("FontColor", new System.Drawing.Size(16, 16), System.Drawing.Color.Transparent, "Preset_SmallImages", -1));
              c1CompositeIcon1.Icons.Add(c1PathIcon1);
              c1CompositeIcon1.Size = new System.Drawing.Size(16, 16);
              this.ribbonColorPicker1.IconSet.Add(c1CompositeIcon1);

  So the above code that I have to add manual to the form.designer.cs ?

  Another one, how do I define this string.

  c1PathIcon1.Data = "M-2.7755575615628892e-17,18.89795939167988 h24 v5.142857098579968 h-24 z";

  I have copy and it’s okay but I want to understand it.

  Thanks,

  Duyet Le

• 

  kartik.dua

  

  • Post Options:
  • Link
    Copy

  Posted 16 January 2024, 4:06 pm EST

  Hi Duyet,

  You can add this code to the form.designer.cs, but we do not recommend manually changing the form.designer.cs code.

  Instead, we suggest adding this code to the form.cs (in the constructor or during the form load). If you include this code in the form.cs, just make sure to clear the current IconSet of your RibbonColorPicker before adding the new Icon. Please see the following code from our sample project:

  var pathIcon = new C1PathIcon
  {
   	AllowSmoothing = false,
          Color = ribbonColorPicker1.Color,
          Data = "M-2.7755575615628892e-17,18.89795939167988 h24 v5.142857098579968 h-24 z",
          Size = new Size(16, 16),
          Stroke = Color.Empty,
          ViewBox = new Rectangle(0, 0, 24, 24)
  };
  
  var bucketIcon = new C1BitmapIcon("FillTool", new Size(16, 16), Color.Transparent, "Preset_SmallImages", 150);
  
  C1CompositeIcon fillIcon = new C1CompositeIcon { Size = new Size(16, 16) };
  fillIcon.Icons.Add(bucketIcon);
  fillIcon.Icons.Add(pathIcon);
  
  ribbonColorPicker1.IconSet.Clear(); //clear the current IconSet
  ribbonColorPicker1.IconSet.Add(fillIcon);

  ---

  The Data property of the C1PathIcon stores an SVG path string describing the shape. Here is a reference link explaining the SVG path string - https://www.w3schools.com/graphics/svg_path.asp

  If you still face any issues, please provide a sample project showing your implementation, so we can investigate further and assist you better.

  Best Regards,
  
  Kartik