Click here to Skip to main content
15,569,696 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hi Guys,

Previously, I have this written and the view runs just like I imagined, taking up the whole space of the window:

HTML
<Window.DataContext>
  <vm:ViewModel />
</Window.DataContext>

<view:View/>


Now I changed it to this and the view autosizes itself to an empty DataGrid in the view and only occupies enough space to have only the header of the DataGrid

HTML
<Window.DataContext>
  <vm:MainWindowViewModel/>
</Window.DataContext>

<Window.Resources>
  <DataType DataType="{x:type vm:ViewModel}">
      <view:View/>
  </DataType>
</Window.Resources>

<ItemsControl ItemsSource="{Binding ViewModels}" />


From what I can see, the ItemsControl is still at the same size of all the available size of the window. What is making the ItemsControl approach different from directly summoning the View?

EDIT:

This is how the View goes

HTML
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1.5*"/>
        <ColumnDefinition Width="1.5*"/>
        <ColumnDefinition Width="7*"/>
    </Grid.ColumnDefinitions>

    <Grid Grid.Column="0">
        <Grid.RowDefinitions>
            <RowDefinition Height="60"/>
            <RowDefinition Height="22*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Button Grid.Row="0" Command="{Binding NewWindowCommand}">
            <StackPanel Orientation="Horizontal">
                <TextBlock FontSize="50" Text="+" Margin="0,0,0,0"/>
                <TextBlock Text="New Window"  Margin="15,22,0,0"/>
            </StackPanel>
        </Button>
        <ListBox Grid.Row="1" ItemsSource="{Binding List}" SelectedValue="{Binding SelectedItem}" SelectedIndex="-1"/>
        <CheckBox Grid.Row="2" Content="Filter list items"/>
    </Grid>
    <StackPanel Grid.Column="1">
    </StackPanel>
    <Grid Grid.Column="2">
        <Grid.RowDefinitions>
            <RowDefinition Height="60" />
            <RowDefinition Height="22*" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <StackPanel Grid.Row="0"/>
        <DataGrid Grid.Row="1">
            <DataGrid.Columns>
                <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="Column 1" Width="150"/>
                <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="Column 2" Width="200"/>
            </DataGrid.Columns>
        </DataGrid>
        <DockPanel Grid.Row="2" removed="#FF5A8EFF" LastChildFill="False">
            <Button Content="Save" Width="150" DockPanel.Dock="Right"/>
        </DockPanel>
    </Grid>
</Grid>


And here is the main window view model:
C#
class MainWindowVM :ViewModelBase
    {
        ObservableCollection<ViewModelBase> viewmodels;

        public MainWindowVM()
        {
            ViewModel VM = new ViewModel ();
            ViewModels.Add(VM);
        }

        public ObservableCollection<ViewModelBase> ViewModels
        {
            get
            {
                if (viewmodels == null)
                {
                    viewmodels = new ObservableCollection<ViewModelBase>();
                }
                return viewmodels;
            }
        }
    }


and the view model base class
C#
protected ViewModelBase()
        {

        }

        public event PropertyChangedEventHandler PropertyChanged;

        protected virtual void OnPropertyChanged(string PropName)
        {
            PropertyChangedEventHandler handler = this.PropertyChanged;
            if(handler != null)
            {
                PropertyChangedEventArgs e = new PropertyChangedEventArgs(PropName);
                handler(this, e);
            }
        }


The view uses the ViewModel class. Basically:

there view is called View
the view models are called MainWindowViewModel and ViewModel the view models derive from ViewModelBase
ViewModel is the View's view model
View is put into ItemsControl in the MainWindow
Posted
Updated 1-Sep-15 18:38pm
v4
Comments
Sergey Alexandrovich Kryukov 30-Aug-15 12:18pm    
It should occupy all parent's space by default. Perhaps I cannot see the problem because your XAML is not comprehensive. Could you create the whole XAML and show it all, but make is as small as possible, focusing only on one particular problem?
Also, it's looks a bit weird to me that you use ItemControl directly, not any of its more specialized descendant classed. What do you want to achieve with it?
—SA
Lyandor 30-Aug-15 22:00pm    
The ItemsControl did occupy all of the parent's space, but the view in the ItemsControl did not. Actually, that was all of my code. I have to admit, I am still really new in MVVM approach to WPF, can you give me an example or an article about a different way in implementing ItemsControl? the tutorials I have followed thus far used ItemsControl as a parent for UserControls which I used for the views.
Sergey Alexandrovich Kryukov 30-Aug-15 23:01pm    
You still need to provide the code sample I asked above.
—SA
Lyandor 1-Sep-15 21:37pm    
...
Sergey Alexandrovich Kryukov 1-Sep-15 22:54pm    
Sorry, it's still looks difficult to me to assemble a sample project from your code. I cannot use your view model, cannot see the parent of ItemsControls, and so on. Your description of the problem is also unclear.
—SA

1 solution

I figured out the solution to my problem. Turns out, the problem is not that ItemsControl refuse to take up all the space in the window but the itemscontrol itemspanel that scaled down the size of the view to its bare needs.

Instead of doing this like before:

XML
<ItemsControl ItemsSource="{Binding ViewModels}" />


I did changed the itemspanel of the itemscontrol to grid:

XML
<ItemsControl ItemsSource="{Binding ViewModels}">
     <ItemsControl.ItemsPanel>
         <ItemsPanelTemplate>
             <Grid />
         </ItemsPanelTemplate>
     </ItemsControl.ItemsPanel>
 </ItemsControl>
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900