WPF Button with Image

Question

I m trying to attach an image on a button in WPF  however this code fails   Seems strange after similar code would work perfectly in Mozilla XUL    lt Button Height  49 086  Margin  3 636 12 231 795 0  Name  button2           VerticalAlignment  Top  Grid Column  1  Click  button2 Click           Source  Pictures apple jpg  gt Disconnect from Server lt  Button gt

User · Answer

Another way to Stretch image to full button. Can try the below code.

<Grid.Resources>
  <ImageBrush x:Key="AddButtonImageBrush" ImageSource="/Demoapp;component/Resources/AddButton.png" Stretch="UniformToFill"/>
</Grid.Resources>

<Button Content="Load Inventory 1" Background="{StaticResource AddButtonImageBrush}"/>

Referred from Here

Also it might helps other. I posted the same with MouseOver Option here.

User · Answer

Most simple approach would be using the Image tag    lt Button Name  btn  Width  26  Height  26  Click  btnClick  gt       lt Image Source  Resource btn-icon png   gt   lt  Button gt    Suppose your image file is added in Resource folder

User · Answer

This should do the job  no    lt Button Content  Test  gt       lt Button Background gt           lt ImageBrush ImageSource  folder file PNG   gt       lt  Button Background gt   lt  Button gt

User · Answer

