What is XAML in WPF? Explained with Simple Examples

Image
In this article, we’ll dive into one of the core building blocks of WPF — XAML. We’ll explore how it works and why it plays such an important role in building modern desktop applications. What is XAML? XAML stands for eXtensible Application Markup Language. It’s a markup language used to design the user interface in WPF applications. XAML allows developers and designers to work separately, making the code cleaner and easier to manage. Think of it as HTML for WPF apps. XAML Syntax XAML uses XML-style syntax. Every UI element is an XML tag. Attributes define properties like height, width, and content. You can also nest elements inside others to create more complex layouts. For example, placing a TextBlock inside a Grid layout. <Grid>     <TextBlock Text="Hello, WPF World!"                 Width="200"                 Height="50"              ...

How to Enable/Disable Button on Validation using DelegateCommand of Prism


 MainWindow.xaml

 <Window x:Class="Wpf.Views.MainWindow"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:local="clr-namespace:Wpf"
             mc:Ignorable="d">
     <Window.Resources>
         <ControlTemplate  x:Key="TextBoxErrorStyle">
             <StackPanel Orientation="Horizontal">
                 <AdornedElementPlaceholder x:Name="ErrorHolder" >
                     <Border BorderBrush="red" BorderThickness="1" />
                 </AdornedElementPlaceholder>
                 <TextBlock  Text="{Binding [0].ErrorContent}" VerticalAlignment="Center" HorizontalAlignment="Right" Foreground="Red"/>

             </StackPanel>
         </ControlTemplate>

     </Window.Resources>
     <StackPanel Orientation="Vertical" HorizontalAlignment="Left" >
         <TextBox Height="30" Width="200" Text="{Binding Text,Mode=TwoWay,NotifyOnValidationError=True,
                  ValidatesOnDataErrors=True,UpdateSourceTrigger=PropertyChanged}"
                  Validation.ErrorTemplate="{StaticResource TextBoxErrorStyle}" Margin="5" />
         <Button Content="Click Here" Command="{Binding ClickCommand}" Margin="10" Width="100"/>
     </StackPanel>
 </Window>


 MainWindow.xaml.cs

 public partial class MainWindow : Window
     {
       
         public MainWindow()
         {
             InitializeComponent();
             DataContext= new MainWindowViewModel();
         
         }
       
     }

MainWindowViewModel.cs


 using Prism.Commands;
 using Prism.Mvvm;

 public class MainWindowViewModel : BindableBase, IDataErrorInfo
     {
         private string _text = string.Empty;

         public string Text
         {
             get
             {
                 return _text;
             }
             set
             {
                 SetProperty(ref _text, value);
                 ClickCommand.RaiseCanExecuteChanged();

             }
         }
       
         public string Error => string.Empty;

         public string this[string columnName]
         {
             get
             {

                 if (columnName == "Text")
                 {
                     if (string.IsNullOrEmpty(Text?.Trim()))
                         return "Text should not be empty";
                 }
                 return string.Empty;
             }

         }
       
         private DelegateCommand _clickCommand;
       
         public DelegateCommand ClickCommand
         {
             get
             {
                 return _clickCommand = _clickCommand ?? new DelegateCommand(Click, () => !string.IsNullOrEmpty(_text));
             }

         }
       
         private void Click()
         {
             //code
         }
     }

Comments

Popular posts from this blog

Filter DataGrid and ListView in wpf using ICollectionView

Pagination of DataGrid in WPF using MVVM

How to Create TabControl using Prism Region