このStackpanelにはグリッドがあり、グリッドには表示するコンテンツを含む複数のボタンがあります。アイテムはアルファベット順に並べられており、私はこれを手動で行っています。たとえば、ゲームの名前が「Death Row」の場合、新しいアイテムのためのスペースを確保するために、すべてのアイテムを手動で1つ下に移動するのに時間を無駄にする必要があります。ここでの問題は、アイテムの間にコードを実装するだけで自動的に調整されるように整理する方法はありますか?コードの外観: コード 例の画像
1 に答える
0
DataGrid
to Layoutの動的コンテンツを使用しないでください。withを使用ItemsControl
しDataTemplates
てデータをaのコレクションに格納してViewModel
から、データバインディングを使用してコンテンツを表示してください。これにより、データ収集を変更し、UIを適切に更新できます。
例:
各ゲームの詳細を保持するための簡単なクラス:
public class GameViewModel
{
public string Name { get; set; }
public string ImagePath { get; set; }
}
メインのViewModel:
public class SortedContentViewModel
{
public ObservableCollection<GameViewModel> GameList { get; set; }
public SortedContentViewModel()
{
GameList = new ObservableCollection<GameViewModel>()
{
new GameViewModel() {Name="Brink", ImagePath = @"Resources/brink.png" },
new GameViewModel() {Name="Bulletstorm", ImagePath = @"Resources/bulletstorm.png" }
};
}
}
およびXAML:
<UserControl x:Class="Wpf_Playground.Views.SortedContentView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:vm="clr-namespace:Wpf_Playground.ViewModels"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300"
DataContext="{DynamicResource ViewModel}">
<UserControl.Resources>
<vm:SortedContentViewModel x:Key="ViewModel" />
<DataTemplate DataType="{x:Type vm:GameViewModel}">
<Button>
<Grid>
<Image Source="{Binding ImagePath}" Stretch="Fill" />
<Border Background="#66000000" Height="30" VerticalAlignment="Bottom">
<TextBlock Text="{Binding Name}" Margin="10,-2,10,0" VerticalAlignment="Bottom" />
</Border>
</Grid>
</Button>
</DataTemplate>
</UserControl.Resources>
<Grid>
<ItemsControl ItemsSource="{Binding GameList}" >
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</Grid>
</UserControl>
于 2013-03-26T17:15:23.370 に答える