wpftoolkit/ExtendedWPFToolkitSolution/Src/Xceed.Wpf.Toolkit.LiveExplorer/CodeFiles/MaterialButtonView.xaml.txt

<!--*************************************************************************************

   Toolkit for WPF

   Copyright (C) 2007-2025 Xceed Software Inc.

   This program is provided to you under the terms of the XCEED SOFTWARE, INC.
   COMMUNITY LICENSE AGREEMENT (for non-commercial use) as published at 
   https://github.com/xceedsoftware/wpftoolkit/blob/master/license.md  

   For more features, controls, and fast professional support,
   pick up the Plus Edition at https://xceed.com/xceed-toolkit-plus-for-wpf/

   Stay informed: follow @datagrid on Twitter or Like http://facebook.com/datagrids

  ***********************************************************************************-->
<local:MaterialDemoView x:Class="Xceed.Wpf.Toolkit.LiveExplorer.Samples.MaterialControls.Views.MaterialButtonView"
                        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                        xmlns:local="clr-namespace:Xceed.Wpf.Toolkit.LiveExplorer"
                        xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
                        xmlns:sys="clr-namespace:System;assembly=mscorlib"
                        Title="MaterialButton">
   <local:DemoView.Description>
      <Paragraph FontSize="14"
                 FontFamily="Segoe">
         <Run>A Button with a raised animation on mouse over and a customizable ink animation on MousePress. It uses the Material Brushes.</Run>
         <!--##INCLUDE_OPEN_SOURCE
         <LineBreak />
         <LineBreak />
         <Run>This feature is only available in the "Plus" version.</Run>
         <LineBreak />
         <Hyperlink NavigateUri="https://xceed.com/xceed-toolkit-plus-for-wpf" RequestNavigate="Hyperlink_RequestNavigate">
            Click here for more details about Xceed Toolkit Plus for WPF.
         </Hyperlink>
       ##END-->
      </Paragraph>
   </local:DemoView.Description>
   
   <!--##EXCLUDE_OPEN_SOURCE-->
   <local:DemoView.Resources>
      <ResourceDictionary>
         <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="../Resources/CommonResources.xaml" />
         </ResourceDictionary.MergedDictionaries>
      
         <xctk:SolidColorBrushToColorConverter x:Key="SolidColorBrushToColorConverter" />

         <ObjectDataProvider x:Key="ButtonEnumData"
                             MethodName="GetValues"
                             ObjectType="{x:Type sys:Enum}">
            <ObjectDataProvider.MethodParameters>
               <x:Type TypeName="xctk:MaterialButtonModeEnum" />
            </ObjectDataProvider.MethodParameters>
         </ObjectDataProvider>
         
      </ResourceDictionary>
   </local:DemoView.Resources>

   <Grid>
      <StackPanel Margin="10">

         <GroupBox Header="Features"
                   Margin="0,5,0,5">
            <Grid Margin="5">
               <Grid.RowDefinitions>
                  <RowDefinition Height="Auto" />
                  <RowDefinition Height="Auto" />
                  <RowDefinition Height="Auto" />
                  <RowDefinition Height="Auto" />
               </Grid.RowDefinitions>
               <Grid.ColumnDefinitions>
                  <ColumnDefinition Width="Auto" />
                  <ColumnDefinition Width="95" />
                  <ColumnDefinition Width="Auto" />
                  <ColumnDefinition Width="Auto" />
               </Grid.ColumnDefinitions>

               <!-- First Column-->
               <TextBlock Grid.Column="0"
                          Text="Is Raised Active: "
                          VerticalAlignment="Center" />
               <CheckBox Grid.Column="1"
                         IsChecked="{Binding IsRaisedActive, ElementName=materialButton}"
                         VerticalAlignment="Center"
                         Margin="5" />
               <TextBlock Grid.Column="0"
                          Grid.Row="1"
                          Text="Mode: "
                          VerticalAlignment="Center" />
               <ComboBox Grid.Column="1"
                         Grid.Row="1"
                         ItemsSource="{Binding Source={StaticResource ButtonEnumData}}"
                         SelectedItem="{Binding Mode, ElementName=materialButton}"
                         SelectionChanged="ModeComboBox_SelectionChanged"
                         VerticalAlignment="Center"
                         Margin="5" />
               <TextBlock Grid.Column="0"
                          Grid.Row="2"
                          Text="Content: "
                          VerticalAlignment="Center" />
               <ComboBox x:Name="contentComboBox"
                         Grid.Column="1"
                         Grid.Row="2"
                         SelectedValue="{Binding Content, ElementName=materialButton}"
                         SelectedValuePath="Tag"
                         VerticalAlignment="Center"
                         Margin="5">
                  <ComboBoxItem Content="A string"
                                Tag="PRIMARY" />
                  <ComboBoxItem Content="An image">
                     <ComboBoxItem.Tag>
                        <Image Source="../Resources/WhitePen.png"
                               Width="30"
                               Height="30" />
                     </ComboBoxItem.Tag>
                  </ComboBoxItem>
               </ComboBox>
               <TextBlock Grid.Column="0"
                          Grid.Row="3"
                          Text="Material Accent Brush: "
                          VerticalAlignment="Center" />
               <ComboBox Grid.Column="1"
                         Grid.Row="3"
                         ItemsSource="{Binding MaterialBrushes, RelativeSource={RelativeSource AncestorType={x:Type local:MaterialDemoView}}}"
                         SelectedItem="{Binding MaterialAccentBrush, ElementName=materialButton}"
                         ItemTemplate="{StaticResource ColorItemTemplate}"
                         VerticalAlignment="Center"
                         Margin="5" />

               <!-- Second Column -->
               <TextBlock Grid.Column="2"
                          Grid.Row="0"
                          Text="Is Ink Effect Active: "
                          VerticalAlignment="Center"
                          Margin="10,0,0,0" />
               <CheckBox x:Name="inkEffectActiveCheckBox"
                         Grid.Column="3"
                         Grid.Row="0"
                         IsChecked="{Binding IsInkEffectActive, ElementName=materialButton}"
                         VerticalAlignment="Center"
                         Margin="5" />
               <TextBlock Grid.Column="2"
                          Grid.Row="1"
                          Text="Ink Effect Brush: "
                          VerticalAlignment="Center"
                          Margin="10,0,0,0"
                          IsEnabled="{Binding IsChecked, ElementName=inkEffectActiveCheckBox}"
                          Style="{StaticResource DisableGrayText}" />
               <xctk:ColorPicker Grid.Column="3"
                                 Grid.Row="1"
                                 SelectedColor="{Binding InkEffectBrush, ElementName=materialButton, Converter={StaticResource SolidColorBrushToColorConverter}}"
                                 DisplayColorAndName="True"
                                 VerticalAlignment="Center"
                                 Width="125"
                                 Margin="5"
                                 IsEnabled="{Binding IsChecked, ElementName=inkEffectActiveCheckBox}" />
               <TextBlock Grid.Column="2"
                          Grid.Row="2"
                          Text="Ink Effect Opacity: "
                          VerticalAlignment="Center"
                          Margin="10,0,0,0"
                          IsEnabled="{Binding IsChecked, ElementName=inkEffectActiveCheckBox}"
                          Style="{StaticResource DisableGrayText}" />
               <xctk:DoubleUpDown Grid.Column="3"
                                  Grid.Row="2"
                                  Value="{Binding InkEffectOpacity, ElementName=materialButton}"
                                  Minimum="0"
                                  Maximum="1"
                                  Increment="0.05"
                                  FormatString="N2"
                                  VerticalAlignment="Center"
                                  Margin="5"
                                  IsEnabled="{Binding IsChecked, ElementName=inkEffectActiveCheckBox}" />
            </Grid>
         </GroupBox>

         <StackPanel>
            <TextBlock Text="Usage:"
                       Style="{StaticResource Header}" />

            <xctk:MaterialButton x:Name="materialButton"
                                 Content="PRIMARY"
                                 Margin="20"
                                 Padding="20"
                                 IsRaisedActive="True"
                                 IsInkEffectActive="True"
                                 InkEffectBrush="White"
                                 InkEffectOpacity="0.25"
                                 Mode="Rectangle"
                                 HorizontalAlignment="Center" />
         </StackPanel>
      </StackPanel>
   </Grid>
   <!--##END-->

   <!--##INCLUDE_OPEN_SOURCE
    <Image Source="..\OpenSourceImages\MaterialButton.png" Width="600" Height="400"/>
   ##END-->
</local:MaterialDemoView>