Adding Image to a button in Data Grid

Question

0.00/5 (No votes)

See more:

Hello,
I am creating a dynamic datahrid in wpf application... I the dynamic grid i am placing a delete button to delete the rows in a datagrid.... Now i want to place an imagebutton in the place of that button... Below code ihave used... but there is noresult... image is not displaying in place of button

Note: i am not using any of xaml... complete code is done through c# only... Pls dont post answers that are related to xaml... Beacuse in my screen i will get more than 5 datagrids... so xaml code will not work in dynamic creation ....... Here is my code.. Please help me guyzzz

C#

//Adding Button Dynamically
               DataGridTemplateColumn dgtcDel = new DataGridTemplateColumn();
               FrameworkElementFactory fefDelButton = new FrameworkElementFactory(typeof(Button));
               BitmapImage biDeleteIcon = new BitmapImage();

               fefDelButton.SetBinding(Button.TagProperty, new Binding("LineItemID"));
               fefDelButton.AddHandler(FrameworkElement.MouseLeftButtonDownEvent, new MouseButtonEventHandler(btnDelete_Click), true);
               DataTemplate buttonTemplate = new DataTemplate();
               StackPanel stackPanel = new StackPanel();


               dgtcDel.Header = "D";
               dgtcDel.HeaderStyle = grdHeaderStyle;
               buttonTemplate.VisualTree = fefDelButton;
               dgtcDel.CellTemplate = buttonTemplate;
               biDeleteIcon.BeginInit();
               biDeleteIcon.UriSource = new Uri(@"..\Images\Deleteicon.png", UriKind.Relative);
               biDeleteIcon.EndInit();

               fefDelButton.SetValue(Image.SourceProperty, biDeleteIcon);
               fefDelButton.SetValue(Image.VisibilityProperty, Visibility.Visible);
               grdCharges.Columns.Add(dgtcDel);

Posted 27-Oct-13 18:05pm

jing567

Updated 6-Nov-13 22:20pm

v2

Add a Solution

3 solutions

Add a Solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

jing567 · Answer 1 · 2013-11-15T02:20:00

I solved it my self only yar......

please follow the above code to add a utton dynamically and please use the below code to add image to that

FrameworkElementFactory

ControlTemplate ctTempExpand = new ControlTemplate(typeof(Button));
               var image = new FrameworkElementFactory(typeof(Image));

               ctTempExpand.VisualTree = image;
               image.SetValue(Image.SourceProperty, new BitmapImage(new Uri(@"Plus.png", UriKind.RelativeOrAbsolute)));
               image.SetValue(Image.HeightProperty, 21.0);
               image.SetValue(Image.WidthProperty, 18.0);
               fefDelButton .SetValue(Button.TemplateProperty,ctTempExpand);
               fefDelButton .SetValue(Button.ToolTipProperty, "Expand");

jing567 · Answer 2 · 2013-11-15T02:25:00

XML

I solved it my self only yar......


please follow the above code to add a utton dynamically and please use the below code to add image to that <pre>FrameworkElementFactory</pre>

<pre> ControlTemplate ctTempExpand = new ControlTemplate(typeof(Button));
                var image = new FrameworkElementFactory(typeof(Image));

                ctTempExpand.VisualTree = image;
                image.SetValue(Image.SourceProperty, new BitmapImage(new Uri(@"Plus.png", UriKind.RelativeOrAbsolute)));
                image.SetValue(Image.HeightProperty, 21.0);
                image.SetValue(Image.WidthProperty, 18.0);
                fefDelButton .SetValue(Button.TemplateProperty,ctTempExpand);
                fefDelButton .SetValue(Button.ToolTipProperty, "Expand");</pre>

Alexanbu · Answer 3 · 2013-11-19T00:32:00

The one way I know is, that defining formatting method for that column in grid structure. So instead of defining the structure of the grid declaratively, define in JavaScript object like below

var structure = [
{
name: "First Name",
field: "first_name"
},
{
name: "Action",
field: "_item",
formatter: function(item){
var btn = new dijit.form.Button({
label: "Edit"
});
return btn;
}
}

and set this structure to the grid

Adding Image to a button in Data Grid

3 solutions

Solution 1

Solution 2

Solution 3

Add your solution here

Preview 0

Adding Image to a button in Data Grid

3 solutions

Solution 1

Solution 2

Solution 3

Add your solution here

Preview 0

Existing Members

...or Join us