Using Xceed DataGrid for WPF
How can you use generated sample data source (generated in Expression Blend) as the source for DataGridCollectionViewSource? Is it possible?
<xcdg:DataGridCollectionViewSource x:Key="cvsSample"
Source="{Binding Source={x:Static Application.Current},Path=SampleDataSource}"/>
Doing this throw an error:
A value of type 'DataGridCollectionViewSource' cannot be added to a collection or dictionary of type 'UIElementCollection'.
I can set it directly in the DataGridControl like so:
<xcdg:DataGridControl ItemTemplate="{DynamicResource ItemTemplate}"
ItemsSource="{Binding Collection, Source={StaticResource SampleDataSource}}"
UpdateSourceTrigger="CellContentChanged"
Margin="10">
</xcdg:DataGridControl>
But I want to use the DataGridCollectionViewSource as it allows you to use the filtering, grouping etc. functionality.
Try this:
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:xcdg="http://schemas.xceed.com/wpf/xaml/datagrid"
xmlns:local="clr-namespace:WpfApp1"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<xcdg:DataGridCollectionViewSource x:Key="cvsSample" Source="{Binding}" />
</Window.Resources>
<Grid>
<xcdg:DataGridControl ItemsSource="{Binding Source={StaticResource cvsSample}}"/>
</Grid>
</Window>
CS:
using Xceed.Wpf.Samples.SampleData;
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
DataContext = SampleDataProvider.GetProducts();
}
}
Look at jstreet's answer, but if that doesnt work for you, you can try doing what I did.
In Visual Studio go to Project > Add Reference > Extensions and add Xceed.Wpf.DataGrid.Samples.SampleData (remember to check the little box next to it).
App.xaml.cs
public partial class App : System.Windows.Application
{
protected override void OnStartup(StartupEventArgs e)
{
Xceed.Wpf.DataGrid.Licenser.LicenseKey = "XXXXX-XXXXX-XXXXX-XXXX";
DataSet musicDataSet = Xceed.Wpf.DataGrid.Samples.SampleData.DataProvider.GetMusicLibraryDataSet();
m_songs = musicDataSet.Tables["Songs"];
base.OnStartup(e);
}
private DataTable m_songs;
public DataTable Songs
{
get
{
return m_songs;
}
}
}
MainWindow.xaml
<Window.Resources>
<xcdg:DataGridCollectionViewSource x:Key="cvsSongs"
Source="{Binding Source={x:Static Application.Current},Path=Songs}">
</xcdg:DataGridCollectionViewSource>
</Window.Resources>
<Grid>
<xcdg:DataGridControl ItemsSource="{Binding Source={StaticResource cvsSongs}}"/>
</Grid>
Can't believe I struggled this much just to have missed a reference...
Related
I'm trying to wrap my head around ReactiveUI. Most of it makes some degree of sense if you don't look at it too closely, but when I try to set up a TabControl everything explodes in my face.
I have a TabControl on my Window. I want to be able to add multiple different types of tabs to it dynamically at runtime based on different user actions. This answer explains a standard WPF way to do that, and it almost works, but since it's not ReactiveUI, anytime I try to open a tab with a Reactive view on it, everything blows up because the ViewModel dependency property hasn't been bound.
XAML:
<Window.Resources>
<DataTemplate DataType="{x:Type vm:MyTabViewModel}">
<views:MyTabEditor/>
</DataTemplate>
</Window.Resources>
...
<TabControl Name="Multitab" Grid.Column="2" ItemsSource="{Binding Tabs}">
<TabControl.ItemContainerStyle>
<Style TargetType="{x:Type TabItem}">
<Setter Property="Header" Value="{Binding Name}" />
</Style>
</TabControl.ItemContainerStyle>
</TabControl>
ViewModel:
public ObservableCollection<ITabPage> Tabs { get; } = new();
public void AddNewTab()
{
var vm = new MyTabEditorViewModel();
Tabs.Add(vm);
}
XAML.cs
private void NewTab_Executed(object sender, ExecutedRoutedEventArgs e)
{
ViewModel.AddNewJob();
Multitab.SelectedIndex = Multitab.Items.Count - 1;
var last = Multitab.SelectedIndex;
this.OneWayBind(ViewModel, vm => vm.Tabs[last], v => GAH WHAT GOES HERE?!?);
}
And this is the part where I get lost. How do I set up the bindings to bind the new VM to the view that gets created for it? Multitab.SelectedItem returns the VM, not the View, and I can't seem to find any way to obtain the newly-created View object in order to bind it.
Does anyone know how to set this up properly?
Please refer to the below sample code.
Window1.xaml:
<reactiveui:ReactiveWindow x:Class="WpfApp1.Window1"
x:TypeArguments="local:ViewModel"
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"
xmlns:reactiveui="http://reactiveui.net"
mc:Ignorable="d"
Title="Window1" Height="450" Width="800">
<Grid>
<TabControl Name="Multitab">
<TabControl.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}" />
</DataTemplate>
</TabControl.ItemTemplate>
<TabControl.ContentTemplate>
<DataTemplate>
<reactiveui:ViewModelViewHost ViewModel="{Binding}" />
</DataTemplate>
</TabControl.ContentTemplate>
</TabControl>
</Grid>
</reactiveui:ReactiveWindow>
Window.xaml.cs:
public partial class Window1 : ReactiveWindow<ViewModel>
{
public Window1()
{
InitializeComponent();
ViewModel = new ViewModel();
this.WhenActivated(disposableRegistration =>
{
this.OneWayBind(ViewModel,
viewModel => viewModel.Tabs,
view => view.Multitab.ItemsSource)
.DisposeWith(disposableRegistration);
});
}
}
View Model:
public class ViewModel
{
public ObservableCollection<ITabPage> Tabs { get; } =
new ObservableCollection<ITabPage>() { new MyTabEditorViewModel() };
}
Tab View Model:
public interface ITabPage { }
public class MyTabEditorViewModel : ITabPage
{
public string Name { get; } = "Name...";
}
TabView.xaml:
<reactiveui:ReactiveUserControl x:Class="WpfApp1.TabEditorView"
x:TypeArguments="local:MyTabEditorViewModel"
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:reactiveui="http://reactiveui.net"
xmlns:local="clr-namespace:WpfApp1"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
<Grid>
<TextBlock>Tab content...</TextBlock>
</Grid>
</reactiveui:ReactiveUserControl>
TabView.xaml.cs:
public partial class TabEditorView : ReactiveUserControl<MyTabEditorViewModel>
{
public TabEditorView()
{
InitializeComponent();
}
}
I need to extend a ListBox with a custom ItemTemplate but when I run my code the ItemTemplate does not get applied?
<ListBox x:Class="ExtendedCheckedListbox"
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:ExtListBoxPOC"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
<ListBox.ItemTemplate>
<DataTemplate>
<CheckBox Content="{Binding Description}" VerticalAlignment="Stretch" VerticalContentAlignment="Center" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
private YesNoModel YesNo = new YesNoModel();
{
DataContext = YesNo;
cbl.ItemsSource = YesNo;
}
My main Window XAML which uses the control called cbl which has the ItemsSource set in code behind:
<Window x:Class="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:ExtListBoxPOC"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<local:ExtendedCheckedListbox x:Name="cbl" HorizontalAlignment="Left" Height="300" Margin="10" VerticalAlignment="Top" Width="300"/>
</Grid>
</Window>
The Model class is this:
public class YesNoModel
{
public string Description { get; set; }
public int Value { get; set; }
}
And I am adding items here:
{
YesNo.Add(new YesNoModel() { Description = "Yes", Value = 1 });
YesNo.Add(new YesNoModel() { Description = "No", Value = 2 });
YesNo.Add(new YesNoModel() { Description = "N/A", Value = 3 });
}
Code behind the ExtendedCheckedListbox View:
public class ExtendedCheckedListbox : ListBox
{
}
Your derived ListBox simply ignores the XAML, because you did apparently not call InitializeComponent() anywhere.
However, the usual way to derive from a control is to create a default Style in Themes\Generic.xaml. Add a "custom control" to your Visual Studio project and modify it like this:
public class ExtendedCheckedListBox : ListBox
{
static ExtendedCheckedListBox()
{
DefaultStyleKeyProperty.OverrideMetadata(
typeof(ExtendedCheckedListBox),
new FrameworkPropertyMetadata(typeof(ExtendedCheckedListBox)));
}
}
Then change the content of the generated Themes\Generic.xaml file to this:
<Style TargetType="local:ExtendedCheckedListBox">
<Setter Property="ItemTemplate">
<Setter.Value>
<DataTemplate>
<CheckBox Content="{Binding Description}"/>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
See Control Authoring Overview for details.
Code-Behind :
public class TestVariableClass
{
List<string> States;
public TestVariableClass()
{
States = new List<string> { "MP", "CG"};
}
}
XAML:
<Window x:Class="TestApplication.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:TestApplication"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<local:TestVariableClass x:Key="StatesInIt"/>
</Window.Resources>
<Grid>
<StackPanel Orientation="Horizontal" VerticalAlignment="Top" DataContext="{StaticResource StatesInIt}">
<Label>States</Label>
<ComboBox Width="140" Margin="5" x:Name="comboBoxStates" ItemsSource="{Binding States}"></ComboBox>
</StackPanel>
</Grid>
I simply dont see my comboBox field getting populated when I run the application. Is my way of data binding correct ?
I was trying to connect this comboBox with my database column. But after trying out few things I realised the error was in the binding itself.
What you are binding to in your model class needs to be a public property of the class:
private List<string> _states;
public List<string> States { get { return _states; } }
As a note, you won't be able to modify the collection of States and have it update automatically in the view. For that, you could use an ObservableCollection instead of a List. You may not need that functionality though.
I have a GridView and need to set width elements to Stretch as it's content, for now my Gridview looks like this image
I want something like this:
I think something like change ItemsTemplate to an StackPanel, but some samples found on the web are not enough clear for me.
How can I do to change The ItemsTemplate to get the behavior I want?
or
There is another XAML control that allow me to get this behavior?
Note: I'm using VS 2015, performing a UWP app.
check out this:
<Window x:Class="WpfApplication1.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:WpfApplication1"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525" Loaded="Window_Loaded">
<Window.Resources>
<DataTemplate x:Key="myTemplate">
<StackPanel>
<TextBlock Text="{Binding}"></TextBlock>
</StackPanel>
</DataTemplate>
</Window.Resources>
<ItemsControl ItemTemplate="{StaticResource myTemplate}" ItemsSource="{Binding List}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</Window>
In code behind I have this to simulate:
using System.Collections.Generic;
using System.Windows;
namespace WpfApplication1
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
this.List = new List<string> { "Quien", "vie", "ne", "en", "su", "nom", "bre" };
InitializeComponent();
this.DataContext = this;
}
public List<string> List { get; set; }
private void Window_Loaded(object sender, RoutedEventArgs e)
{
}
}
}
I need to put all colors from class Colors to combobox, but without Transparent. I know how it made, but it is additionally condition - I have to do all using binding.
I have:
<Window.Resources>
<ObjectDataProvider ObjectInstance="{x:Type Colors}" MethodName="GetProperties" x:Key="colorPropertiesOdp" />
</Window.Resources>
<ComboBox ItemsSource="{Binding Source={StaticResource colorPropertiesOdp}}" DisplayMemberPath="Name" SelectedValuePath="Name"/>
and it provide all colors. But I don't know how I can delete Transparent.
Thanks for help!
I can't think of a pure XAML solution to this problem. Even a CollectionViewSource with a filter will require a function in either the codebehind or the viewmodel depending on your approach. So, you can save some code on both ends and just filter the list on the backend before its attached to the combobox. For the sake of simplicity the code below uses the window's codebehind instead of a viewmodel.
On the backend:
public static IEnumerable<String> ColorsWithoutTransparent
{
get
{
var colors = typeof (Colors);
return colors.GetProperties().Select(x => x.Name).Where(x => !x.Equals("Transparent"));
}
}
Modified XAML (Take note of the added Window DataContext):
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
DataContext="{Binding RelativeSource={RelativeSource Self}}"
Title="MainWindow" Height="350" Width="525">
<Grid>
<ComboBox Margin="50" ItemsSource="{Binding ColorsWithoutTransparent}"/>
</Grid>
You can assign this to a CollectionViewSource and Filter the transparent.
<Window.Resources>
<ObjectDataProvider ObjectInstance="{x:Type Colors}" MethodName="GetProperties" x:Key="colorPropertiesOdp" />
<CollectionViewSource x:Key="FilterCollectionView" Filter="CollectionViewSource_Filter" Source="{StaticResource colorPropertiesOdp}" />
</Window.Resources>
<ComboBox ItemsSource="{Binding Source={StaticResource FilterCollectionView}}" DisplayMemberPath="Name" SelectedValuePath="Name"/>
public partial class Window1 : Window
{
public Window1()
{
InitializeComponent();
}
private void CollectionViewSource_Filter(object sender, FilterEventArgs e)
{
System.Reflection.PropertyInfo pi = (System.Reflection.PropertyInfo)e.Item;
if (pi.Name == "Transparent")
{
e.Accepted = false;
}
else
{
e.Accepted = true;
}
}
}