You can create a custom control that inherits from the Button class  This code will be more reusable  please look at the following blog post for more details  WPF - create custom button with image  ImageButton    Using this control    lt local ImageButton Width  200  Height  50  Content  Click Me       ImageSource  ok png  ImageLocation  Left  ImageWidth  20  ImageHeight  25    gt    ImageButton cs file   public class ImageButton   Button      static ImageButton               DefaultStyleKeyProperty OverrideMetadata typeof ImageButton   new FrameworkPropertyMetadata typeof ImageButton              public ImageButton               this SetCurrentValue ImageButton ImageLocationProperty  WpfImageButton ImageLocation Left            public int ImageWidth             get   return  int GetValue ImageWidthProperty            set   SetValue ImageWidthProperty  value              public static readonly DependencyProperty ImageWidthProperty          DependencyProperty Register  ImageWidth   typeof int   typeof ImageButton   new PropertyMetadata 30        public int ImageHeight             get   return  int GetValue ImageHeightProperty            set   SetValue ImageHeightProperty  value              public static readonly DependencyProperty ImageHeightProperty          DependencyProperty Register  ImageHeight   typeof int   typeof ImageButton   new PropertyMetadata 30        public ImageLocation  ImageLocation             get   return  ImageLocation GetValue ImageLocationProperty            set   SetValue ImageLocationProperty  value              public static readonly DependencyProperty ImageLocationProperty          DependencyProperty Register  ImageLocation   typeof ImageLocation    typeof ImageButton   new PropertyMetadata null  PropertyChangedCallback        private static void PropertyChangedCallback DependencyObject d  DependencyPropertyChangedEventArgs e              var imageButton    ImageButton d         var newLocation    ImageLocation   e NewValue    WpfImageButton ImageLocation Left          switch  newLocation                      case WpfImageButton ImageLocation Left                 imageButton SetCurrentValue ImageButton RowIndexProperty  1                  imageButton SetCurrentValue ImageButton ColumnIndexProperty  0                  break             case WpfImageButton ImageLocation Top                 imageButton SetCurrentValue ImageButton RowIndexProperty  0                  imageButton SetCurrentValue ImageButton ColumnIndexProperty  1                  break             case WpfImageButton ImageLocation Right                 imageButton SetCurrentValue ImageButton RowIndexProperty  1                  imageButton SetCurrentValue ImageButton ColumnIndexProperty  2                  break             case WpfImageButton ImageLocation Bottom                 imageButton SetCurrentValue ImageButton RowIndexProperty  2                  imageButton SetCurrentValue ImageButton ColumnIndexProperty  1                  break             case WpfImageButton ImageLocation Center                 imageButton SetCurrentValue ImageButton RowIndexProperty  1                  imageButton SetCurrentValue ImageButton ColumnIndexProperty  1                  break             default                 throw new ArgumentOutOfRangeException                      public ImageSource ImageSource             get   return  ImageSource GetValue ImageSourceProperty            set   SetValue ImageSourceProperty  value              public static readonly DependencyProperty ImageSourceProperty          DependencyProperty Register  ImageSource   typeof ImageSource   typeof ImageButton   new PropertyMetadata null        public int RowIndex             get   return  int GetValue RowIndexProperty            set   SetValue RowIndexProperty  value              public static readonly DependencyProperty RowIndexProperty          DependencyProperty Register  RowIndex   typeof int   typeof ImageButton   new PropertyMetadata 0        public int ColumnIndex             get   return  int GetValue ColumnIndexProperty            set   SetValue ColumnIndexProperty  value              public static readonly DependencyProperty ColumnIndexProperty          DependencyProperty Register  ColumnIndex   typeof int   typeof ImageButton   new PropertyMetadata 0       public enum ImageLocation      Left     Top     Right     Bottom     Center     Generic xaml file    lt ResourceDictionary     xmlns  http   schemas microsoft com winfx 2006 xaml presentation      xmlns x  http   schemas microsoft com winfx 2006 xaml      xmlns local  clr-namespace WpfImageButton  gt       lt Style TargetType   x Type local ImageButton   BasedOn   StaticResource  x Type Button    gt           lt Setter Property  ContentTemplate  gt               lt Setter Value gt                   lt DataTemplate gt                       lt Grid gt                           lt Grid RowDefinitions gt                               lt RowDefinition Height  Auto   gt                               lt RowDefinition Height      gt                               lt RowDefinition Height  Auto   gt                           lt  Grid RowDefinitions gt                           lt Grid ColumnDefinitions gt                               lt ColumnDefinition Width  Auto   gt                               lt ColumnDefinition Width      gt                               lt ColumnDefinition Width  Auto   gt                           lt  Grid ColumnDefinitions gt                           lt Image Source   Binding ImageSource  RelativeSource  RelativeSource AncestorType local ImageButton                                   Width   Binding ImageWidth  RelativeSource  RelativeSource AncestorType local ImageButton                                   Height   Binding ImageHeight  RelativeSource  RelativeSource AncestorType local ImageButton                                   Grid Row   Binding RowIndex  RelativeSource  RelativeSource AncestorType local ImageButton                                   Grid Column   Binding ColumnIndex  RelativeSource  RelativeSource AncestorType local ImageButton                                   VerticalAlignment  Center  HorizontalAlignment  Center  gt  lt  Image gt                           lt ContentPresenter Grid Row  1  Grid Column  1  Content   TemplateBinding Content                                             VerticalAlignment  Center  HorizontalAlignment  Center  gt  lt  ContentPresenter gt                       lt  Grid gt                   lt  DataTemplate gt               lt  Setter Value gt           lt  Setter gt       lt  Style gt   lt  ResourceDictionary gt

User · Answer

lt Button x Name  myBtn DetailsTab Save  FlowDirection  LeftToRight   HorizontalAlignment  Left  Margin  835 544 0 0  VerticalAlignment  Top   Width  143  Height  53  BorderBrush   FF0F6287  HorizontalContentAlignment  Center  VerticalContentAlignment  Center  FontFamily  B Titr  FontSize  15  FontWeight  Bold  BorderThickness  2  Click  myBtn DetailsTab Save Click  gt       lt StackPanel HorizontalAlignment  Stretch  Background   FF1FB3F5  Cursor  Hand   gt           lt Image HorizontalAlignment  Left   Source  image bg Save png  Height  36  Width  124    gt           lt TextBlock HorizontalAlignment  Center  Width  84  Height  22  VerticalAlignment  Top  Margin  0 -31 -58 0  Text               gt       lt  StackPanel gt   lt  Button gt

User · Answer

You want to do something like this instead    lt Button gt       lt StackPanel gt           lt Image Source  Pictures apple jpg    gt           lt TextBlock gt Disconnect from Server lt  TextBlock gt       lt  StackPanel gt   lt  Button gt

[wpf] WPF Button with Image

Examples related to wpf