I have usercontrol which has datagrid .This usercontrol is added to WPF main window.I am handling gridrow selection changed event through bubble event.
<ListBox x:Name="myListBox" Grid.Row="0"
ItemsSource="{Binding Path=_myControl}"
ScrollViewer.VerticalScrollBarVisibility="Auto"
SelectedItem="{Binding CurrentItem}" SelectedIndex="1">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<local:UCSearchEntity GridRowSelectionConfirmed="{Binding Path=UCSearchEntity_GridRowSelectionConfirmed}" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
public class MyViewModel:INotifyPropertyChanged
{
}
the error is Provide value on 'System.Windows.Data.Binding' threw an exception.
How can I access this usercontrol event in my mainwindow viewModel ?
You cannot do binding to events like that you have to do something like this on your mainwindow :
<Window DataGrid.GridRowSelectionConfirmed="GridRowSelectionConfirmed">
and GridRowSelectionConfirmed would be a method in your mainwindow
And the xaml above is a snippet in your xaml of the mainwindow.
If you want to stick to using MVVM then you have to start using behaviours but this is a more advanced concept. The behaviour is needed to attach a command that you can databind to an event that otherwise is not bindable like you were trying to do. You see I am making use of interactivity, if you want to do the same you need the blend sdk. An example :
public class AddingNewItemBehavior : Behavior<DataGrid>
{
public static readonly DependencyProperty CommandProperty
= DependencyProperty.Register("Command", typeof(ICommand), typeof(AddingNewItemBehavior), new PropertyMetadata());
public ICommand Command
{
get { return (ICommand)GetValue(CommandProperty); }
set { SetValue(CommandProperty, value); }
}
protected override void OnAttached()
{
AssociatedObject.AddingNewItem += AssociatedObject_OnAddingNewItem;
}
private void AssociatedObject_OnAddingNewItem(object sender, AddingNewItemEventArgs addingNewItemEventArgs)
{
AddingNewItem addingNewItem = new AddingNewItem();
Command.Execute(addingNewItem);
addingNewItemEventArgs.NewItem = addingNewItem.NewItem;
}
}
This is an adding new behaviour I have on a datagrid.
And this is a simplified example where i make use of that behaviour :
<UserControl x:Class="Interstone.Configuratie.Views.GraveerFiguurAdminUserControl"
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:i="http://schemas.microsoft.com/expression/2010/interactivity"
xmlns:iCeTechControlLibrary="clr-namespace:ICeTechControlLibrary;assembly=ICeTechControlLibrary"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<Grid>
<DataGrid ItemsSource="{Binding ZandstraalImageTypes.View}" AutoGenerateColumns="False"
VerticalGridLinesBrush="#FFC9CACA" HorizontalGridLinesBrush="#FFC9CACA" RowHeaderWidth="50"
>
<i:Interaction.Behaviors>
<iCeTechControlLibrary:AddingNewItemBehavior Command="{Binding AddingNewCommand}"/>
</i:Interaction.Behaviors>
<DataGrid.Columns>
<DataGridTextColumn Header="Categorie" Binding="{Binding TypeNaam}" Width="*"/>
</DataGrid.Columns>
</DataGrid>
</Grid>
Related
This is the scenario: In a UserControl there is TabControl, which loads different views, and a button. Like this image:
Scenario
Button "Save" only can be enabled if fields "Name" and "Owner" are not empty. These fields are in a child view loaded in ItemTab.
This is the XAML (only with 1 TabItem to simplify)
<UserControl
x:Class="Winvet.Desktop.Views.VCliente.DatosCliente"
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"
mc:Ignorable="d"
xmlns:viewModels="clr-namespace:Winvet.Desktop.ViewModels.VMCliente"
xmlns:views="clr-namespace:Winvet.Desktop.Views.VCliente">
<Grid Margin="10 5 10 10">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="7*"/>
<ColumnDefinition Width="3*"/>
</Grid.ColumnDefinitions>
<TabControl Grid.Column="0" Name="TabDatosCliente" ItemsSource="{Binding ItemsTabDatosCliente}" SelectedIndex="0">
<TabControl.Resources>
<DataTemplate DataType="{x:Type viewModels:DatosClienteGeneralViewModel}">
<views:DatosClienteGeneral/>
</DataTemplate>
</TabControl.Resources>
<TabControl.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Header}" />
</DataTemplate>
</TabControl.ItemTemplate>
</TabControl>
<StackPanel Grid.Column="1" Orientation="Horizontal">
<Button VerticalAlignment="Bottom" Command="{ I want to bind this }">Guardar</Button>
</StackPanel>
</Grid>
</UserControl>
And this is the ViewModel (only 1 TabItem to simplify)
using System.Collections.ObjectModel;
using Winvet.Desktop.Common;
namespace Winvet.Desktop.ViewModels.VMCliente
{
public class DatosClienteViewModel: ViewModelBase
{
public ObservableCollection<ViewModelBase> ItemsTabDatosCliente { get; private set; }
public DatosClienteViewModel()
{
ItemsTabDatosCliente = new ObservableCollection<ViewModelBase>
{
new DatosClienteGeneralViewModel()
};
}
}
}
I wan't to create a Command which checks if those two child view fields are not empty and enables button. How can I do it?
Routed commands burrow and bubble through the entire interface, so as long as you are in the same visual branch as the item raising the event, then you can handle it anywhere.
so in your VIEW
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
CommandBindings.Add(new CommandBinding(command, execute, canExecute));
}
private void canExecute(object sender, CanExecuteRoutedEventArgs e)
{
throw new NotImplementedException();
//at this point you can pass it to your ViewModel
}
private void execute(object sender, ExecutedRoutedEventArgs e)
{
throw new NotImplementedException();
//at this point you can pass it to your ViewModel
}
}
where command is the RoutedCommand that is set on your buttons Command Property
When trying to add a button as the datatemplate to a listbox, I ran into a stackoverflow. When using a textbox instead, there is no stackoverflow. What is causing this? I'm using Visual Studios 2012 Update 4.
XAML code:
<Window x:Class="StackOverflowTest.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:sys="clr-namespace:System;assembly=mscorlib">
<ListBox ItemsSource="{Binding CausesStackOverflow}">
<ListBox.Resources>
<DataTemplate DataType="{x:Type sys:String}">
<Button Content="{Binding Path=.}"/>
</DataTemplate>
</ListBox.Resources>
</ListBox>
</Window>
C# code:
namespace StackOverflowTest
{
public partial class MainWindow
{
public string[] CausesStackOverflow { get; set; }
public MainWindow()
{
CausesStackOverflow = new string[] { "Foo" };
InitializeComponent();
DataContext = this;
}
}
}
Button is a ContentControl, which also uses a DataTemplate for its Content. A default DataTemplate ends up in recursively creating Buttons to display the "outer" Button's Content.
You should set the ListBox's ItemTemplate explicitly:
<ListBox ItemsSource="{Binding CausesStackOverflow}">
<ListBox.ItemTemplate>
<DataTemplate>
<Button Content="{Binding}"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I have recently started with XAML and WPF. I just created a new project in wpf and add the below XAML code. But...none of the items which are added inside "Listbox.ItemTemplate" or "ListView.ItemTemplate" for that matter show up in designer window. what am i doing wrong? This is a fresh project and so no code-behind stuff added yet. i scratched my head for 15 mins with this but with no success. Please help
<Window x:Class="WpfApplication3.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid Margin="10">
<ListBox Margin="10">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Name: " />
<TextBlock Text="Age: " />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</Window>
You should bind your ListBox or entire Window to some DataContext (usually this is viewmodel with the data you need to display) or specify items of the list explicitly.
In your snippet you specified only an item template, not the items itself.
The example of XAML-defined items (simple strings):
<Window x:Class="WpfApplication3.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid Margin="10">
<ListBox Margin="10">
<ListBox.Items>
<ListBoxItem>123</ListBoxItem>
<ListBoxItem>456</ListBoxItem>
</ListBox.Items>
</ListBox>
</Grid>
</Window>
The example with DataContext and Bindings.
XAML:
<Window x:Class="WpfApplication3.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid Margin="10">
<ListBox Margin="10" ItemsSource="{Binding Path=Persons}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Label>Name:</Label><TextBlock VerticalAlignment="Center" Text="{Binding Path=Name}" />
<Label>Age:</Label><TextBlock VerticalAlignment="Center" Text="{Binding Path=Age}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</Window>
Codebehind:
namespace WpfApplication3
{
public class PersonViewModel
{
public PersonViewModel(string name, int age)
{
this.name = name;
this.age = age;
}
public string Name
{
get { return name; }
}
private string name;
public int Age
{
get { return age; }
}
private int age;
}
public class MainViewModel
{
public MainViewModel()
{
persons = new ObservableCollection<PersonViewModel>()
{
new PersonViewModel("Lez", 146),
new PersonViewModel("Binja", 158),
new PersonViewModel("Rufus the Destroyer", 9000)
};
}
public ObservableCollection<PersonViewModel> Persons
{
get { return persons; }
}
private ObservableCollection<PersonViewModel> persons;
}
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
this.DataContext = new MainViewModel();
}
}
}
IMPORTANT: Don't forget to properly implement INotifyPropertyChanged in case of mutable properties of viewmodels (for example, if you will have setters for "Name" and "Age" properties of PersonViewModel).
You don't see any items because your ListBox doesn't contain any data in the designer view. To populate it, a list should be binded to the property "ItemsSource" of your ListBox, or adding datas directly to the property "Items" (XAML or code behind).
If you want to show items in the designer view properly, you should have a ViewModel binding to the DataContext of your page and create a "Sample data" file (via Blend for example).
Item Templates are basically used to show customize data. Just Use simple string items first. It will show in list box.
My Custom UserControl's dependency property will bind correctly if the value is statically defined in the XAML calling it, like this:
TextBoxText="myName"
but not if the value is bound dynamically itself:
TextBoxText="{Binding ItemTypeIdCode}"
There is my full Code.
Custom UserControl XAML:
<UserControl
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"
mc:Ignorable="d"
x:Class="TestUserControl.UserControl1"
DataContext="{Binding RelativeSource={RelativeSource Self}}"
x:Name="UserControl" Height="22" Width="282">
<Grid x:Name="LayoutRoot">
<TextBlock TextWrapping="Wrap" Text="{Binding MyName, ElementName=LayoutRoot}"/>
</Grid>
Custom UserControl Code:
public static readonly DependencyProperty TextBoxTextProperty =DependencyProperty.Register("TextBoxText", typeof(string), typeof(UserControl1));
public string TextBoxText
{
get { return (string)GetValue(TextBoxTextProperty); }
set { SetValue(TextBoxTextProperty, value); }
}
In my Main Window XAML :
<Grid x:Name="LayoutRoot">
<Button Content="Button" Height="78" Margin="0,0,93,112" VerticalAlignment="Bottom" HorizontalAlignment="Right" Width="94" Click="MyButtonClick"/>
<ListBox x:Name="MyListBox" HorizontalAlignment="Left" Margin="8,8,0,112" Width="192">
<ListBox.ItemTemplate>
<DataTemplate>
<local:UserControl1 HorizontalAlignment="Stretch" Margin="286,37,56,0" VerticalAlignment="Top" d:LayoutOverrides="Height" TextBoxText="{Binding MyName}"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
In my Main Window Code :
private void MyButtonClick(object sender, System.Windows.RoutedEventArgs e)
{
List<string> MyName = new List<string>();
MyName.Add("Name 1");
MyName.Add("Name 2");
MyName.Add("Name 3");
MyListBox.ItemsSource = MyName;
}
This Code Successfully add my Custom UserControl as ListBoxItem in ListBox But Problem it is not display any text which i Binding.
I don`t understand where i am doing wrong.
You set the DataContext of the UserControl to itself, all bindings will then try to find the path on the UserControl, that is why you should not set the DataContext on UserControls.
You should see a binding error in the Output window of Visual Studio saying something like:
System.Windows.Data Error: 40 : BindingExpression path error: 'ItemTypeIdCode' property not found on 'object' ''UserControl1' (Name='UserControl')'. ...
I'm building a simple UserControl, DoubleDatePicker, which defines a DependencyProperty, SelectedDate :
DoubleDatePicker.xaml :
<UserControl x:Class="TestWpfDoubleDatePicker.DoubleDatePicker"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:toolkit="http://schemas.microsoft.com/wpf/2008/toolkit">
<StackPanel x:Name="LayoutRoot" Background="White">
<toolkit:DatePicker x:Name="DateInput" SelectedDate="{Binding SelectedDate,Mode=TwoWay}" Margin="5,0,5,0" />
<TextBlock Text="{Binding SelectedDate}" />
<toolkit:DatePicker SelectedDate="{Binding SelectedDate,Mode=TwoWay}" Margin="5,0,5,0" />
</StackPanel>
DoubleDatePicker.xaml.cs :
using System;
using System.Windows;
using System.Windows.Controls;
namespace TestWpfDoubleDatePicker
{
public partial class DoubleDatePicker : UserControl
{
public static readonly DependencyProperty SelectedDateProperty =
DependencyProperty.Register("SelectedDate", typeof(DateTime), typeof(DoubleDatePicker), null);
public DateTime SelectedDate
{
get { return (DateTime)this.GetValue(SelectedDateProperty); }
set { this.SetValue(SelectedDateProperty, value); }
}
public DoubleDatePicker()
{
this.InitializeComponent();
this.DataContext = this;
}
}
}
I'd like to be able to bind the SelectedDate property from the outside but things do not seem so simple.
Here is a sample code that is trying to get the value of the property in a TextBlock :
MainWindow.xaml :
<Window x:Class="TestWpfDoubleDatePicker.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:TestWpfDoubleDatePicker"
Title="MainWindow" Height="350" Width="525">
<StackPanel x:Name="LayoutRoot" Background="White">
<local:DoubleDatePicker x:Name="ddp" SelectedDate="{Binding SelectedDate}" />
<Button Content="Update" Click="Button_Click" />
<TextBlock Text="{Binding SelectedDate}" />
</StackPanel>
and MainWindow.xaml.cs :
using System;
using System.Windows;
namespace TestWpfDoubleDatePicker
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public static readonly DependencyProperty SelectedDateProperty =
DependencyProperty.Register("SelectedDate", typeof(DateTime), typeof(MainWindow), null);
public DateTime SelectedDate
{
get { return (DateTime)this.GetValue(SelectedDateProperty); }
set { this.SetValue(SelectedDateProperty, value); }
}
public MainWindow()
{
InitializeComponent();
this.DataContext = this;
}
private void Button_Click(object sender, RoutedEventArgs e)
{
this.SelectedDate = this.ddp.SelectedDate;
}
}
}
Inside the DoubleDatePicker itself all is working fine : the SelectedDate property is updated when changed by using any of the two DatePicker, and the TextBlock of the DoubleDatePicker is updated as expected.
But, outside, the TextBlock of the MainWindow is not updated automatically and the only way to get the SelectedDate property of the DoubleDatePicker is to get it explicitly, like it's done when clicking the Button.
What am I doing wrong ?
I'm using Visual Studio Professional 2010 with WPF 4.
Thanks in advance for you help.
What you are doing wrong is overwriting your DataContext inside your control with this:
this.DataContext = this;
Now your DatePicker no longer binds to your intended object, but in stead binds to your DatePicker instance. I guess this is not how you intended your DatePicker to work ;).
So, remove that line in your DatePicker, and if you do need to bind inside the XAML of your DatePicker use ElementName or RelativeSource bindings to bind to this dependency property.
Hope this clarifies things ;)
I took the liberty of rewriting your bindings inside your XAML of your DatePicker using ElementName bindings:
<UserControl x:Class="TestWpfDoubleDatePicker.DoubleDatePicker"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:toolkit="http://schemas.microsoft.com/wpf/2008/toolkit"
x:Name="Root">
<StackPanel x:Name="LayoutRoot" Background="White">
<toolkit:DatePicker x:Name="DateInput" SelectedDate="{Binding ElementName=Root, Path=SelectedDate,Mode=TwoWay}" Margin="5,0,5,0" />
<TextBlock Text="{Binding ElementName=Root, Path=SelectedDate}" />
<toolkit:DatePicker SelectedDate="{Binding ElementName=Root, Path=SelectedDate,Mode=TwoWay}" Margin="5,0,5,0" />
</StackPanel>