【发布时间】：2017-03-29 13:03:15
【问题描述】：
我正在尝试创建一个“类似电子表格”的网格，其列标题显示来自一组播放器对象的信息，其中单元格内容的大小已最大化。为此，我有一个带有ListView 绑定到Player 对象集合的UWP 应用程序。 ListView.ItemsPanel 使用从here 获得的UniformGridPanel
UniformGridPanel 有一个Rows 属性绑定到可以变化的玩家数量和一个列。 UniformGridPanel 用于显示所有玩家，赋予每个玩家物品相同的高度，因此没有玩家被部分显示并且没有滚动。 UniformGridPanel 工作正常。
ListView.ItemTemplate 是一个具有固定数量的列的Grid，表示每个玩家的数据。
我的问题是：
- 每个“单元”中的信息不够大。我希望每个“单元格”内容最大化，并且网格布局保持电子表格一样，即正方形，行和列对齐。
- 我不知道如何将标题放在与每列中的单元格对齐的每列上。
所以显示如下所示。这是最接近我想要的，但对于单元格内容和列标题的大小。
如您所见，数字和字母更大的空间很大。我在 XAML 中使用Viewbox 尝试了许多变体。例如，将ListView 包装在Viewbox 中会产生这样的结果，因为列未对齐。
如果我在每个定义“单元格”的Bordercontrol 周围加上Viewbox，我仍然会遇到布局问题。
尽管我在 UWP 上下文中遇到问题，但我还是用 WPF 标记了这篇文章，以防有人在该领域有类似的经验，可以在这里应用。
代码隐藏：
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
ObservableCollection<Player> players = new ObservableCollection<Player>();
players.Add(new Player("John", "Smith",1,99,11,1));
players.Add(new Player("Fred", "Blogs", 19, 25, 11, 1));
players.Add(new Player("Andrew", "Sykes", 19, 25, 11, 2));
players.Add(new Player("Dean", "Andrews", 19, 179, 11, 1));
this.DataContext = players;
}
}
XAML：
<Grid x:Name="root" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid x:Name="grdPlayers" Grid.Row="0" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<!--<Viewbox VerticalAlignment="Stretch" HorizontalAlignment="Stretch" StretchDirection="Both" Stretch="Fill">-->
<ListView x:Name="lvwPlayers"
Padding="0"
BorderBrush="Red"
BorderThickness="5"
ItemsSource="{Binding}"
SelectionMode="None"
ScrollViewer.VerticalScrollMode="Disabled"
ScrollViewer.VerticalScrollBarVisibility="Hidden"
ScrollViewer.HorizontalScrollBarVisibility="Hidden"
ScrollViewer.HorizontalScrollMode="Disabled"
VerticalAlignment="Stretch"
VerticalContentAlignment="Stretch"
HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="Padding" Value="0"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="VerticalContentAlignment" Value="Stretch"/>
</Style>
</ListView.ItemContainerStyle>
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<local:UniformGrid x:Name="pnlPlayer" Rows="{Binding Count}" Columns="1" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<Grid x:Name="grdPlayerRow">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Border Grid.Column="0" BorderBrush="Black" BorderThickness="1" Background="Green" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<TextBlock Text="{Binding Initials}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
</Border>
<Border Grid.Column="1" BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<TextBlock Text="{Binding HighScore}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
</Border>
<Border Grid.Column="2" BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<TextBlock Text="{Binding LowScore}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
</Border>
<Border Grid.Column="3" BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<TextBlock Text="{Binding Average}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
</Border>
<Border Grid.Column="4" BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<TextBlock Text="{Binding TonCount}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
</Border>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<!--</Viewbox>-->
</Grid>
</Grid>
玩家代码：
public class Player : INotifyPropertyChanged
{
public Player(string firstName, string lastName, int low, int high, int avg, int tonCount)
{
FirstName = firstName;
LastName = lastName;
LowScore = low;
HighScore = high;
Average = avg;
TonCount = tonCount;
}
protected void OnPropertyChanged([CallerMemberName] string caller = "")
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(caller));
}
public event PropertyChangedEventHandler PropertyChanged;
private int _tonCount;
public int TonCount
{
get { return _tonCount; }
set
{
_tonCount = value;
OnPropertyChanged();
}
}
private double _average;
public double Average
{
get { return _average; }
set
{
_average = value;
OnPropertyChanged();
}
}
private int _lowScore;
public int LowScore
{
get { return _lowScore; }
set
{
_lowScore = value;
OnPropertyChanged();
}
}
private int _highScore;
public int HighScore
{
get { return _highScore; }
set
{
_highScore = value;
OnPropertyChanged();
}
}
public string FullName
{
get { return $"{FirstName} {LastName}"; }
}
private string _firstName = string.Empty;
public string FirstName
{
get { return _firstName; }
set
{
_firstName = value;
OnPropertyChanged();
OnPropertyChanged("Initials");
}
}
private string _lastName = string.Empty;
public string LastName
{
get { return _lastName; }
set
{
_lastName = value;
OnPropertyChanged();
OnPropertyChanged("Initials");
}
}
public string Initials
{
get
{
return FirstName.Substring(0, 1) + LastName.Substring(0, 1).ToUpper();
}
}
public override string ToString()
{
return FullName;
}
}
更新：
@Grace Feng，您在分配 DataContext 之前使用 lvwPlayers 加载事件的答案给出了以下输出，这不是我想要的。首先，行的高度无缘无故？？：
【问题讨论】：
标签： c# wpf layout uwp uwp-xaml