Using * sizing in a data template WPF - c#

I am trying to set a * height property in an item template but I keep getting the error
'50*' string cannot be converted to Length.
Im not sure if what Im wanting to do is possible.
Please let me know if you need anymore information.
Heres my Xaml:
<ItemsControl Name="lstMain" ItemsSource="{Binding Sections}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<GroupBox Header="{Binding Section.SectionName}" Height="50*">
<StackPanel>
<ItemsControl ItemsSource="{Binding SubSections}" ItemTemplate="{StaticResource BinderTemplate}" />
</StackPanel>
</GroupBox>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>

the point is that Height is a Double data type and not a GridLength, such as grid rows and columns are.
Only GridLength supports the star size.

Related

c# WPF How to Remove listview header seperator line?

How to Remove this header seperator line
<ListView ItemsSource="{Binding ...}">
<ListView.ItemTemplate>
<DataTemplate>
<Grid>
...
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
this is my ListView
Unless I'm missing something, is this not just a matter of setting the BorderThickness property to zero on your ListView?
<ListView ItemsSource="{Binding}" BorderThickness="0">
That should be the solution given the information provided in your question.
If you define some container in your ItemTemplate that has a border, the solution would be similar.

Use all available space with ListBox and a StackPanel as ItemsPanelTemplate

I use a ListBox to show the contents of an ObservableCollection in my view. In my simplified example, I just use an image for each item like that:
<Window>
<Window.Resources>
<DataTemplate DataType="{x:Type viewModel:HealthCriterionViewModel}">
<Image VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Source="Optionsh.png" Stretch="Fill" />
</DataTemplate>
</Window.Resources>
<ListBox ItemsSource="{Binding HealthCriteria}" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Vertical" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
</Window>
HealthCriteria is a collection of type HealthCriterionViewModel.
What I get is this:
What I want is this (stretch images to use all available space both vertically and horizontally):
How can I achieve this?
I suggest you can't achieve it with ItemsControl. Because contents presenter size is not fixed, it's scrollable area. So size of each element should be fixed. It can be limited directly in ItemsPanel with "Weight" or "Height" (depends on orientation) properties or limited by content size.

XAML Element Alignment issue

I have a list view that will contain notes that I input. I am having trouble figuring out how to have the list view item look how I want it to.
Below is how it should look:
And this is what it currently looks like:
How do I write the list view item in XAML so that the Date and time appear to the very top-right of each list view item, with the text of the note to the left?
<ListView x:Name="list" ItemsSource="{Binding Note}" BorderBrush="{x:Null}" BorderThickness="0">
<DataTemplate>
<ListViewItem>
<StackPanel Orientation="Horizontal">
</StackPanel>
</ListViewItem>
</DataTemplate>
</ListView>
Any help at all is much appreciated!
You are missing a number of elements required in order to get your screen to look the way you want.
You need to define the ItemTemplate for the ListView. You're on the right track here, it is a DataTemplate declared in XAML, you just have to apply it to the ListView.ItemTemplate property.
You need to set the HorizontalContentAlignment of the ListView to Stretch (the default is Left, which means your items will not fill the entire content area).
You need to use a DockPanel (or other similar panel) inside your DataTemplate to place your date content on the right, and the remainder of your content on the left.
You need to disable Horizontal Scrolling (ScrollViewer.HorizontalScrollBarVisbility) on the ListView in order to make your content wrap (otherwise it will just happily draw it all on one line).
I've included a sample ListView that should get you started.
<ListView
ItemsSource="{Binding Items}"
HorizontalContentAlignment="Stretch"
ScrollViewer.HorizontalScrollBarVisibility="Disabled">
<ListView.ItemTemplate>
<DataTemplate>
<DockPanel>
<TextBlock
TextWrapping="Wrap"
Text="{Binding Date}"
Background="Magenta"
DockPanel.Dock="Right" />
<TextBlock Text="{Binding Content}" Background="Lime" />
</DockPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>

Tile Grid with Bindings?

OK, what I'm trying to do is fairly simple :
I'm getting a list of images (using bindings) which I'm trying to display in a table-like grid (like 3 images per row)
How can this be done?
<ListBox.ItemTemplate>
<DataTemplate>
<Image Height="100" Width="100" Margin="12,0,9,0" Source="{Binding AlbumArt}"/>
</DataTemplate>
</ListBox.ItemTemplate>
This way, the images are property display, but not the way I want them to - they are display one below the other and not like :
A B C
D E F
G H I
How can this be done? Any ideas?
A great solution would be using UniformGrid with its columns property and ItemsControl.
Example:
<ItemsControl ItemsSource="{Binding AlbumArt}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Columns="3"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Image Height="100" Width="100" Margin="12,0,9,0" Source="{Binding}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
This way you will get the desired result. Read more about UniformGrid here: MSDN
The reason why your solution does not work, is that Listbox panel puts items one under another, whereas UniformGrid puts them from left to right, until there is available space or has hit the columns limit and then goes down the row.
You can use two StackPanels, one with verticle orientation and one with horizontal. Here's your code edited to include them:
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Verticle">
<StackPanel Orientation="Horizontal">
<Image Height="100" Width="100" Margin="12,0,9,0" Source="{Binding AlbumArt}"/>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>

Binding variable number of images in single WPF itemtemplate

I have a listbox and each item contains a title and a variable number of images, from 2 to 10+. Easy enough to do with a fixed number of images, but how can I set the itemtemplate to the varied number of images?
You can add ItemsControl into ItemTemplate
Something like this:
<ListBox ItemsSource="{Binding Something}">
<ListBox.ItemTemplate>
<DataTemplate>
<ItemsControl ItemsSource="{Binding Images}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Image Source="{Binding}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I did write this without knowing details of your object model, so this is more to give you idea...

Categories

Resources