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. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Scaling of Images in a GridImageColumn

Thread ID:

Created:

Updated:

Platform:

Replies:

151121 Jan 31,2020 10:37 AM UTC Feb 4,2020 05:48 AM UTC WPF 4
loading
Tags: SfDataGrid
Helmut Wahrmann
Asked On January 31, 2020 10:37 AM UTC

Hi,

i am using a SfDatagrid in my View. The columns are bound to an object in m view model.
On startup i am creating te columns based on the type.

I have a "Status" column, which is bound to an Integer. 0 = Status Ok, 1 = Changed, 2 = Error.
Based on the Status a Image should be shown.

I have defined this column as Image column and created a ValueBinding to an IValueConverter. Something like this:

        column = new GridImageColumn();
        Binding binding = new Binding("Status");
        binding.Converter = new SongStatusToImageConverter();
        column.ValueBinding = binding;
        column.VerticalAlignment = VerticalAlignment.Center;

In my SongStatusToImageConverter, i have declared:

public BitmapImage Ok = new BitmapImage(new Uri("pack://application:,,,/MPTagThat;component/Resources/Images/Status_Ok.png"));

and if i have status = 0, i am returning the Bitmapimage for "Ok".

This works fine, but tough the image has a size of 16 x 14, it seems to be scaled up.



Resizing the column, also resizes the image:


But how can i display the image, without any scaling in it's original size?
I'd like to have a solution working in MVVM model, without any code behind, if possible.

thanks,

Helmut

Helmut Wahrmann
Replied On January 31, 2020 10:55 AM UTC

Nevermind. I have recreated the Icon and used a Size of 18 x 18 and it looks ok now.

 Only thing remaining now, is how to center the image in the column.

thanks,

Helmut

Susmitha Sundar [Syncfusion]
Replied On February 3, 2020 02:04 PM UTC

Hi Helmut, 
 
Thank you for your update. 
 
You can achieve your requirement by set the TextAlignment property as centre for GridImageColumn. Please refer the below code, 
C#: 
<syncfusion:SfDataGrid x:Name="sfDataGrid"  
                        RowHeight="50" 
                        ItemsSource="{Binding Path=Orders}" 
                        AutoGenerateColumns="False"> 
     <syncfusion:SfDataGrid.Columns> 
         <syncfusion:GridTextColumn MappingName="OrderID"/> 
         <syncfusion:GridImageColumn MappingName="Clouds" ImageHeight="40" ImageWidth="40" ValueBinding="{Binding Path=Clouds,Converter={StaticResource converter}}" TextAlignment="Center" /> 
         <syncfusion:GridTextColumn MappingName="CustomerID" /> 
         <syncfusion:GridTextColumn MappingName="CustomerName" /> 
         <syncfusion:GridTextColumn MappingName="Country" /> 
         <syncfusion:GridTextColumn MappingName="UnitPrice"/> 
     </syncfusion:SfDataGrid.Columns> 
 </syncfusion:SfDataGrid> 
 
 
 
Screenshot: 
 
Please check the sample and let us know if you need further assistance on this. 
 
Regards, 
Susmitha S 


Helmut Wahrmann
Replied On February 3, 2020 02:49 PM UTC

Thanks, worked perfect.

Farjana Parveen Ayubb [Syncfusion]
Replied On February 4, 2020 05:48 AM UTC

Hi Helmut, 
 
Thanks for the update. 
 
We are glad to know that the reported problem has been resolved at your end. Please let us know if you have any further queries on this. We are happy to help you. 
 
Regards, 
Farjana Parveen A 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon