I'm trying to divide a listbox into several columns, so that I add an item by calling Listbox.items.add(item); and it will display with different properties in different columns. Here is my code so far:
<ListBox Name="listbox1" HorizontalContentAlignment="Stretch" Padding="2">
<ListBox.ItemTemplate>
<DataTemplate DataType="local:ScheduledEvent">
<Grid Margin="0 5">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Margin="3 0 3 0" FontFamily="Helvetica" FontSize="18" Text="{Binding WorldRank}"/>
<TextBlock Grid.Column="1" Text="{Binding Name}"/>
<TextBlock Grid.Column="2" Text="{Binding Surname}"/>
<TextBlock Grid.Column="3" Text="{Binding Age}"/>
<TextBlock Grid.Column="4" Text="{Binding Country}"/>
<TextBlock Grid.Column="5" Text="{Binding GraduationYear}"/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Related
I have to use a list.
I'm trying to add my searched data to the view list
and it's crashing again and again.
i thing the issue is in list view
Thank you.
Error:
System.Exception: 'Catastrophic failure (Exception from HRESULT:
0x8000FFFF (E_UNEXPECTED))'
XML:
<ListView x:Name="listView" Grid.ColumnSpan="5" Grid.RowSpan="5" Grid.Row="2" HorizontalAlignment="Center" VerticalAlignment="Top" Height="421" Width="711" Margin="0,93,0,0" Grid.Column="1">
<ListView.HeaderTemplate>
<DataTemplate>
<Grid Padding="12" Background="{ThemeResource SystemBaseLowColor}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="200"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="Name" Style="{ThemeResource CaptionTextBlockStyle}"/>
<TextBlock Grid.Column="1" Text="Publisher" Style="{ThemeResource CaptionTextBlockStyle}"/>
<TextBlock Grid.Column="2" Text="PublishDate" Style="{ThemeResource CaptionTextBlockStyle}"/>
<TextBlock Grid.Column="3" Text="Quantity" Style="{ThemeResource CaptionTextBlockStyle}"/>
<TextBlock Grid.Column="4" Text="Category" Style="{ThemeResource CaptionTextBlockStyle}"/>
<TextBlock Grid.Column="5" Text="Price" Style="{ThemeResource CaptionTextBlockStyle}"/>
</Grid>
</DataTemplate>
</ListView.HeaderTemplate>
<ListView.ItemTemplate>
<DataTemplate x:Name="TableDataTemplate">
<Grid Height="48" AutomationProperties.Name="{Binding Name}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0"/>
<ColumnDefinition Width="200"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
</Grid.ColumnDefinitions>
<TextBlock x:Name="nameTbx" Grid.Column="1" VerticalAlignment="Center" Text="{Binding Name}" />
<TextBlock Grid.Column="2" VerticalAlignment="Center" Text="{Binding model.Publisher}"/>
<TextBlock Grid.Column="3" VerticalAlignment="Center" Text="{Binding model.PublishDate}"/>
<TextBlock Grid.Column="4" VerticalAlignment="Center" Text="{Binding model.Quantity}"/>
<TextBlock Grid.Column="5" VerticalAlignment="Center" Text="{Binding model.Category}"/>
<TextBlock Grid.Column="6" VerticalAlignment="Center" Text="{Binding model.Price}"/>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
c#:
{
public MainPage()
{
this.InitializeComponent();
listView.ItemsSource = BookLib.ItemCollection.Items;
}
private void searchTbx_TextChanged(object sender, TextChangedEventArgs e)
{
var match = BookLib.ItemCollection.Items.Find(x => x.Name.ToLower() == searchTbx.Text.ToLower());
if (match != null)
{
listView.Items.Add(match.Name);
}
}
please help me to slove this issue
You set the ItemsSource to BookLib.ItemCollection.Items in the constructor, means that, all the elements of BookLib.ItemCollection.Items are now items of that listView.
So, in the TextChanged event, aren't you trying to add the same Item which is already in the listView?
That's why your app is crashing.
Solution:
Remove this line from the constructor:
listView.ItemsSource = BookLib.ItemCollection.Items;
You didn't mention the ViewModel you are using for the listview. I am assuming It's like this:
public class Book
{
public string Name { get; set; }
public string Publisher { get; set; }
………
………
………
}
Then you should mention the Data type in the ItemTemplate of your listView like this:
<ListView.ItemTemplate>
<DataTemplate x:Name="TableDataTemplate" x:DataType="Book">
<Grid …………
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
this should solve your problem.
Note:
If you want to let the user search through the BookLib.ItemCollection.Items, consider using an AutoSuggestBox.
I'm new to WPF app developing and there is no such thing as RelativeLayout(Where I can arrange views relative to another view...like in Android).
My listview row Template looks like this.
Can someone help me with the code to design such template in XAML
EDIT : This is the code I've tried so far(Only for the first row i.e for name, time and date)...It doesn't seem to work.
<ListView x:Name="listView" Grid.ColumnSpan="2" HorizontalAlignment="Left" Height="752" Margin="20,282,0,0" VerticalAlignment="Top" Width="486" >
<ListView.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="5*"/>
<ColumnDefinition Width="5*"/>
<!--<ColumnDefinition Width="120"/>-->
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Grid.Column="0" Text="{Binding Name}" FontWeight="Bold" />
<TextBlock Grid.Row="0" Grid.Column="1" FlowDirection="RightToLeft" Text="{Binding Time}" FontWeight="Bold" />
<!--<TextBlock Grid.Column="1" Background="Gainsboro" FlowDirection="LeftToRight" Text="{Binding Date}" TextDecorations="Underline" Foreground="Blue" Cursor="Hand" />-->
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
The Time and Date appear beside each other. I thought using flow direction should help.
Try this :
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Grid.Column="0" Text="{Binding Name}" FontWeight="Bold" />
<TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding Time}" FontWeight="Bold" HorizontalAlignment="Right"/>
<TextBlock Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" Text="{Binding Header}" FontWeight="Bold" />
<TextBlock Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2" Text="{Binding Details}" FontWeight="Bold" />
</Grid>
</DataTemplate>
NOTE: Avoid some syntax error because I developed in notepad. It is not having any scrollbar as shown in image in your question. You can comment if any issue. You can apply text formatting and margin as per need.
I add items successfully to the listbox but instead normal space between them , they stick together. Can anyone help me solve that problem?
<ListBox Name="mylistbox" Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="2" >
<ListBox.ItemTemplate>
<DataTemplate>
<!--<StackPanel Name="s1">-->
<Grid Name="g1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10*"/>
<ColumnDefinition Width="30*"/>
<ColumnDefinition Width="30*"/>
<ColumnDefinition Width="30*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
</Grid.RowDefinitions>
<TextBlock Text="{Binding redni2}" FontSize="26" Grid.Row="0" Grid.Column="0"/>
<TextBlock Text="{Binding ime}" FontSize="26" Grid.Row="0" Grid.Column="1"/>
<TextBlock Text="{Binding broj2}" FontSize="26" Grid.Row="0" Grid.Column="2"/>
<TextBlock Text="{Binding ukupno2}" FontSize="26" Grid.Row="0" Grid.Column="3"/>
</Grid>
<!--</StackPanel>-->
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Use ListBox.ItemContainerStyle property. Try this:
<ListBox>
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,0,0,9.5">
<Grid Name="g1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="3*"/>
<ColumnDefinition Width="3*"/>
<ColumnDefinition Width="3*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
</Grid.RowDefinitions>
<TextBlock Text="111" FontSize="26" Grid.Column="0"/>
<TextBlock Text="222" FontSize="26" Grid.Column="1"/>
<TextBlock Text="333" FontSize="26" Grid.Column="2"/>
<TextBlock Text="444" FontSize="26" Grid.Column="3"/>
</Grid>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I am trying to bind Observablecollection<T> with ComboBox. ComboBox having Datatemplete
<ComboBox Width="150" Margin="20,0,0,5" Name="cbSelection" Height="20"
BorderThickness="2" BorderBrush="Black"
SelectedIndex="0" DataContext="{Binding AdComboBox}">
<ComboBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="{Binding XPath=LOC, Mode=OneWay}" Margin="5,0,5,0"/>
<TextBlock Grid.Column="1" Text="{Binding XPath=PUB, Mode=OneWay}" Margin="0,0,5,0"/>
<TextBlock Grid.Column="2" Text="{Binding XPath=EDI, Mode=OneWay}" Margin="0,0,5,0"/>
</Grid>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
but not get the data in ComboBox
what going wrong
thanks in advance
Use the ItemsSource of the ComboBox to point to the ObservableCollection<T>. Also: Use Path, not XPath which is used for binding to XML documents.
<ComboBox Width="150" Margin="20,0,0,5" Name="cbSelection" Height="20"
BorderThickness="2" BorderBrush="Black"
ItemsSource="{Binding AdComboBox}"
SelectedIndex="0">
<ComboBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0"
Text="{Binding Path=LOC, Mode=OneWay}"
Margin="5,0,5,0"/>
<TextBlock Grid.Column="1"
Text="{Binding Path=PUB, Mode=OneWay}"
Margin="0,0,5,0"/>
<TextBlock Grid.Column="2"
Text="{Binding Path=EDI, Mode=OneWay}"
Margin="0,0,5,0"/>
</Grid>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
Side note: you might want to rename the collection to something more functional instead of AdComboBox. E.g., Ads Because it is not a ComboBox but it is a collection of Ads(?)
Currently having an issue where the header of my ListView is larger than my ListView Items, so the header doesn't line up properly. I could use a margin on the header as a hack to fix it, but surely there's a proper way to fix this?
<DataTemplate x:Key="HeaderTemplate" >
<Grid Height="36" Background="#99999999" Margin="0,0,5,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="3*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="3*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock x:Uid="Name" TextWrapping="Wrap" HorizontalAlignment="Left" Text="Project" Grid.Column="0" Style="{StaticResource BodyTextBlockStyle}" />
<TextBlock x:Uid="Qty" TextWrapping="Wrap" HorizontalAlignment="Left" Text="Qty" Grid.Column="1" Style="{StaticResource BodyTextBlockStyle}" />
<TextBlock x:Uid="SubTotal" TextWrapping="Wrap" HorizontalAlignment="Left" Text="Sub Total" Grid.Column="2" Style="{StaticResource BodyTextBlockStyle}" />
<TextBlock x:Uid="Total" TextWrapping="Wrap" HorizontalAlignment="Left" Text="Total" Grid.Column="3" Style="{StaticResource BodyTextBlockStyle}" />
</Grid>
</DataTemplate>
// ...
<ListView x:Name="CartGridView" ItemsSource="{Binding CartItmes}" HeaderTemplate="{StaticResource HeaderTemplate}"
Grid.Row="1" VerticalAlignment="Stretch" Width="auto" ItemContainerStyle="{StaticResource SimpleListViewItemStyle}">
<ListView.ItemTemplate>
<DataTemplate>
<Grid Height="auto" Margin="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="3*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="3*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Style="{StaticResource BodyTextBlockStyle}" HorizontalAlignment="Left"
Text="{Binding Name, Mode=TwoWay}"/>
<TextBlock Grid.Column="1" Style="{StaticResource BodyTextBlockStyle}" HorizontalAlignment="Center"
Text="{Binding Qty, Mode=TwoWay}"/>
<TextBlock Grid.Column="2" Style="{StaticResource BodyTextBlockStyle}" HorizontalAlignment="Left"
Text="{Binding SubTotal, Mode=TwoWay}"/>
<TextBlock Grid.Column="3" Style="{StaticResource BodyTextBlockStyle}" HorizontalAlignment="Center"
Text="{Binding Total, Mode=TwoWay}"/>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Add the following to your ListView definition
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>