I'm on a question-spree!
I want to know, when binding objects to an ItemsControl, how can I bind a textbox to LocalizedStrings using the current path in de ItemsSource?
Code will clarify, I hope:
<ItemsControl ItemsSource="{Binding Hours}" VerticalAlignment="Top">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid VerticalAlignment="Top">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="125" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="{Binding Path=LocalizedResources.DayName, Source={StaticResource LocalizedStrings}}" Style="{StaticResource App_Content_Grid_Bold}" HorizontalAlignment="Left" />
<TextBlock Grid.Column="1" Text="{Binding Description}" Style="{StaticResource App_Content_Grid_Subtle}" FontSize="20" Foreground="Black" HorizontalAlignment="Right" />
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
The problem is, DayName does not exist in LocalizedStrings but it's value does.
How can I parse it's value into this binding context before the binding itself is applied?
Something like: {Binding Path=LocalizedResources.[DayName], Source={StaticResource LocalizedStrings}}?
Related
I have three columns. I setup header of ListView to display data - its work correct. I similarly setup ListView ItemTemplate but it incorrect displays data.
<Grid>
<ListView x:Name="listView" Grid.Column="0">
<ListView.HeaderTemplate>
<DataTemplate>
<Grid Background="Gray">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock Text="Блюдо" Grid.Column="0" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18" ></TextBlock>
<TextBlock Text="Цена" Grid.Column="1" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18" ></TextBlock>
<TextBlock Text="Количество" Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18" ></TextBlock>
</Grid>
</DataTemplate>
</ListView.HeaderTemplate>
<ListView.ItemTemplate>
<DataTemplate>
<Grid >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock Text="{Binding bludo}" Grid.Column="0" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontSize="18" ></TextBlock>
<TextBlock Text="{Binding tsena}" Grid.Column="1" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontSize="18" ></TextBlock>
<TextBlock Text="{Binding kol}" Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontSize="18" ></TextBlock>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
The problem here is that in ListViewItem, it's HorizontalContentAlignment property is set to Left by default. This property indicates the horizontal alignment of the control's content. When it is set to Left, the ListViewItem's content i.e the Grid in your DataTemplate will be left aligned. So the Gird won't take the whole width of the ListView and you will see the "strange" layout like your screenshot.
To see this clearly, we can check ListViewItem styles and templates, in its default style, we can see
<Setter Property="HorizontalContentAlignment" Value="Left"/>
To fix this issue, we can set the HorizontalContentAlignment property to Stretch like:
<ListView x:Name="listView" Grid.Column="0">
<ListView.HeaderTemplate>
<DataTemplate>
<Grid Background="Gray">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Margin="7,2,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" FontSize="18" FontWeight="Bold" Text="Блюдо" />
<TextBlock Grid.Column="1" Margin="7,2,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" FontSize="18" FontWeight="Bold" Text="Цена" />
<TextBlock Grid.Column="2" Margin="7,2,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" FontSize="18" FontWeight="Bold" Text="Количество" />
</Grid>
</DataTemplate>
</ListView.HeaderTemplate>
<!-- Add this in your code -->
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>
<ListView.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Margin="7,2,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" FontSize="18" Text="{Binding bludo}" />
<TextBlock Grid.Column="1" Margin="7,2,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" FontSize="18" Text="{Binding tsena}" />
<TextBlock Grid.Column="2" Margin="7,2,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" FontSize="18" Text="{Binding kol}" />
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
i have this xaml code:
<ListView Name="MyList" ItemsSource="{Binding MyItems}"
ScrollViewer.HorizontalScrollMode="Disabled" >
<ListView.ItemTemplate>
<DataTemplate>
<Grid Width="{Binding ElementName=MyList, Path=ActualWidth}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="50"/>
</Grid.ColumnDefinitions>
<StackPanel Orientation="Vertical" Grid.Column="0" Grid.ColumnSpan="2" >
<TextBlock Text="{Binding aaa}" />
<TextBlock Text="{Binding bbb}" />
<TextBlock Text="{Binding ccc}"
TextWrapping="WrapWholeWords" TextTrimming="WordEllipsis" Height="25" MaxHeight="25" Margin="0,0,10,0" />
</StackPanel>
<TextBlock Grid.Column="1" Style="{StaticResource ListTitle}" Text="{Binding restaDaPagare}"
HorizontalAlignment="Right" Margin="0,0,10,0" />
<Canvas Grid.Column="2" Height="50" Width="50" Background="{StaticResource GrayBrush}"></Canvas>
<Image Grid.Column="2" Source="/Images/img.png"
Height="50" Width="50" MinHeight="50" MinWidth="50"/>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
For some reasons, if i use this instruction (row 5):
<Grid Width="{Binding ElementName=MyList, Path=ActualWidth}">
the first item of MyList disappears.
If i use this code:
<Grid Width="400">
everything works well... except that I don't want to use a static Width.
Thanks for any help!
You can try to not set any width for your Grid (in your template) and add this to your ListView
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>
This idea was "taken" from this question
I want something like this:
image
And I try to use ListBox:
<ListBox Name="lapsListBox">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Grid.Column="2" Margin="10,0,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="{Binding number}" />
<TextBlock Grid.Column="1" Text="{Binding time}" HorizontalAlignment="Right" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
But I can't align elements. How can I do it by another way?
Try this:
<ListBox Name="lapsListBox">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Margin="10,0,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50*" />
<ColumnDefinition Width="50*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="{Binding number}" HorizontalAlignment="Left"/>
<TextBlock Grid.Column="1" Text="{Binding time}" HorizontalAlignment="Right" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Remove the Grid.Column="2" from the Grid.
Place HorizontalAlignment of Left in the first column Textblock
I modified the Widths of the Columns to be "50%" each.
I'm trying to bind SelectedItem, which is inside another ListBox, however I get this binding error from output:
System.Windows.Data Error: BindingExpression path error: 'Time' property not found on '[23, System.Collections.Generic.List`1[MarsrutaiAPI.ArrivalTime]]' 'System.Collections.Generic.KeyValuePair`2[System.Int32,System.Collections.Generic.List`1[MarsrutaiAPI.ArrivalTime]]' (HashCode=1268928309). BindingExpression: Path='Time' DataItem='[23, System.Collections.Generic.List`1[MarsrutaiAPI.ArrivalTime]]' (HashCode=1268928309); target element is 'System.Windows.Controls.ListBox' (Name='innerList'); target property is 'SelectedItem' (type 'System.Object')..
The nested listbox is declared as such:
<ListBox ItemsSource="{Binding TimeTable}" Visibility="{Binding IsLoading, Converter={StaticResource BooleanToVisibilityNegativeConverter}}">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="70"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<TextBlock Text="{Binding Key}" Style="{StaticResource NormalText}" FontSize="42" Margin="0,0,10,0" HorizontalAlignment="Center" />
<ListBox Grid.Column="1" Name="innerList" ItemsSource="{Binding Value}" SelectedItem="{Binding Time,Mode=TwoWay}" ScrollViewer.VerticalScrollBarVisibility="Disabled">
<ListBoxItem Margin="0,0,5,5"/>
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<toolkit:WrapPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
<DataTemplate>
<Border BorderBrush="{StaticResource tekstas}" BorderThickness="1" CornerRadius="5" Margin="5" Background="{Binding IsAccessible,Converter={StaticResource IsAccessibleToColor}}">
<TextBlock Style="{StaticResource NormalText}" Text="{Binding ExpectedTime, StringFormat=\{0:mm\}}" Margin="10" HorizontalAlignment="Center"/>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Border Grid.Row="1" Grid.ColumnSpan="2" Margin="10"/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
TimeTable property:public Dictionary<int, List<ArrivalTime>> TimeTable
Time property is an object of ArrivalTime
The whole binding works perfectly, except for the SelectedItem, even though I have the required property in my VM
private ArrivalTime _time;
public ArrivalTime Time
{
get { return _time; }
set
{
_time = value;
RaisePropertyChanged("Time");
}
}
Thanks for the help :)
try this:
SelectedItem="{Binding Path=Time, RelativeSource={RelativeSource AncestorType={x:Type Grid}}}"
And if RelativeSource is not possible then name your Parent container Grid like this
<Grid Name="gridFoo" Tag={Binding} />
And
<ListBox Grid.Column="1" Name="innerList" ItemsSource="{Binding Value}" SelectedItem="{Binding Tag.Time, ElementName=gridFoo}" ScrollViewer.VerticalScrollBarVisibility="Disabled">
I am using a Listview with an Itemtemplate and a Headertemplate.
Both templates contain 6 Columns. Everything is ok if i set a fixed column width for the templates - like in figure one.
But i want to set the width to "Auto" for the items - but then i get figure 2...
How to handle this?
Is it possible to set the Header Column width with c#? - or any other solution?
Figure 1:
Figure 2:
Code Listview:
<ListView x:Name="DayanalyseListView"
HorizontalAlignment="Center"
VerticalAlignment="Top"
ItemTemplate="{StaticResource DataTemplate}"
HeaderTemplate="{StaticResource HeaderTemplate}">
</ListView>
Headertemplate:
<DataTemplate x:Key="HeaderTemplate" >
<Grid Height="36" Background="DarkGray" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="95"/>
<ColumnDefinition Width="85"/>
<ColumnDefinition Width="85"/>
<ColumnDefinition Width="85"/>
<ColumnDefinition Width="85"/>
<ColumnDefinition Width="*" MinWidth="900"/>
</Grid.ColumnDefinitions>
<TextBlock x:Uid="DayProject" TextWrapping="Wrap" Text="Project" Grid.Column="0" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" Style="{StaticResource BodyTextStyle}" />
<TextBlock x:Uid="DayTask" TextWrapping="Wrap" Text="Task" Grid.Column="1" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" Style="{StaticResource BodyTextStyle}" />
<TextBlock x:Uid="DayFrom" TextWrapping="Wrap" Text="From" Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" Style="{StaticResource BodyTextStyle}" />
<TextBlock x:Uid="DayTill" TextWrapping="Wrap" Text="Till" Grid.Column="3" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" Style="{StaticResource BodyTextStyle}" />
<TextBlock x:Uid="DaySum" TextWrapping="Wrap" Text="Sum" Grid.Column="4" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" Style="{StaticResource BodyTextStyle}" />
<TextBlock x:Uid="DayNote" TextWrapping="Wrap" Text="Note" Grid.Column="5" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" Style="{StaticResource BodyTextStyle}" />
</Grid>
</DataTemplate>
Itemtemplate:
<DataTemplate x:Key="DataTemplate">
<Grid d:DesignHeight="50" Margin="0,5,0,0" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="95"/>
<ColumnDefinition Width="85"/>
<ColumnDefinition Width="85"/>
<ColumnDefinition Width="85"/>
<ColumnDefinition Width="85"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock HorizontalAlignment="Left" TextWrapping="NoWrap" Text="{Binding ProjectName}" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource ItemTextStyle_sf}" Grid.Column="0" ToolTipService.ToolTip="{Binding ProjectName}"/>
<TextBlock HorizontalAlignment="Left" TextWrapping="NoWrap" Text="{Binding TaskName}" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource ItemTextStyle_sf}" Grid.Column="1" ToolTipService.ToolTip="{Binding TaskName}"/>
<TextBlock HorizontalAlignment="Left" TextWrapping="NoWrap" Text="{Binding StartTimeString}" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource ItemTextStyle_sf}" Grid.Column="2"/>
<TextBlock HorizontalAlignment="Left" TextWrapping="NoWrap" Text="{Binding StopTimeString}" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource ItemTextStyle_sf}" Grid.Column="3"/>
<TextBlock HorizontalAlignment="Left" TextWrapping="NoWrap" Text="{Binding Sum}" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource ItemTextStyle_sf}" Grid.Column="4"/>
<TextBlock HorizontalAlignment="Left" TextWrapping="NoWrap" Text="{Binding Note}" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource ItemTextStyle_sf}" ToolTipService.ToolTip="{Binding Note}" Grid.Column="5"/>
</Grid>
</DataTemplate>
The following works perfectly in my case:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition />
</Grid.RowDefinitions>
<Grid x:Name="ListViewHeaders" >
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="Title Col 1" />
<TextBlock Grid.Column="1" Text="Title Col 2" />
<TextBlock Grid.Column="2" Text="Title Col 3" />
<TextBlock Grid.Column="3" Text="Title Col 4" />
<TextBlock Grid.Column="4" Text="Title Col 5" />
</Grid>
<ListView x:Name="myTable" Grid.Row="1" ItemsSource="{Binding SomeCollection}" >
<ListView.ItemTemplate>
<DataTemplate>
<Grid Width="{Binding ElementName=myTable, Path=ActualWidth}" >
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="{Binding ItemProperty1}" />
<TextBlock Grid.Column="1" Text="{Binding ItemProperty2}" />
<TextBlock Grid.Column="2" Text="{Binding ItemProperty3}" />
<TextBlock Grid.Column="3" Text="{Binding ItemProperty4}" />
<TextBlock Grid.Column="4" Text="{Binding ItemProperty5}" />
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
ListView does not operate like a DataGrid. ListView only understands rows and doesn't understand columns. You can simulate columns like you are by using a Grid, but the important thing to understand is that the item and the header are two completely separate UI elements.
Meaning there is no easy to have the size of the columns in the item change the size of the columns in the header. Even if you were to name them, they are part of a template so the names won't be of any use (remember, there will be multiple items created).
I recommend you stay with fixed widths, use * widths or use an actual DataGrid control.
The following worked for me. The key was to set the HorizontalContentAlignment property to Stretch.
<ListView Grid.Row="6" Name="lvMembersSearchResults" Background="LightGray" ItemClick="lvMembersSearchResults_ItemClick" IsItemClickEnabled="True" Margin="5,5,5,5">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter>
</Style>
</ListView.ItemContainerStyle>
<ListView.Header>
<Style TargetType="ListViewHeaderItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter>
</Style>
</ListView.Header>
<ListView.HeaderTemplate>
<DataTemplate>
<Grid Height="30" Background="DarkGray">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="70"/>
<ColumnDefinition Width="50"/>
</Grid.ColumnDefinitions>
<TextBlock x:Uid="tbRank" TextWrapping="Wrap" Text="Rank" Grid.Column="0" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="ExtraBold" FontSize="18" />
<TextBlock x:Uid="tbName" TextWrapping="Wrap" Text="Name" Grid.Column="1" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="ExtraBold" FontSize="18" />
<TextBlock x:Uid="tbTaxId" TextWrapping="Wrap" Text="Tax ID" Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="ExtraBold" FontSize="18" />
<TextBlock x:Uid="tbCommand" TextWrapping="Wrap" Text="Cmd" Grid.Column="3" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="ExtraBold" FontSize="18" />
</Grid>
</DataTemplate>
</ListView.HeaderTemplate>
<ListView.ItemTemplate>
<DataTemplate>
<Grid Height="30" Background="DarkBlue">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="70"/>
<ColumnDefinition Width="50"/>
</Grid.ColumnDefinitions>
<TextBlock TextWrapping="NoWrap" Text="{Binding Rank}" Grid.Column="0" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18" />
<TextBlock TextWrapping="NoWrap" Text="{Binding Name}" Grid.Column="1" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18"/>
<TextBlock TextWrapping="NoWrap" Text="{Binding TaxId}" Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18"/>
<TextBlock TextWrapping="NoWrap" Text="{Binding Command}" Grid.Column="3" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18"/>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Adding a UserControl worked for me.
<ListView x:Name="listView" ItemsSource="{Binding SomeCollection}" >
<ListView.ItemTemplate>
<DataTemplate>
<UserControl Width="{Binding ElementName=listView, Path=ActualWidth}">
<Grid>
....
</Grid>
</UserControl>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>`
For stretching items to full ListView width try this:
<ListView>
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>
<ListView.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="80" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="{Binding Number}" />
<TextBlock Grid.Column="1" Text="{Binding Text}" />
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
You can try to create your own UserControl with properties that calculates width for each column and bind to this properties in template. May be this help.