Simple Data Binding

Data Binding in WPF Data Binding, Binding Properties ,[object Object],[object Object],[object Object],[object Object],[object Object]

Table of Contents ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Table of Contents (2) ,[object Object],[object Object],[object Object],[object Object],[object Object]

Why We Need Data Binding? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Why We Need Data Binding? (2) ,[object Object],[object Object],[object Object],[object Object],[object Object]

Simple B inding ,[object Object],[object Object],[object Object]

Simple B inding (2) ,[object Object],[object Object],[object Object],[object Object],<TextBox ...> <TextBox.Text> <Binding Path="SomeName" /> </TextBox.Text> </TextBox> <TextBox Text="{Binding Path=SomeName}" />

Data Contexts ,[object Object],[object Object],[object Object],[object Object],[object Object]

Data Contexts (2) ,[object Object],[object Object], <Grid Name="GridMain"> … <TextBlock …>Name: </TextBlock> <TextBox Text="{Binding Path=Name}" … /> <TextBlock …>Age:</TextBlock> <TextBox Text="{Binding Path=Age}" … /> <Button Name="ButtonBirthday Content="Birthday!" … /> </Grid>

Data Contexts (3) ,[object Object],public partial class MainWindow : Window { Person person = new Person("Tom", 11); public MainWindow() { InitializeComponent(); GridMain.DataContext = person; } … }

Binding to Other Controls ,[object Object],[object Object],<TextBox Name="ageTextBox" Foreground="Red" … /> <Button … Foreground="{Binding ElementName=ageTextBox, Path=Foreground}" Content="Birthday" />

Binding to Other Controls Live Demo

The Binding Class and Its Properties

Binding Class ,[object Object],[object Object],[object Object],[object Object],<TextBox x:Name="TextBoxPerson" Foreground="{Binding Path=Age, Mode=OneWay, Source={StaticResource Tom}, Converter={StaticResource ageConverter}}" />

Binding Class (2) ,[object Object],[object Object],[object Object],[object Object],[object Object]

Binding Class (3) ,[object Object],[object Object],[object Object],[object Object]

Value Conversion ,[object Object],[object Object],[object Object],[object Object],<TextBox Text="{Binding Path=Age}" Foreground="{Binding Path=Age, …}" … />

Value Conversion (2) ,[object Object],[object Object],[object Object],[object Object]

Value Conversion (3) ,[object Object],[object Object],[object Object]

Value Conversion (4) ,[object Object],public class AgeToForegroundConverter : IValueConverter { public object Convert(object value, Type targetType, …) { if (targetType != typeof(Brush)) { return null; } int age = int.Parse(value.ToString()); return (age > 25 ? Brushes.Red : Brushes.Black); } … }

Value Conversion (4) ,[object Object],<Window … xmlns:local="clr-namespace:WithBinding"> <Window.Resources> <local:Person x:Key="Tom" … /> <local:AgeToForegroundConverter x:Key="ageConverter"/> </Window.Resources> <Grid DataContext="{StaticResource Tom}"> … <TextBox Text="{Binding Path=Age}" Foreground="{Binding Path=Age, Converter={StaticResource ageConverter}}" … /> … <Button … Foreground="{Binding Path=Foreground, ElementName=ageTextBox}">Birthday</Button> </Grid> </Window>

Data Validation ,[object Object],[object Object],class EGNValidationRule : ValidationRule { public override ValidationResult Validate( object value, CultureInfo cultureInfo) { if (Regex.IsMatch((string)value, "{10}")) return new ValidationResult(true, null); else return new ValidationResult(false, "Invalid EGN"); } }

Data Validation (2) ,[object Object],[object Object],[object Object],[object Object],Validation.GetHasError(UIElement) var errors = Validation.GetErrors(UIElement); string errorMsg = (string)errors[0].ErrorContent;

Data Validation (3) <Window x:Class="BindingValidation.MainWindow" … xmlns:local="clr-namespace:BindingValidation" /> … <TextBox Name="TextBoxEGN"> <TextBox.Text> <Binding Path="EGN"> <Binding.ValidationRules> <local:EGNValidationRule /> </Binding.ValidationRules> </Binding> </TextBox.Text> </TextBox> … </Window> ,[object Object]

Data Validation (4) <Window.Resources> <Style TargetType="{x:Type TextBox}"> <Setter Property="Validation.ErrorTemplate"> <Setter.Value> <ControlTemplate> <WrapPanel> <Border BorderBrush="Red"> <AdornedElementPlaceholder/> </Border> <TextBlock Foreground="Red">!</TextBlock> </WrapPanel> </ControlTemplate> </Setter.Value> </Setter> </Style> </Window.Resources> ,[object Object]

Binding Path Syntax ,[object Object],[object Object],[object Object],[object Object]

Binding Path Syntax (2) ,[object Object],[object Object],[object Object],[object Object],[object Object]

R elative S ources ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],<TextBox ... ToolTip="{Binding RelativeSource={RelativeSource Self}, Path=(Validation.Errors)[0].ErrorContent}">

U pdate S ource T riggers ,[object Object],[object Object],[object Object],<TextBox …> <TextBox.Text> <Binding Path="Age" UpdateSourceTrigger="PropertyChanged"> … </Binding> </TextBox.Text> </TextBox>

U pdate S ource T riggers ,[object Object],[object Object],[object Object],[object Object],[object Object]

Simple Data Binding ,[object Object],http://academy.telerik.com

Exercises ,[object Object],[object Object]

Exercises (2) ,[object Object],[object Object]

Simple Data Binding

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (20)

Ähnlich wie Simple Data Binding

Ähnlich wie Simple Data Binding (20)

Mehr von Doncho Minkov

Mehr von Doncho Minkov (20)

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

Simple Data Binding

Hinweis der Redaktion