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

【问题标题】：Resize controls in a list to fill the available space WPF调整列表中控件的大小以填充可用空间 WPF
【发布时间】：2014-01-21 05:59:39
【问题描述】：

我正在尝试找到一种在 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; }
    }
}

【问题讨论】：

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

【解决方案1】：

只需将您的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 中解释的实际高度和宽度方法

【讨论】：