I've been googling this without getting the issue of that:
Simple xaml:
<Window x:Class="WpfHeightBinding.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:wpfHeightBinding="clr-namespace:WpfHeightBinding"
Title="MainWindow"
Width="{Binding Width}"
Height="{Binding Height}"
SizeToContent="Manual"
>
<Window.DataContext>
<wpfHeightBinding:TheDataContext />
</Window.DataContext>
<Grid>
</Grid>
</Window>
I bind both Width and Height to the data context. Here's the cs code
using System.Windows;
namespace WpfHeightBinding
{
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
}
public class TheDataContext
{
public int Width
{
get { return 200; }
}
public int Height
{
get { return 400; }
}
}
}
I set breakpoints to both getters. Only the first one is fetched, Height is ignored. If I switch Height and Width in xaml, then only the Height is fetched and Width is ignored.
I really cannot explain this behaviour. The window's height seems to be arbitrary. I have no MinHeight, nothing else influencing it, what happens to the binding? There is no error. SizeToContent has no effect.
I would understand if none of them are used as they might have been fetched before DataContext has been initialized but the DataContext is queried.
You need to give your 'Width' and 'Height' properties setters in code-behind - and then make your bindings 'TwoWay':
XAML
<Window x:Class="WpfHeightBinding.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:wpfHeightBinding="clr-namespace:WpfHeightBinding"
Title="MainWindow"
Width="{Binding Width, Mode=TwoWay}"
Height="{Binding Height, Mode=TwoWay}"
SizeToContent="Manual"
>
<Window.DataContext>
<wpfHeightBinding:TheDataContext />
</Window.DataContext>
Code-behind:
public class TheDataContext
{
public int Width { get { return 800; } set { } }
public int Height { get { return 200; } set { } }
}
Related
I have a PlotView that has the height binds to the property ModelHeight in the view model.
MainWindow.xaml
<oxy:PlotView x:Name="IOPlot" Model="{Binding IOPlotModel}" Height="{Binding ModelHeight, UpdateSourceTrigger=PropertyChanged}" Width="630">
ViewModel.cs
private double modelheight = 300;
public double ModelHeight {
get{return modelheight;}
set { modelheight = value;
RaisePropertyChanged("ModelHeight");
RaisePropertyChanged("IOPlotModel");
this.IOPlotModel.InvalidatePlot(false);
}
}
The problem is that: it doesn't update the height with the data binding! The height only changes once during the startup of the PlotModel. It seems like the height is fixed (IOPlotModel.Height always equals 300 even though ModelHeight changed).
Does anyone know how to fix this issue?
In this minimal example view and view model are the same class MainWindow, so the DataContext is set to this inside the constructor. Usually it should be the view model in a MVVM architecture.
XAML:
<Window x:Class="PlotTest.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:oxyplot="http://oxyplot.org/wpf"
mc:Ignorable="d"
Title="MainWindow"
Height="450"
Width="800">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="30" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<TextBox x:Name="HeightTextBox"
Width="200"
TextChanged="HeightTextBox_TextChanged" />
<oxyplot:PlotView Grid.Row="1"
Model="{Binding MyModel, UpdateSourceTrigger=PropertyChanged}"
Height="{Binding ModelHeight, UpdateSourceTrigger=PropertyChanged}" />
</Grid>
</Window>
Code behind:
using OxyPlot;
using System.ComponentModel;
using System.Windows;
namespace PlotTest
{
public partial class MainWindow : Window, INotifyPropertyChanged
{
private double modelheight = 300;
public MainWindow()
{
this.DataContext = this;
this.MyModel = new PlotModel() { Background = OxyColors.AliceBlue };
InitializeComponent();
}
public event PropertyChangedEventHandler PropertyChanged;
public double ModelHeight
{
get { return modelheight; }
private set
{
modelheight = value;
this.RaisePropertyChanged("ModelHeight");
}
}
public PlotModel MyModel { get; private set; }
private void HeightTextBox_TextChanged(object sender, System.Windows.Controls.TextChangedEventArgs e)
{
if (double.TryParse(this.HeightTextBox.Text, out double height))
{
this.ModelHeight = height;
}
}
private void RaisePropertyChanged(string propertyName = "")
{
this.PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
}
Hi i am trying to display usercontrol Dynamically But it is not working ...please help me to improve code .
In cunstructor of MainWindowViewModel i tried to set initial property of contentcontrol.
Thank you in advance
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:VM="clr-namespace:WpfApplication1.ViewModel"
xmlns:View="clr-namespace:WpfApplication1.View"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<DataTemplate DataType="{x:Type VM:FirstControlViewModel}">
<View:FirstControl></View:FirstControl>
</DataTemplate>
<DataTemplate DataType="{x:Type VM:SecondControlViewModel}">
<View:SecondControl></View:SecondControl>
</DataTemplate>
</Window.Resources>
<Grid>
<ContentControl Content="{Binding LoadedControl}" />
</Grid>
</Window>
View Model Code :-
public class MainViewModel: INotifyPropertyChanged
{
public MainViewModel()
{
LoadedControl = "FirstControlViewModel";// here i am setting property
//But not working
}
private string _LoadedControl;
public string LoadedControl
{
get { return _LoadedControl; }
set { _LoadedControl = value;
NotifyPropertyChanged("LoadedControl");
}
}
You need to set LoadedControl to an instance of your ViewModel type, not a string!
public MainViewModel()
{
LoadedControl = new FirstControlViewModel();
}
private ViewModelBase _LoadedControl;
public ViewModelBase LoadedControl
{
get { return _LoadedControl; }
set { _LoadedControl = value;
NotifyPropertyChanged("LoadedControl");
}
}
I need ListBox with my UserControl listed in it. My UserControl has TextBox. So I want to display property of List's subitem in UserControl's textBox. I have tried a lot of options with DataContext and ElementName - it just doesn`t work. I just stucked on it. The only way to make it work is to remove DataContext binding of UserControl to itself and change Item Property name so it matches to DependencyProperty name - but I need to reuse my control in different viewmodels with different entities so it is almost not possible to use the approach.
Interesting thing is that if I change my UserControl to Textbox and bind Text property of it - everything works. What the difference between Textbox and my UserControl?
So let me just show my code.
I have simplified the code to show only essential:
Control XAML:
<UserControl x:Class="TestControl.MyControl"
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"
d:DesignHeight="100" d:DesignWidth="200"
DataContext="{Binding RelativeSource={RelativeSource Self}}">
<Grid>
<TextBlock Text="{Binding Text}"/>
</Grid>
</UserControl>
Control CS:
public partial class MyControl : UserControl
{
public MyControl()
{
InitializeComponent();
}
public string Text
{
get {
return (string)this.GetValue(TextProperty); }
set {
this.SetValue(TextProperty, value); }
}
public static DependencyProperty TextProperty = DependencyProperty.Register("Text", typeof(string), typeof(MyControl), new propertyMetadata(""));
}
Window XAML:
<Window x:Class="TestControl.MainWindow"
Name="_windows"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:TestControl"
Title="MainWindow" Height="350" Width="525" >
<Grid Name="RootGrid">
<ListBox ItemsSource="{Binding ElementName=_windows, Path=MyList}">
<ItemsControl.ItemTemplate >
<DataTemplate >
<local:MyControl Text="{Binding Path=Name}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ListBox>
</Grid>
</Window>
Window CS:
public partial class MainWindow : Window
{
public MainWindow()
{
_list = new ObservableCollection<Item>();
_list.Add(new Item("Sam"));
_list.Add(new Item("App"));
_list.Add(new Item("H**"));
InitializeComponent();
}
private ObservableCollection<Item> _list;
public ObservableCollection<Item> MyList
{
get { return _list;}
set {}
}
}
public class Item
{
public Item(string name)
{
_name = name;
}
private string _name;
public string Name
{
get { return _name; }
set { _name = value; }
}
}
This is a pretty big gotcha in XAML. The problem is that when you do this in the user control:
DataContext="{Binding RelativeSource={RelativeSource Self}}"
You change its data context, so that in this line:
<local:MyControl Text="{Binding Path=Name}"/>
The runtime will now attempt to resolve "Name" on the instance of "MyControl", instead of on the inherited data context (ie, the view model). (Confirm this by checking the Output window -- you should see a binding error to that effect.)
You can get around this by, instead of setting the user control's data context that way, using a RelativeSource binding:
<UserControl x:Class="TestControl.MyControl"
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"
d:DesignHeight="100" d:DesignWidth="200"
<Grid>
<TextBlock
Text="{Binding Text,RelativeSource={RelativeSource AncestorType=UserControl}}"
/>
</Grid>
</UserControl>
I have a MainWindow:Window class which holds all the data in my program. The MainWindow's .xaml contains only an empty TabControl which is dynamically filled (in the code-behind).
One of the tabs (OptionsTab) has its .DataContext defined as the MainWindow, granting it access to all of the data. The OptionsTab has a DataGrid which has a column populated with Buttons, as shown below:
The DataGrid is populated with DataGridTemplateColumns, where the DataTemplate is defined in the main <Grid.Resources>. I would like to bind this button to a function in the MainWindow (not the OptionsTab in which it resides).
When the OptionsTab is created, it's .DataContext is set as the MainWindow, so I would have expected that defining the DataTemplate as below would have done it.
<DataTemplate x:Key="DeadLoadIDColumn">
<Button Content="{Binding Phases, Path=DeadLoadID}" Click="{Binding OpenDeadLoadSelector}"/>
</DataTemplate>
I thought this would mean the Click event would be bound to the desired OptionsTab.DataContext = MainWindow's function.This, however, didn't work (the Content did, however). So then I started looking things up and saw this answer to another SO question (by Rachel, who's blog has been of great help for me), from which I understood that you can't {bind} the click event to a method, but must instead bind the Command property to an ICommand property (using the helper RelayCommand class) which throws you into the desired method. So I implemented that, but it didn't work. If I place a debug breakpoint at the DeadClick getter or on OpenDeadLoadSelector() and run the program, clicking on the button doesn't trigger anything, meaning the {Binding} didn't work.
I would like to know if this was a misunderstanding on my part or if I simply did something wrong in my implementation of the code, which follows (unrelated code removed):
MainWindow.xaml
<Window x:Class="WPF.MainWindow"
x:Name="Main"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="WPF" SizeToContent="WidthAndHeight">
<TabControl Name="tabControl"
SelectedIndex="1"
ItemsSource="{Binding Tabs, ElementName=Main}">
</TabControl>
</Window>
MainWindow.xaml.cs
public partial class MainWindow : Window
{
ICommand deadClick;
public ICommand DeadClick
{
get
{
if (null == deadClick)
deadClick = new RelayCommand(p => OpenDeadLoadSelector());
return deadClick;
}
}
public ObservableCollection<TabItem> Tabs = new ObservableCollection<TabItem>();
public static DependencyProperty TabsProperty = DependencyProperty.Register("Tabs", typeof(ICollectionView), typeof(MainWindow));
public ICollectionView ITabsCollection
{
get { return (ICollectionView)GetValue(TabsProperty); }
set { SetValue(TabsProperty, value); }
}
public ObservableCollection<NPhase> Phases = new ObservableCollection<NPhase>();
public static DependencyProperty PhasesProperty = DependencyProperty.Register("Phases", typeof(ICollectionView), typeof(MainWindow));
public ICollectionView IPhasesCollection
{
get { return (ICollectionView)GetValue(PhasesProperty); }
set { SetValue(PhasesProperty, value); }
}
public ObservableCollection<string> Loads = new ObservableCollection<string>();
public static DependencyProperty LoadsProperty = DependencyProperty.Register("Loads", typeof(ICollectionView), typeof(MainWindow));
public ICollectionView ILoadsCollection
{
get { return (ICollectionView)GetValue(LoadsProperty); }
set { SetValue(LoadsProperty, value); }
}
void OpenDeadLoadSelector()
{
int a = 1;
}
public MainWindow()
{
var optionsTab = new TabItem();
optionsTab.Content = new NOptionsTab(this);
optionsTab.Header = (new TextBlock().Text = "Options");
Tabs.Add(optionsTab);
ITabsCollection = CollectionViewSource.GetDefaultView(Tabs);
Loads.Add("AS");
Loads.Add("2");
InitializeComponent();
}
}
OptionsTab.xaml
<UserControl x:Class="WPF.NOptionsTab"
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:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
mc:Ignorable="d"
xmlns:l="clr-namespace:WPF">
<Grid>
<Grid.Resources>
<DataTemplate x:Key="DeadLoadIDColumn">
<Button Content="{Binding Phases, Path=DeadLoadID}" Command="{Binding Path=DeadClick}"/>
</DataTemplate>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<!-- ... -->
</Grid.RowDefinitions>
<Grid Grid.Row="0">
<!-- ... -->
</Grid>
<Grid Grid.Row="1">
<!-- ... -->
</Grid>
<l:NDataGrid Grid.Row="2"
x:Name="PhaseGrid"
AutoGenerateColumns="False">
<l:NDataGrid.Columns>
<DataGridTextColumn Header="Name" Binding="{Binding Path=Name}"/>
<DataGridTextColumn Header="Date (days)" Binding="{Binding Path=Date}"/>
<DataGridTemplateColumn Header="Deadload" CellTemplate="{StaticResource DeadLoadIDColumn}"/>
</l:NDataGrid.Columns>
</l:NDataGrid>
</Grid>
</UserControl>
OptionsTab.xaml.cs
public NOptionsTab(MainWindow w)
{
DataContext = w;
InitializeComponent();
PhaseGrid.ItemsSource = w.Phases;
}
While we're at it (and this might be a related question), why does {Binding Phases, Path=DeadLoadID} work on the DataTemplate (which is why the buttons appear with "Select"), but if I do {Binding Phases, Path=Name} in the PhaseGrid and remove the .ItemsSource code from the constructor, nothing happens? Shouldn't the PhaseGrid inherit its parent's (NOptionsTab / Grid) DataContext? Hell, even setting PhaseGrid.DataContext = w; doesn't do anything without the .ItemsSource code.
EDIT (27/04/14):
I think that knowing the contents of the NPhase class itself will be of use, so here it is:
public class NPhase : INotifyPropertyChanged
{
string name;
double date;
string deadLoadID = "Select";
public event PropertyChangedEventHandler PropertyChanged;
public string Name
{
get { return name; }
set
{
name = value;
EmitPropertyChanged("Name");
}
}
public double Date
{
get { return date; }
set
{
date = value;
EmitPropertyChanged("Date");
}
}
public string DeadLoadID
{
get { return deadLoadID; }
set
{
deadLoadID = value;
EmitPropertyChanged("DeadLoadID");
}
}
void EmitPropertyChanged(string property)
{
PropertyChanged(this, new PropertyChangedEventArgs(property));
}
public NPhase(double _date, string _name)
{
date = _date;
name = _name;
}
}
EDIT (29/04/14):
A simplified project (getting rid of everything that wasn't necessary) can be downloaded from here (https://dl.dropboxusercontent.com/u/3087637/WPF.zip)
I think that there is the problem that you do not specify data source properly for the data item inside your grid.
I think that the data source for your button column is NPhase instance. So it has no DeadClick property. So, you can check it using Output window in Visual Studio.
I suggest that you can do something like that:
<DataTemplate x:Key="DeadLoadIDColumn">
<Button Content="{Binding Phases, Path=DeadLoadID}"
Command="{Binding Path=DataContext.DeadClick, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type l:NDataGrid}}}"/>
</DataTemplate>
I currently do not understand how you can compile Content="{Binding Phases, Path=DeadLoadID}", because as I thought the default value for Binding clause is the Path property, and you have specified it twice.
EDIT
After I got the small solution all becomes clear. Here is the modified solution. All what I changed in it - I have added RelativeSource to the command binding as I described above, and I added MainWindow as DataContext for your OptionsTab (you have specified it in the question, but not in the project). That's it - all works fine - the command getter is called, and the command is executed when you click the button.
How do you change the size of your Window in WPF programmatically using an MVVM approach?
I am setting the window height to 400 from XAML and on click of a button on the form trying to increase the height to 500.
In my button's ICommand I am using:
Application.Current.MainWindow.Height = 500;
But it's not doing anything.
Try setting the 'Application.Current.MainWindow' property in the Loaded event in the MainWindow.xaml.cs file:
private void MainWindow_Loaded(object sender, RoutedEventArgs e)
{
Application.Current.MainWindow = this;
}
UPDATE >>>
My friend, please remember, you said you wanted to use Application.Current.MainWindow... this is how you could use it. However, if you want to do this the MVVM way, then why don't you just bind the value to the Window.Width properties?
<Window Width="{Binding Width}" MinWidth="{Binding Width}" MaxWidth="{Binding Width}">
...
</Window>
Please note that binding to Window.Width is not enough for this to work.
I had a similar requirement to this, with the addition that I wanted to track some other window settings. So, I have this class:
public class WindowSettings
{
public int Width { get; set; }
public int Height { get; set; }
public int Left { get; set; }
public int Top { get; set; }
}
Then in my view model, I have:
public WindowSettings WindowSettings
{
get
{
return _windowSettings;
}
}
and in the xaml, this:
<Window ...
Height="{Binding WindowSettings.Height,Mode=TwoWay}"
Width="{Binding WindowSettings.Width, Mode=TwoWay}"
Left="{Binding WindowSettings.Left,Mode=TwoWay}"
Top="{Binding WindowSettings.Top,Mode=TwoWay}">
If I wanted to programmatically update the width, for example, I do this:
WindowSettings.Width = 456;
RaisePropertyChangedEvent("WindowSettings.Width");
(Naturally, my view model inherits from a base class which implements INotifyPropertyChanged.)
I did toy with the idea of providing an event on the WindowSettings class so that an update to a property could automatically cause the property change notification, but my requirement is to track the window size and set it on startup, so I didn't bother. Hope that helps.
Using VS 2017 and Caliburn Micro I have no issue with just setting the width. The way you are doing it isn't MVVM your VM doesn't need to know about the V or what's happening when the int Width changes.
public class ShellViewModel : Caliburn.Micro.PropertyChangedBase, IShell
{
public ShellViewModel()
{
Width = 500;
}
private int _width;
public int Width
{
get => _width;
set
{
_width = value;
NotifyOfPropertyChange(() => Width);
}
}
public void MyButton()
{
Width = 800;
}
}
In the Window XAML
Width="{Binding Width, Mode=TwoWay}"
In the Grid
<Button x:Name="MyButton" Content="Make 800 wide" />
it opens at 500 and when I click the button it stretches to 800.
I'm adding this answer because the most voted answer actually isn't correct. Binding to the MinHeight & MaxHeight, will result in a window that can't be resized using the grips.
<Window Width="{Binding Width}" MinWidth="{Binding Width}" MaxWidth="{Binding Width}">
...
</Window>
Instead add Mode=TwoWay to your binding.
<Window Width="{Binging Width, Mode=TwoWay}">
...
</Window>
Are you sure the window you want to resize is MainWindow? Or are you sure your command is successfully binding on your button? You can try the below code:
View:
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:viewModel="clr-namespace:WpfApplication1.ViewModel"
Title="Wpf Application" Height="300" Width="400"
WindowStartupLocation="CenterScreen">
<Window.DataContext>
<viewModel:MainWindowViewModel />
</Window.DataContext>
<Grid>
<Button Content="Resize" Command="{Binding ResizeCommand}" IsEnabled="{Binding ResizeCommand.CanExecute}" />
</Grid>
</Window>
ViewModel:
public class MainWindowViewModel
{
private RelayCommand _resizeCommand;
public RelayCommand ResizeCommand { get { return _resizeCommand; } }
public MainWindowViewModel()
{
this._resizeCommand = new RelayCommand(this.Resize);
}
private void Resize()
{
Application.Current.MainWindow.Height = 500;
}
}
This Works
Application.Current.MainWindow = this;
Application.Current.MainWindow.WindowState = WindowState.Normal;
Application.Current.MainWindow.Width = 800;
Application.Current.MainWindow.Height = 450;