Scaling of Images in a GridImageColumn

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

Reply | Reply with quote

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

Reply | Reply with quote

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>

Sample link: https://www.syncfusion.com/downloads/support/directtrac/151121/ze/SfDataGridImagecolumn-805528757

Screenshot:

Please check the sample and let us know if you need further assistance on this.

Regards,

Susmitha S

Reply | Reply with quote

Helmut Wahrmann

Replied On February 3, 2020 02:49 PM UTC

Thanks, worked perfect.

Reply | Reply with quote

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

Reply | Reply with quote

Thread ID:	Created:	Updated:	Platform:	Replies:
151121	Jan 31,2020 10:37 AM UTC	Feb 4,2020 05:48 AM UTC	WPF	4

Thread ID:

Created:

Updated:

Platform:

Replies:

Please sign in to access our forum

CONTACT US