dir.by  
  Поиск  
Компьютер, программы
WPF. Windows Presentation Foundation (standalone .exe file)
 Пример "Устанавливаем текст в TextBlock используя Binding". Еще добавим двойной Bindning используя INotifyPropertyChanged | C# WPF приложение 
посмотрели 8277 раз
обновлено: 30 January 2023
Пример 1. Binding в одну сторону. То есть при создании TextBlock текст берется из BookName
  Добавим TextBlock в файл MainWindow.xaml
<Window x:Class="WpfApp1.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:WpfApp1"
          mc:Ignorable="d"
          Title="MainWindow" Height="450" Width="800">
     <Grid>

          <TextBlock Text="{Binding BookName}"
               VerticalAlignment="Top"
               HorizontalAlignment="Center"
               Margin="0 20 0 0"/>

     </Grid>
</Window>
  Добавим код в файл MainWindow.xaml.cs
using System.Windows;

namespace WpfApp1
{
     public partial class MainWindow : Window
     {
          public string BookName { get; set; }

          public MainWindow()
          {
               BookName = "King of monkey";

               InitializeComponent();

               // for binding
               this.DataContext = this;
          }
     }
}
Запускаем программу:
Видим что TextBlock отобразил текст "King of monkey"
То есть при создании TextBlock вызвался Bindning с переменной BookName
и вызвался метод get в BookName
Шаг 1. Программа запустилась
Видим что TextBlock отобразил текст "King of monkey"

Что произошло:
То есть при создании TextBlock
Текст для TextBlock берется с помощью вызова get из переменной BookName
   это связывание TextBlock и переменной BookName
   это прописано в нашем xaml файле <TextBlock Text="{Binding BookName}" .../>
Пример 2. По нажатию кнопки сделаем BookName = "Hello". TextBlock НЕ обновится
  Поменяем файл MainWindow.xaml
<Window x:Class="WpfApp1.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:WpfApp1"
          mc:Ignorable="d"
          Title="MainWindow" Height="450" Width="800">
     <Grid>

          <TextBlock Text="{Binding BookName}"
               VerticalAlignment="Top"
               HorizontalAlignment="Center"
               Margin="0 20 0 0"/>

          <Button
               VerticalAlignment="Top"
               HorizontalAlignment="Center"
               Margin="0 50 0 0"
               Content="Set Hello"
               Command="{Binding ClickMyButton1, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}"
               Width="142"/>
         
     </Grid>
</Window>
  Добавим код в файл MainWindow.xaml.cs
using System;
using System.Windows;
using System.Windows.Input;

namespace WpfApp1
{
     class ButtonCommand : ICommand
     {
          public event EventHandler CanExecuteChanged;
          private Action<object> _callback;
          public ButtonCommand(Action<object> callback)
          {
               _callback = callback;
          }
          public virtual void Execute(object parameter) { _callback(parameter); }
          public virtual bool CanExecute(object parameter) { return true; }
     }

     public partial class MainWindow : Window
     {
          public string BookName { get; set; }
          public ICommand ClickMyButton1 { get; set; }

          public MainWindow()
          {
               BookName = "King of monkey";

               // button handler
               ClickMyButton1 = new ButtonCommand((parameter) => {

                    BookName = "Hello";

               });

               InitializeComponent();

               // for binding
               this.DataContext = this;
          }
     }
}
Запускаем программу:
Шаг 1. Программа запустилась
Видим что TextBlock отобразил текст "King of monkey"
Шаг 2. Нажмем на кнопку "Set Hello"
Видим что TextBlock все равно отображает "King of monkey"
Пример 3. Двойной Binding. По нажатию кнопки сделаем BookName = "Hello" и TextBlock обновится
  Поменяем файл MainWindow.xaml
<Window x:Class="WpfApp1.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:WpfApp1"
          mc:Ignorable="d"
          Title="MainWindow" Height="450" Width="800">
     <Grid>

          <TextBlock Text="{Binding MyModel.BookName}"
               VerticalAlignment="Top"
               HorizontalAlignment="Center"
               Margin="0 20 0 0"/>

          <Button
               VerticalAlignment="Top"
               HorizontalAlignment="Center"
               Margin="0 50 0 0"
               Content="Set Hello"
               Command="{Binding MyModel.ClickMyButton1, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}"
               Width="142"/>
         
     </Grid>
</Window>
  Добавим код в файл MainWindow.xaml.cs
using System;
using System.ComponentModel;
using System.Runtime.CompilerServices;
using System.Windows;
using System.Windows.Input;

