调整列表中的控件以填充可用空间WPF

时间:2014-01-21 05:59:40

标签: c# wpf xaml .net-4.0 viewbox

我正在尝试找到一种在WPF中显示水平项目列表的方法,诀窍是包含列表的窗口将以各种屏幕尺寸显示,并且列表中的所有项目都需要调整为填充可用空间而不使用滚动条。

我发现可以使用ViewBox控件来实现所需的效果,但只有在我设置<RowDefinition Height="300"/>时ViewBox才有效。这种方法不起作用,因为如果你有一定的列表中的项目数量开始变为被切断

如果我删除<RowDefinition Height="300"/>,则列表中的第一项填充屏幕,其余项目切断

有关如何使列表中的所有项目调整大小以填充可用空间的任何建议,无论屏幕分辨率如何?

XAML:

<Window x:Class="ViewBoxExample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" WindowState="Maximized">
    <ItemsControl ItemsSource="{Binding Path=Employees}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="3*" />
                        <ColumnDefinition Width="3*" />
                        <ColumnDefinition Width="3*" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="300"/>
                    </Grid.RowDefinitions>
                    <Viewbox Grid.Row="0" Grid.Column="0">
                        <TextBlock Text="{Binding Path=Name}" />
                    </Viewbox>
                    <Viewbox Grid.Row="0" Grid.Column="1">
                        <TextBlock Text="{Binding Path=Surname}" />
                    </Viewbox>
                    <Viewbox Grid.Row="0" Grid.Column="2">
                        <TextBlock Text="{Binding Path=Age}" />
                    </Viewbox>
                </Grid>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Window>

C#:

using System.Collections.Generic;
using System.Windows;

namespace ViewBoxExample
{
    public partial class MainWindow : Window
    {
        public List<Employee> _employees = new List<Employee>();
        public List<Employee> Employees 
        {
            get { return _employees; }
            set { _employees = value; }
        }

        public MainWindow()
        {
            InitializeComponent();

            Employees = new List<Employee>()
            {
                new Employee{ Name="Name1",Surname="Surname1",Age=20},
                new Employee{ Name="Name2",Surname="Surname2",Age=30},
                new Employee{ Name="Name3",Surname="Surname3",Age=40},
                new Employee{ Name="Name4",Surname="Surname4",Age=50},
                new Employee{ Name="Name5",Surname="Surname5",Age=60},
            };
            this.DataContext = this;
        }
    }

    public class Employee
    {
        public string Name { get; set; }
        public string Surname { get; set; }
        public int Age { get; set; }
    }
}

1 个答案:

答案 0 :(得分:0)

只需将ItemsControl放入ViewBox

即可
<Viewbox>
    <ItemsControl ItemsSource="{Binding Path=Employees}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="3*" />
                        <ColumnDefinition Width="3*" />
                        <ColumnDefinition Width="3*" />
                    </Grid.ColumnDefinitions>
                    <Viewbox Grid.Row="0" Grid.Column="0">
                        <TextBlock Text="{Binding Path=Name}" />
                    </Viewbox>
                    <Viewbox Grid.Row="0" Grid.Column="1">
                        <TextBlock Text="{Binding Path=Surname}" />
                    </Viewbox>
                    <Viewbox Grid.Row="0" Grid.Column="2">
                        <TextBlock Text="{Binding Path=Age}" />
                    </Viewbox>
                </Grid>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Viewbox>

编辑:如果我正在做相同类型的事情,我将使用Kent Boogaart在此Answer

中解释的实际高度和宽度方法