/ / wpf pomocou mriežky ako itemhost automaticky skladajúci viac položiek do jednej „bunky“ - wpf, grid, itemscontrol

wpf pomocou grid ako itemshost automaticky stohovanie viacerých položiek do jednej „bunky“ - wpf, grid, itemscontrol

Viazam ovládací prvok položiek na zdroj údajov apoužívam mriežku ako môj itemhost. Prial by som si, aby sa položky nachádzali v správnej bunke v mriežke (môžem to urobiť), a tiež sa hromadili, aby neboli všetky na sebe (nemôžem prísť na to, ako vložiť položky do stohovací panel alebo iný panel v mriežke).

tu je súbor .cs pre dve triedy:

   public class listofdata
{
public List<data> stuff { get; set; }
public listofdata()
{
stuff = new List<data>();
stuff.Add(new data(0, 0, "zeroa"));
stuff.Add(new data(0, 0, "zerob"));
stuff.Add(new data(1, 0, "onea"));
stuff.Add(new data(1, 0, "oneb"));
stuff.Add(new data(1, 1, "twoa"));
stuff.Add(new data(1, 1, "twob"));
}
}

public class data
{
public int x { set; get; }
public int y { set; get; }
public string text { get; set; }
public data(int x, int y, string text)
{
this.x = x;
this.y = y;
this.text = text;
}
}
}

Tu je môj XAML

   <Window x:Class="GridTester.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:src="clr-namespace:GridTester"
xmlns:sys="clr-namespace:System;assembly=mscorlib"

Title="MainWindow" >
<Window.Resources>
<DataTemplate DataType="{x:Type src:data}">
<Button Content="{Binding text}"/>
</DataTemplate>
<src:listofdata x:Key="MyDataSource"> </src:listofdata>


</Window.Resources>
<ListBox Name="Main" ItemsSource="{Binding Source={StaticResource MyDataSource},Path=stuff}">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<Grid Name="MyGrid">
<Grid.ColumnDefinitions>
<ColumnDefinition/>

<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
</Grid>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>

<ListBox.ItemContainerStyle>
<Style>
<Setter Property="Grid.Column" Value="{Binding x}"/>
<Setter Property="Grid.Row" Value="{Binding y}"/>
</Style>
</ListBox.ItemContainerStyle>

</ListBox>


</Window>

Môj problém je, že všetky tlačidlá končiace na „a“ sú pod tlačidlami končiacimi na b. Nevidím, ako používať XAML na vkladanie položiek do dynamicky vytvoreného stackpanelu

Pokúsil som sa vytvoriť triedu odvodenú z Gridu,premýšľanie o zachytení pridania detí, aby som sám pridal stolové panely, a potom presunúť deti z mriežky na stolové panely, ale pokus o manipuláciu s deťmi v archíve položiek spôsobí vyhodenie výnimky.

Nakoniec chcem iba to, aby sa položky v mojom zdroji údajov mohli viazať na „bunku“ v mriežke, a ak sa viac položiek viaže na tú istú bunku, chcem, aby sa stohovali.

odpovede:

1 pre odpoveď č. 1

Môžete to urobiť na dátovej úrovni, napríklad HighCorenavrhol, ale pretože súčasná dátová štruktúra už obsahuje potrebné informácie, ItemsControl by mala mať možnosť s nimi pracovať. Zvážte pridanie a Popis skupiny do zbierky položiek ListBoxu a použite a GroupStyle čí panel je StackPanel.


1 pre odpoveď č. 2

Tu je riešenie využívajúce rady od nmclean (moc ďakujem) Táto časť ustanovuje zoskupenie, ktoré sa použije na rozloženie prvkov po mriežke.

<CollectionViewSource Source="{Binding Source={StaticResource MyDataSource}}" x:Key="cvs">


<CollectionViewSource.GroupDescriptions>
<PropertyGroupDescription PropertyName="ordinal"/>


</CollectionViewSource.GroupDescriptions>

</CollectionViewSource>

táto časť je hlavným zoznamom viazaným naúdaje v zdroji kolekciezobrazenia, štýl kontajnera obsahuje väzby na umiestnenie skupiny do správnych buniek v mriežke. Mriežka je v paneli groupstyle.panel

  <ListBox  ItemsSource ="{Binding Source={StaticResource cvs}}"   >
<ListBox.GroupStyle>
<GroupStyle>
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Grid.Row" Value="{Binding Items[0].y,diag:PresentationTraceSources.TraceLevel=High}" />
<Setter Property="Grid.Column" Value="{Binding Items[0].x,diag:PresentationTraceSources.TraceLevel=High}" />


</Style>
</GroupStyle.ContainerStyle>
<GroupStyle.Panel>
<ItemsPanelTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
</Grid>
</ItemsPanelTemplate>
</GroupStyle.Panel>
</GroupStyle>
</ListBox.GroupStyle>

Tu je celkové riešenie pre prípad, že ho potrebujete:

<Window x:Class="GridTester.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:diag="clr-namespace:System.Diagnostics;assembly=WindowsBase"
xmlns:src="clr-namespace:GridTester"
xmlns:sys="clr-namespace:System;assembly=mscorlib"

Title="Window1" Height="300" Width="300" Name="TOPWindow">
<Window.Resources>

<DataTemplate DataType="{x:Type src:data}">
<Button Content="{Binding text}"/>
</DataTemplate>
<src:listofdata x:Key="MyDataSource"></src:listofdata>
<CollectionViewSource Source="{Binding Source={StaticResource MyDataSource}}" x:Key="cvs">


<CollectionViewSource.GroupDescriptions>
<PropertyGroupDescription PropertyName="ordinal"/>


</CollectionViewSource.GroupDescriptions>

</CollectionViewSource>


</Window.Resources>



<ListBox  ItemsSource ="{Binding Source={StaticResource cvs}}"   >
<ListBox.GroupStyle>
<GroupStyle>
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Grid.Row" Value="{Binding Items[0].y,diag:PresentationTraceSources.TraceLevel=High}" />
<Setter Property="Grid.Column" Value="{Binding Items[0].x,diag:PresentationTraceSources.TraceLevel=High}" />


</Style>
</GroupStyle.ContainerStyle>
<GroupStyle.Panel>
<ItemsPanelTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
</Grid>
</ItemsPanelTemplate>
</GroupStyle.Panel>
</GroupStyle>
</ListBox.GroupStyle>


</ListBox>



</Window>

Súbor kódu teraz vyzerá takto:

  public class listofdata : List<data>
{

public listofdata()
{

Add(new data(0, 0, "zeroa"));
Add(new data(0, 0, "zerob"));
Add(new data(1, 0, "onea"));
Add(new data(1, 0, "oneb"));
Add(new data(1, 1, "twoa"));
Add(new data(1, 1, "twob"));


}

}

public class data
{
public int x { set; get; }
public int y { set; get; }
public int ordinal { get { return x * 1000 + y; } }
public string text { get; set; }
public data(int x, int y, string text)
{
this.x = x;
this.y = y;
this.text = text;
}

}