namespace WpfApp1
{
     public class ModelInfo : NotifyPropertyChanged
     {
          private string _bookName;
          public string BookName
          {
               get => _bookName;
               set => SetProperty(ref _bookName, value);
          }
          public ICommand ClickMyButton1 { get; set; }
          public ModelInfo()
          {
               BookName = "King of monkey";

               // button handler
               ClickMyButton1 = new ButtonCommand((parameter) => {

                    BookName = "Hello";

               });
          }

     }
    
     public partial class MainWindow : Window
     {
          public ModelInfo MyModel { get; }

          public MainWindow()
          {
               MyModel = new ModelInfo();

               InitializeComponent();

               // for binding
               this.DataContext = this;
          }
     }

     ///// Base functionality /////
     public class NotifyPropertyChanged : INotifyPropertyChanged
     {
          public event PropertyChangedEventHandler PropertyChanged;
          protected void OnPropertyChanged([CallerMemberName] string name = null)
          {
               PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
          }
          protected virtual bool SetProperty<T>(ref T field, T value, [CallerMemberName] string PropertyName = null)
          {
               if (Equals(field, value)) return false;
               field = value;
               OnPropertyChanged(PropertyName);
               return true;
          }
     }

     class ButtonCommand : ICommand
     {
          public event EventHandler CanExecuteChanged;
          private Action<object> _callback;
          public ButtonCommand(Action<object> callback)
          {
               _callback = callback;
          }
          public virtual void Execute(object parameter) { _callback(parameter); }
          public virtual bool CanExecute(object parameter) { return true; }
     }
     ////////////
}
Запускаем программу:
Шаг 1. Программа запустилась
Видим что TextBlock отобразил текст "King of monkey"
Шаг 2. Нажмем на кнопку "Set Hello"
Видим что TextBlock отобразил текст "Hello"

Что произошло:
То есть при нажатии на кнопку выполняется BookName = "Hello";
   вызывается set метод переменной BookName
   set => SetProperty(ref _bookName, value);
   вызывется SetProperty
   вызывется OnPropertyChanged и идет уведомление элементу TextBlock что нужно установить новый текст
 
← Previous topic
Example "I make animations for icons, library fontawesome5" | C# WPF application
 
Next topic →
Example "Several TextBlocks (showing the texts) and making the element where mouse (mouse over)" | C# WPF application
 
Your feedback ... Comments ...
   
Your Name
Your comment (www links can only be added by a logged-in user)

  Объявления  
  Объявления  
 
WPF Simple New Application
Creating a New WPF Application | C#
WPF layout
Making a layout with DockPanel and StackPanel in WPF
Events
Example "Get the mouse coordinates when you left-click on TextBlock"| Screen Coordinates and Relative Coordinates | C# WPF application
Example "Get the mouse coordinates when you click the left mouse button on Button"| Screen Coordinates and Relative Coordinates | C# WPF application
Example "Get the mouse coordinates when you left-click on Grid and draw a line"| C# WPF application
Example "When you double-click on Grid, we show the message"| C# WPF application
WPF elements
Label
Example "Setting the text in Label" via c# code | WPF application
FontAwesome icons
Example "I show icons, for the icon I connect the fontawesome5" library | C# WPF application
Example "I make animations for icons, library fontawesome5" | C# WPF application
 <BR>
TextBlock
Example "Set the text in the TextBlock using Binding". Let"s also add double Bindning using INotifyPropertyChanged | C# WPF application
Example "Several TextBlocks (showing the texts) and making the element where mouse (mouse over)" | C# WPF application
Example "Get the mouse coordinates when you left-click on TextBlock"| Screen Coordinates and Relative Coordinates | C# WPF application
Button
Example "Get the mouse coordinates when you click the left mouse button on Button"| Screen Coordinates and Relative Coordinates | C# WPF application
TextBox
Example "Installing and getting text in a TextBox using Binding" | C# WPF application
Example "Set text in TextBox" via c# code | WPF application
 <BR>
TextBox with Place Holder
Example "Showing the Place Holder in TextBox" | WPF application
Example "Showing a Place Holder with an icon in TextBox", for the icon I include the fontawesome5 library | WPF application
 <BR>
TextBox with text validation
Example "Set the text in the TextBox using Binding and do validation (if the text is not correct)" | C# WPF application
 <BR>
ComboBox
Example "In ComboBox, we do text editing. Getting the text using Binding" | C# WPF application
 <BR>
