使UserControl占用ItemsControl中的所有空间 [英] Make UserControl occupy all space in ItemsControl

查看:83
本文介绍了使UserControl占用ItemsControl中的所有空间的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

大家好,



以前,我写了这个,视图就像我想象的那样运行,占据了窗口的整个空间:



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

< view:View / >





现在我将其更改为此视图并将视图自动调整为空视图中的DataGrid只占用足够的空间,只有DataGrid的标题


 <  窗口.DataContext  >  
< vm:MainWindowViewModel / >
< / Window.DataContext >

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

< ItemsControl ItemsSource = {Binding ViewModels} / >





来自我可以看到,ItemsControl仍然与窗口的所有可用大小相同。是什么让ItemsControl方法不同于直接召唤视图?



编辑:



这是怎么回事视图去了



 <   Grid  >  
< Grid.ColumnDefinitions >
< ColumnDefinition 宽度 = 1.5 * / > ;
< ColumnDefinition 宽度 = 1.5 * / >
< ColumnDefinition 宽度 = 7 * / >
< / Grid.ColumnDefinitions >

< 网格 Grid.Column = 0 >
< Gri d.RowDefinitions >
< RowDefinition 高度 = 60 / >
< RowDefinition < span class =code-attribute>高度 = 22 * / >
< RowDefinition 高度 = * / >
< < span class =code-leadattribute> / Grid.RowDefinitions >
< 按钮 Grid.Row < span class =code-keyword> = 0 命令 = {Binding NewWindowCommand} >
< StackPanel 方向 = 水平 >
< TextBlock FontSize = 50 文字 = + 保证金 = 0,0,0,0 / >
< TextBlock 文字 = 新窗口 保证金 = 15,22,0,0 / >
< / StackPanel >
< /按钮 >
< ListBox Grid.Row = 1 ItemsSource = {Binding List} SelectedValue = {Binding SelectedItem} SelectedIndex = - 1 / >
< CheckBox Grid.Row = 2 内容 = 过滤列表项 / >
< / Grid >
< StackPanel Grid.Column = < span class =code-keyword> 1 >
< / StackPanel >
< 网格 Grid.Column < span class =code-keyword> = 2 >
< Grid.RowDefinitions >
< RowDefinition < span class =code-attribute>高度 = 60 / >
< RowDefinition 高度 = 22 * / >
< RowDefinition 高度 = * / >
< / Grid.RowDefinitions >
< StackPanel < span class =code-attribute> Grid.Row = 0 / >
< DataGrid Grid.Row = 1 >
< DataGrid.Columns >
< DataGridTextColumn 绑定 < span class =code-keyword> = {x:Null} < span class =code-attribute> ClipboardContentBinding = {x:Null} 标题 = 第1列 宽度 = 150 / >
< DataGridTextColumn 绑定 = {x:Null} ClipboardContentBindi ng = {x:Null} 标题 = 第2列 宽度 = 200 / >
< span class =code-keyword>< / DataGrid.Columns >
< / DataGrid >
< DockPanel Grid.Row = 2 已删除 = #FF5A8EFF LastChildFill = False >
< 按钮 内容 = 保存 宽度 = 150 DockPanel.Dock = / >
< / DockPanel >
< / Grid >
< / Grid < span class =code-keyword>>





这里是主窗口视图模型:

  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;
}
}
}





和视图模型基类

  protected  ViewModelBase()
{

}

public event PropertyChangedEventHandler PropertyChanged;

受保护 虚拟 void OnPropertyChanged( string PropName)
{
PropertyChangedEventHandler handler = this 。的PropertyChanged;
if (handler!= null
{
PropertyChangedEventArgs e = new PropertyChangedEventArgs(PropName);
handler( this ,e);
}
}





视图使用ViewModel类。基本上:



视图被称为View

视图模型被称为MainWindowViewModel和ViewModel视图模型派生自ViewModelBase

ViewModel是View的视图模型

视图被放入MainWindow中的ItemsControl

解决方案

我找到了解决问题的方法。事实证明,问题不在于ItemsControl拒绝占用窗口中的所有空间,而是itemscontrol itemspanel,它将视图的大小缩小到其裸露的需求。



而不是像以前一样:



 <  < span class =code-leadattribute> ItemsControl     ItemsSource   =  {Binding ViewModels}    /  >  





我确实改变了itemscontrol到grid网格的itemspanel:



 <   ItemsControl     ItemsSource   =  {Binding ViewModels} >  
< ItemsControl.ItemsPanel >
< ItemsPanelTemplate >
< 网格 / >
< / ItemsPanelTemplate >
< / ItemsControl.ItemsPanel >
< / ItemsControl的 <跨度类= 代码关键字>>


Hi Guys,

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

<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

<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

<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:

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

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

解决方案

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:

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



I did changed the itemspanel of the itemscontrol to grid:

<ItemsControl ItemsSource="{Binding ViewModels}">
     <ItemsControl.ItemsPanel>
         <ItemsPanelTemplate>
             <Grid />
         </ItemsPanelTemplate>
     </ItemsControl.ItemsPanel>
 </ItemsControl>


这篇关于使UserControl占用ItemsControl中的所有空间的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