We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

How to change image from a GridImageColumn on click event

How can I change a image of CellGrid when click event occurs?

Example:

grid.CellClick += Grid_CellClick;
private void Grid_CellClick(object sender, Syncfusion.WinForms.DataGrid.Events.CellClickEventArgs e)
{
var obj = e.DataRow.RowData as DGVClass;
if (obj.Play == StatusPlayer.Stop) //Not playing
{
PlayFile(obj); // Play obj.File and set obj.Play = StatusPlayer.Playing
(sender as XXX).Image = Properties.Resources.Stop; // <= How do this?
}
else if (obj.Play == StatusPlayer.Playing)
{
StopFile(obj); // Stop obj.File and set obj.Play = StatusPlayer.Stop
(sender as XXX).Image = Properties.Resources.Play; // <= How do this?
}
//another elses
}

3 Replies 1 reply marked as answer

VS Vijayarasan Sivanandham Syncfusion Team October 21, 2022 10:20 AM

Hi Leopoldo C,

Your requirement to change the Image when a cell clicks in SfDataGrid can be achieved by loading the image based on cell value using the SfDataGrid.QueryImageCellStyle event and change the cell value in the CellClick event to change the image. Please refer to the below code snippet,

//Event subscription

 sfDataGrid.QueryImageCellStyle += OnQueryImageCellStyle;

 

//Event Customization

 private void OnQueryImageCellStyle(object sender, QueryImageCellStyleEventArgs e)

 {

     var employee = (Employee)e.Record;

 

     if (e.Column.MappingName == "Trustworthiness")

     {

         if (employee.Trustworthiness.ToString() == "Sufficient")

         {

             //Here add the image to display based on the custom condition

             e.Image = (Image.FromFile(@"..\..\Images\Sufficient.png"));

             e.DisplayText = string.Empty;

         }

         else if (employee.Trustworthiness.ToString() == "Insufficient")

         {

             //Here add the image to display based on the custom condition

             e.Image = (Image.FromFile(@"..\..\Images\Insufficient.png"));

             e.DisplayText = string.Empty;

         }

         else if (employee.Trustworthiness.ToString() == "Perfect")

         {

             //Here add the image to display based on the custom condition

             e.Image = (Image.FromFile(@"..\..\Images\Perfect.png"));

             e.DisplayText = string.Empty;

         }

     }

     else if (e.Column.MappingName == "EmployeeName")

     {

 

         e.Image = employee.Gender == "1" ? (Image.FromFile(@"..\..\Images\Male.png")) : (Image.FromFile(@"..\..\Images\Female.png"));

         //here display the image with text

         e.DisplayText = (e.Record as Employee).EmployeeName.ToString();

         e.TextImageRelation = TextImageRelation.ImageBeforeText;

     }

     else

     {

         e.Image = (Image.FromFile(@"..\..\Images\location.png"));

         //here display the image with text

         e.DisplayText = (e.Record as Employee).Location.ToString();

         e.TextImageRelation = TextImageRelation.ImageBeforeText;

     }

 }



C# Code Snippet to change the Image when the cell click in SfDataGrid:

//Event subscription

sfDataGrid.CellClick += OnCellClick;

 

//Event Customization

private void OnCellClick(object sender, CellClickEventArgs e)

{

    //Here get the cell clicked data

    var obj = e.DataRow.RowData as Employee;

 

    //Here check the data and change the data based on your scenario

    if (obj.Trustworthiness.ToString() == "Sufficient") //Not playing

    {

        //Here change the value to change the image when cell click in SfDataGrid

        obj.Trustworthiness = "Perfect";

 

    }

    else if (obj.Trustworthiness.ToString() == "Perfect")

    {

        //Here change the value to change the image when cell click in SfDataGrid

        obj.Trustworthiness = "Insufficient";

    }

    else if (obj.Trustworthiness.ToString() == "Insufficient")

    {

        //Here change the value to change the image when cell click in SfDataGrid

        obj.Trustworthiness = "Sufficient";              

    }

}


For more information related to GridImageColumn, please refer to the user guide documentation link,

UG Link: https://help.syncfusion.com/windowsforms/datagrid/columntypes#gridimagecolumn


Please find the sample in the attachment and let us know if you have any concerns about this.


Regards,

Vijayarasan S


If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.


Attachment: Sample_4844e16c.zip

Marked as answer

LC Leopoldo C. replied to Vijayarasan Sivanandham November 3, 2022 11:56 AM

It works!

Thank you!



VD Vasanthkumar Durairaj Syncfusion Team November 7, 2022 09:15 AM

We are glad that the reported issue was resolved on your side. Please let us know if you need any other details on this. As always, we will be happy to assist you.


Loader.
Live Chat Icon For mobile
Up arrow icon