ItemsControl
Example "ItemsControl, button and click handler" | WPF application
Grid
What is Grid in WPF
How to Add RowDefinition, ColumnDefinition to a Grid (with the mouse in the XAML design editor) | C# WPF application
Adding vertical scrolling | WPF application
DataGrid
Example "DataGrid doing bind data", button and click handler in DataGrid, text alignment in DataGrid, scrolling | WPF application
How do I scroll for DataGrid? | C# WPF application
Scrolling for DataGrid (so that scrolling works when we spin the mouse wheel and the mouse is outside the scroll bar) | C# WPF application
How do I color row when I click on row (change background for selected row) in DataGrid? | C# WPF application
How do I highlight a row DataGrid (make background) ? | C# WPF application
Example "DataGrid: sorting the column according to our own algorithm (Custom Sort)" | WPF application
DataGrid inside DataGrid
Example of an employee portfolio with task descriptions: "DataGrid inside DataGrid using RowDetailsTemplate" | WPF application
 <BR>
ListView
Example "In the ListView, expand the column when adding data (auto column width)" | WPF application
Example "In the ListView, we use ItemTemplate DataTemplate" | WPF application
 <BR>
ScrollViewer
Adding vertical scrolling | WPF application
How do I scroll for DataGrid? | C# WPF application
Scrolling for DataGrid (so that scrolling works when we spin the mouse wheel and the mouse is outside the scroll bar) | C# WPF application
Example "Do ScrollBar less(more) in ScrollViewer" | C# WPF application
Resource file
Add an image (jpg, bmp, png) to the project and mark it as Resource | C# WPF application
Image
In the Image element, show the image (jpg, bmp, png) from Resource | C# WPF application
Select the image (jpg, bmp, png) from the computer and show it in the Image element. Saving the image to the database | C# WPF application
Example "In the Image element, make a Binding for Source" | C# WPF application
Example "Convert the base64 text to a Bitmap image and show it in the Image element" | C# WPF application
Example "Open an SVG file and show the image in the Image element" | C# WPF application
 <BR>
Canvas
Example "Create a Canvas and draw a picture" C# WPF
Example "Drawing a picture with movement on Canvas" C# WPF
Example "Drawing a picture with motion and sprite animation on Canvas" C# WPF
 <BR>
Line
How to Draw a Line | C# WPF application
Example "Create and draw a line by left-clicking on Grid"| Grid Line | C# WPF application
Convert the image to XAML Path Geometry
Convert SVG to XAML (using Adobe Illustrator), populate the Path Data Geometry, show the lines on the screen | C# WPF application
Convert SVG to XAML (using Dias SVG to UWP XAML Converter), populate the Path Data Geometry, show the lines on the screen | C# WPF application
How to Convert PNG to SVG to XAML | C# WPF application
Converter SVG to XAML | WPF C#
How to Convert XAML to SVG | C# WPF application
ViewBox
Example "ViewBox Binding for Left, Top, Width, Height, ContetnPresenter binding" | C# WPF application
Width by percentage
Divide the screen vertically (by width) into 2 equal parts of the screen (width1 = 50%, width2 = 50%), use Grid | C# WPF application
Split the screen vertically (by width) into 2 parts (width1 = 70%, width2 = 30%), using Grid | C# WPF application
Example "Set the width of the element as a percentage of the width of the parent element" (width in percentage), write your IValueConverter | C# WPF application
Database (Entity Framework)
Entity Framework in a WPF application. Using Code First (we write c# code, and the tables in the database are created by ourselves)
Creating Your WPF Elements
Example "Create your own WPF element using Style and a new xaml file. The new element is: at the top Title, at the bottom the text in the frame. Using Binding | C# WPF application
Example "Create your new WPF element with your own properties in the new cs and xaml files. In WPF, a new element: Title at the top, text at the bottom, and in the box | C# WPF application
WPF application with Prism library (MVVM design pattern)
Create a new WPF application with Prism Unity (splitting the project into Services, Views, ViewModels folders). MVVM (Model-View-ViewModel) Patern | C#
WPF application with Prism Unity. In the Tab app and splitting into separate xamls using Region.
WPF application with Locator (MVVM design pattern)
Creating a new WPF application with Locator (dividing the project into Views, ViewModels folders)
How do I add Dependency Injection, boot from appsettings.json in a new WPF application?
Automated Tests
Writing an automated test for a WPF C# application (using Nuget.Appium and the AutomationProperties.AutomationId property)
Interview Questions
What is the difference between static resource and dynamic resource? | WPF C#
Additional topics, questions
Open the properties window for a graphic element in WPF application C#
Errors
Error "To run this application, you must install .NET. Would you like to download it now?" | I run WPF the application on C#
Books
WPF Study Books

  Ваши вопросы присылайте по почте: info@dir.by