如何使用WPF和MVVM技术绑定textchanged事件上的数据？ [英] How to bind data on textchanged event using WPF and MVVM techniques?
本文介绍了如何使用WPF和MVVM技术绑定textchanged事件上的数据？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
你好先生，
i有5个文本框......
4用于输入输入值，第5个用于存储结果。
i used textchange事件和我在视图中实现的那些事件（.cs文件）..
但我想在view_model文件中实现相同的...
如何做同样的事情使用wpf和mvvm技术..
我尝试过：
hello sir,
i have 5 textbox ....
4 for entering input value and 5th one for storing result.
i used textchange event and those event i implemented in view(.cs file)..
but i want to implement same in view_model file...
how to to do the same using wpf and mvvm technique..
What I have tried:
<UserControl x:Class="task2.Views.calc"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:task2.Views"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto"></RowDefinition>
<RowDefinition Height="auto"></RowDefinition>
<RowDefinition Height="auto"></RowDefinition>
<RowDefinition Height="auto"></RowDefinition>
<RowDefinition Height="auto"></RowDefinition>
<RowDefinition Height="auto"></RowDefinition>
<RowDefinition Height="auto"></RowDefinition>
<RowDefinition Height="auto"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100"></ColumnDefinition>
<ColumnDefinition Width="150"></ColumnDefinition>
<ColumnDefinition Width="100"></ColumnDefinition>
<ColumnDefinition Width="150"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Label x:Name="lblItem" Content="Materials" Grid.Row="0" Grid.Column="0" VerticalAlignment="Top"></Label>
<Label x:Name="lblPrice" Content="Price" Grid.Row="0" Grid.Column="1" VerticalAlignment="Top"></Label>
<Label x:Name="lblOil" Content="Oil" Grid.Row="1" Grid.Column="0" VerticalAlignment="Top"></Label>
<TextBox x:Name="txtOil" Grid.Row="1" Grid.Column="1" VerticalAlignment="Top" TextChanged="txt1_TextChanged" >
</TextBox>
<Label x:Name="lblRice" Content="Rice" Grid.Row="2" Grid.Column="0" VerticalAlignment="Top"></Label>
<TextBox x:Name="txtRice" Grid.Row="2" Grid.Column="1" VerticalAlignment="Top" TextChanged="txt2_TextChanged">
</TextBox>
<Label x:Name="lblCoconut" Content="Cocunut" Grid.Row="3" Grid.Column="0" VerticalAlignment="Top"></Label>
<TextBox x:Name="txtCoconut" Grid.Row="3" Grid.Column="1" VerticalAlignment="Top" TextChanged="txt3_TextChanged" >
</TextBox>
<Label x:Name="lblDal" Content="Dal" Grid.Row="4" Grid.Column="0" VerticalAlignment="Top"></Label>
<TextBox x:Name="txtDal" Grid.Row="4" Grid.Column="1" VerticalAlignment="Top" TextChanged="txt4_TextChanged">
</TextBox>
<Label x:Name="lblTotal" Content="Total" Grid.Row="5" Grid.Column="0" VerticalAlignment="Top"></Label>
<TextBox x:Name="txtTotal" Grid.Row="5" Grid.Column="1" VerticalAlignment="Top" >
</TextBox>
<Label x:Name="lbltax" Content="Tax" Grid.Row="6" Grid.Column="0" VerticalAlignment="Top"></Label>
<TextBox x:Name="txttax" Grid.Row="6" Grid.Column="1" VerticalAlignment="Top" >
</TextBox>
<Label x:Name="lblvat" Content="gst" Grid.Row="7" Grid.Column="0" VerticalAlignment="Top"></Label>
<TextBox x:Name="txtvat" Grid.Row="7" Grid.Column="1" VerticalAlignment="Top" >
</TextBox>
</Grid>
<!--<Button x:Name="btnUpdate" Width="100" Height="20" HorizontalAlignment="Center" Grid.Row="1" Content="Update"
Command="{Binding Path=UpdateCommand}" ></Button>
<ListView x:Name="lstPerson" Grid.Row="2" ItemsSource="{Binding Persons}">
<ListView.View>
<GridView>
<GridViewColumn Header="Materials" DisplayMemberBinding="{Binding Name}" />
<GridViewColumn Header="Price" Width="200" DisplayMemberBinding="{Binding Address}"/>
</GridView>
</ListView.View>
</ListView>-->
</Grid>
</UserControl>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace task2.Views
{
/// <summary>
/// Interaction logic for calc.xaml
///
public partial class calc : UserControl
{
public calc()
{
InitializeComponent();
}
protected void txt1_TextChanged(object sender, EventArgs e)
{
if ((!string.IsNullOrEmpty(txtOil.Text)) && (!string.IsNullOrEmpty(txtRice.Text)) && (!string.IsNullOrEmpty(txtCoconut.Text)) && (!string.IsNullOrEmpty(txtDal.Text)))
{
txtTotal.Text = (Convert.ToInt32(txtOil.Text) + Convert.ToInt32(txtRice.Text) + Convert.ToInt32(txtCoconut.Text) + Convert.ToInt32(txtDal.Text)).ToString();
}
CalculateTax();
}
protected void txt2_TextChanged(object sender, EventArgs e)
{
if ((!string.IsNullOrEmpty(txtOil.Text)) && (!string.IsNullOrEmpty(txtRice.Text)&& (!string.IsNullOrEmpty(txtCoconut.Text))&& (!string.IsNullOrEmpty(txtDal.Text))))
{
txtTotal.Text = (Convert.ToInt32(txtOil.Text) + Convert.ToInt32(txtRice.Text) + Convert.ToInt32(txtCoconut.Text) + Convert.ToInt32(txtDal.Text)).ToString();
}
CalculateTax();
}
protected void txt3_TextChanged(object sender, EventArgs e)
{
if ((!string.IsNullOrEmpty(txtOil.Text)) && (!string.IsNullOrEmpty(txtRice.Text)) && (!string.IsNullOrEmpty(txtCoconut.Text)) && (!string.IsNullOrEmpty(txtDal.Text)))
{
txtTotal.Text = (Convert.ToInt32(txtOil.Text) + Convert.ToInt32(txtRice.Text) + Convert.ToInt32(txtCoconut.Text) + Convert.ToInt32(txtDal.Text)).ToString();
}
CalculateTax();
}
protected void txt4_TextChanged(object sender, EventArgs e)
{
if ((!string.IsNullOrEmpty(txtOil.Text)) && (!string.IsNullOrEmpty(txtRice.Text)) && (!string.IsNullOrEmpty(txtCoconut.Text)) && (!string.IsNullOrEmpty(txtDal.Text)))
{
txtTotal.Text = (Convert.ToInt32(txtOil.Text) + Convert.ToInt32(txtRice.Text) + Convert.ToInt32(txtCoconut.Text) + Convert.ToInt32(txtDal.Text)).ToString();
}
CalculateTax();
}
public void CalculateTax()
{
if ((!string.IsNullOrEmpty(txtTotal.Text)))
{
int Amount = Convert.ToInt32(txtTotal.Text);
txtvat.Text = (((Amount * 12) / 100) + Amount).ToString();
if (Amount > 2000)
{
txttax.Text = "20";
}
else if (Amount > 1000)
{
txttax.Text = "10";
}
else
{
txttax.Text = "5";
}
}
}
public bool IsValid()
{
int Amount = Convert.ToInt32(txtTotal.Text);
if (Amount == 0)
{
return false;
}
else
{
return true;
}
}
}
}
推荐答案
以下是一个示例...
Here is an example of how...
<Window x:Class="WpfCalc.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:WpfCalc"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Window.DataContext>
<local:CalcViewModel/>
</Window.DataContext>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="150"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="150"/>
</Grid.ColumnDefinitions>
<Label x:Name="lblItem" Content="Materials" Grid.Row="0" Grid.Column="0" VerticalAlignment="Top"></Label>
<Label x:Name="lblPrice" Content="Price" Grid.Row="0" Grid.Column="1" VerticalAlignment="Top"></Label>
<Label x:Name="lblOil" Content="Oil" Grid.Row="1" Grid.Column="0" VerticalAlignment="Top"></Label>
<TextBox x:Name="txtOil" Grid.Row="1" Grid.Column="1" VerticalAlignment="Top"
Text="{Binding Oil, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
<Label x:Name="lblRice" Content="Rice" Grid.Row="2" Grid.Column="0" VerticalAlignment="Top"></Label>
<TextBox x:Name="txtRice" Grid.Row="2" Grid.Column="1" VerticalAlignment="Top"
Text="{Binding Rice, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
<Label x:Name="lblCoconut" Content="Cocunut" Grid.Row="3" Grid.Column="0" VerticalAlignment="Top"></Label>
<TextBox x:Name="txtCoconut" Grid.Row="3" Grid.Column="1" VerticalAlignment="Top"
Text="{Binding Coconut, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
</Grid>
</Window>
and the ViewModel:
and the ViewModel:
using System.ComponentModel;
namespace WpfCalc
{
public class CalcViewModel : INotifyPropertyChanged
{
public CalcViewModel()
{
Oil = 123.456F;
Rice = 222.222F;
Coconut = 333.333F;
}
private float oil;
public float Oil
{
get { return oil; }
set
{
if (oil != value)
{
oil = value;
NotifyPropertyChanged(nameof(Oil));
}
}
}
private float rice;
public float Rice
{
get { return rice; }
set
{
if (rice != value)
{
rice = value;
NotifyPropertyChanged(nameof(Rice));
}
}
}
private float coconut;
public float Coconut
{
get { return coconut; }
set
{
if (coconut != value)
{
coconut = value;
NotifyPropertyChanged(nameof(Coconut));
}
}
}
#region INotifyPropertyChanged
public event PropertyChangedEventHandler PropertyChanged;
public void NotifyPropertyChanged(string propertyName)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
#endregion
}
}
Also, check out MVVM Light Toolkit - Nuget[^]
这篇关于如何使用WPF和MVVM技术绑定textchanged事件上的数据？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
