Hi I have yet another problem with WPF controls. I have a code:
<ListBox Margin="0, 5, 0, 0" ItemsSource="{Binding mySource, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}" SelectionMode="Single">
<ListBox.ItemTemplate>
<DataTemplate>
<!-- Rabio template -->
<RadioButton GroupName="radiosGroup"
Margin="10, 2, 5, 2"
Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Path=DataContext.SelectedSetting}"
CommandParameter="{Binding SomeId, Mode=OneWay}"
Content="{Binding FileNameWithoutExtensions, Mode=OneWay}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
The problem is that when i hit RadioButton or its label it gets selected. That is fine. But ListBoxItem width is bigger than whole RadioButton hit area and when I click on the right of the control - ListBoxItem selects but its child RadioButton does not. And how to expand the RadioButton hit area?
One idea that i tried was to add a Label as the RadioButton content. It wasn't the best idea because it made my app work slow.
Try this:
<ListBox Margin="0,5,0,0" ItemsSource="{Binding mySource, Mode=OneWay,
UpdateSourceTrigger=PropertyChanged}" SelectionMode="Single"
HorizontalContentAlignment="Stretch"> <!-- New Property Added Here -->
<ListBox.ItemTemplate>
<DataTemplate>
<!-- Rabio template -->
<RadioButton GroupName="radiosGroup"
Margin="10, 2, 5, 2"
Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Path=DataContext.SelectedSetting}"
CommandParameter="{Binding SomeId, Mode=OneWay}"
Content="{Binding FileNameWithoutExtensions, Mode=OneWay}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
You said:
Unfortunatelly this does not work
Unfortunately, you are mistaken. I have simplified the example and have just tested that it works perfectly (at least in Visual Studio 2010 and .NET 4):
<ListBox ItemsSource="{Binding Collection}" HorizontalContentAlignment="Stretch">
<ListBox.ItemTemplate>
<DataTemplate>
<RadioButton GroupName="Group" Content="{Binding SomeProperty}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Just try this code out in a new project and you will see that it does work as expected. Therefore, if it does not work in your current project, then you have some other code that is somehow conflicting with this ListBox. Unfortunately, there's really nothing that I can do about that.
Related
I've got a ListView nested into another Listview. Now I want to bind an double-click event to the ListViewItems of the inner ListView
<UserControl>
<UserControl.Resources>
<DataTemplate x:Key="DefaultTemplate">
<ListView Name="jobsView" ItemsSource="{Binding jobs}" SelectedItem="{Binding Path=SelectedProduction}" >
<ListView.InputBindings>
<MouseBinding Gesture="LeftDoubleClick" Command="{Binding Path=DataContext.ItemSelectedCommand, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}" CommandParameter="{Binding ElementName=jobsView, Path=SelectedItem}" />
</ListView.InputBindings>
</ListView>
</DataTemplate>
</UserControl.Resources>
<ListView Name="weekView" ItemsSource="{Binding dayList}" ItemTemplate="{StaticResource DefaultTemplate}" >
</ListView>
</UserControl>
I created a RelayCommand called ItemSelectedCommand in my ViewModel.
public RelayCommand ItemSelectedCommand { get; private set; }
The RelayCommand is not getting triggered. I guess I'm setting the wrong RelativeSource. How would it look correct?
Where is your ListView inserted. Is there in a Visual Tree a parent with type of UserControl?
Also, what's quite good to fix Binding errors is to take a look at the Console. There should be Binding errors that might point you wherte is the mistake. Usually is writes down where it is trying to search for object and property :)
Also, I am not sure if private get; is actually allowed when binding to property.
<StackPanel Grid.Column="1">
<StackPanel.Resources>
<DataTemplate x:Key="DefaultTemplate" DataType="{x:Type sys:String}">
<StackPanel>
<TextBlock Text="{Binding .}"/>
<ListView>
<ListView.ItemsSource>
<CompositeCollection>
<sys:String>Sub Item</sys:String>
</CompositeCollection>
</ListView.ItemsSource>
<ListView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}">
<TextBlock.InputBindings>
<MouseBinding Gesture="LeftDoubleClick" Command="{Binding DataContext.RenameCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:MainWindow}}, PresentationTraceSources.TraceLevel=High}" CommandParameter="{Binding SelectedItem, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListView}}}"/>
</TextBlock.InputBindings>
</TextBlock>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackPanel>
</DataTemplate>
</StackPanel.Resources>
<ListView ItemTemplate="{StaticResource DefaultTemplate}">
<ListView.ItemsSource>
<CompositeCollection>
<sys:String> First Item</sys:String>
</CompositeCollection>
</ListView.ItemsSource>
</ListView>
</StackPanel>
Reason why it wasn't working for you is because the double Click was on an actual ListViewItem and NOT the ListView.
I have a XAML file which should make it possible to drag GridViewItems inside a GridView. Now I'm using an ItemSource for the GridView items and a DataTemplate to show them in the way I want them to be shown. That works. The following problem occured: Since I started using DataTemplate, the GridViewItems are not draggable. I can only drag the DataTemplate. That's weird, so the only part I can use to drag, is the area left and right of the GridViewItems because this is used for margin.
Why is the DataTemplate the 'draggable' control instead of the GridViewItem? I have tried numerous fixes but none seem to work out well.. I can ofcourse make it work without a DataTemplate, but it's much cleaner to use it like this.
<GridView Name="canvas" ItemsSource="{Binding GridviewItemList}" CanReorderItems="{Binding CanvasCanReorder}" CanDragItems="{Binding CanvasCanDrag}" ReorderMode="Enabled" AllowDrop="True" VerticalAlignment="Center" Width="660" Height="110" IsSwipeEnabled="False" ScrollViewer.VerticalScrollMode="Disabled" ScrollViewer.HorizontalScrollMode="Disabled">
<GridView.ItemTemplate>
<DataTemplate x:DataType="local:MainPageItems">
<GridViewItem Name="{x:Bind GvName}" Margin="13 0 15 0">
<Border Width="100" Height="100" Background="{x:Bind BdBackground, Mode=OneWay}">
<TextBlock Height="60" Width="30" FontSize="40" Text="{x:Bind TbText, Mode=TwoWay}" Margin="{x:Bind TbMargin, Mode=TwoWay}"></TextBlock>
</Border>
</GridViewItem>
</DataTemplate>
</GridView.ItemTemplate>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="DragItemsCompleted">
<core:InvokeCommandAction Command="{Binding CanvasDragCompleted}"></core:InvokeCommandAction>
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</GridView>
Thanks in advance!
When you add GridViewItem in the DataTemplate, there are two ListViewItemPresenter in one GridViewItem. Please check it in the Live Visual Tree.
In UWP apps for Windows 10, both ListViewItem and GridViewItem use ListViewItemPresenter; the GridViewItemPresenter is deprecated and you should not use it. ListViewItem and GridViewItem set different property values on ListViewItemPresenter to achieve different default looks.
For more info, please refer Item containers and templates.
If you want to set Margin to the GridViewItem, we should be able to set the GridViewItem style in the GridView.ItemContainerStyle.
For example:
<GridView Name="canvas" ItemsSource="{Binding GridviewItemList}" CanReorderItems="{Binding CanvasCanReorder}" CanDragItems="{Binding CanvasCanDrag}" ReorderMode="Enabled" AllowDrop="True" VerticalAlignment="Center" Width="660" Height="110" IsSwipeEnabled="False" ScrollViewer.VerticalScrollMode="Disabled" ScrollViewer.HorizontalScrollMode="Disabled">
<GridView.ItemTemplate>
<DataTemplate x:DataType="local:MainPageItems">
<Border Width="100" Height="100" Background="{x:Bind BdBackground, Mode=OneWay}">
<TextBlock Height="60" Width="30" FontSize="40" Text="{x:Bind TbText, Mode=TwoWay}" Margin="{x:Bind TbMargin, Mode=TwoWay}"></TextBlock>
</Border>
</DataTemplate>
</GridView.ItemTemplate>
<GridView.ItemContainerStyle>
<Style TargetType="GridViewItem">
<Setter Property="Margin" Value="13 0 15 0"/>
</Style>
</GridView.ItemContainerStyle>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="DragItemsCompleted">
<core:InvokeCommandAction Command="{Binding CanvasDragCompleted}"></core:InvokeCommandAction>
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</GridView>
I have a wpf user control which contains a Listbox which is binded to my View Model. Each Listbox item is consists of three textblock. I made the UI in a way that when user clicks on the Frist TextBlock(Title) function in my View Model will get called.
To uniquely Identify the ListBox item corresponding to which text block now got clicked. I added another property in my view model which is bindied to SelectionChanged Event in the Listbox. So whenever my TextBlock binded command get exectuted I will use my SelectionChanged Property to find which List Box Item and use its data context.
But the issue I am facing now is that when User clicks on the First textblock, selectionchanged event is not firing. When User clicks outside the First Textblock only Selection Changed event is getting fired. Which made my view model to process wrong list box items.
Following is the XAML snippet.
<ListBox ScrollViewer.CanContentScroll="False" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Auto" SelectedItem="{Binding SelectedNotificationItem}" ItemsSource="{Binding MyArray}" BorderThickness="0" Margin="0, 0, 0, 0" ItemContainerStyle="{StaticResource HoverBackgroundStyle}" Name="NotificationListBox" >
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Border BorderThickness="4,0,0,0" BorderBrush="{Binding ColorThing, Converter={StaticResource SeverityToColorConverter} }" Margin="0, 0, 0, 0">
<StackPanel Margin="8, 0" Orientation="Vertical">
<TextBlock Style="{StaticResource HoverUnderlineStyle}" FontWeight="Bold" TextTrimming="CharacterEllipsis" Name="Title" Text="{Binding Title}" TextWrapping="WrapWithOverflow" Margin="0,4,0,0" >
<TextBlock.InputBindings>
<MouseBinding MouseAction="LeftClick" Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}, Path=DataContext.ClickTitleCommand}"></MouseBinding>
</TextBlock.InputBindings>
</TextBlock>
<TextBlock FontWeight="Normal" Name="Desc" Text="{Binding Description}" TextWrapping="WrapWithOverflow">
</TextBlock>
<TextBlock FontWeight="Normal" Foreground="Gray" Name="Date" Text="{Binding CreationTime, StringFormat={}{0:ddd MM.dd.yyyy} }" Margin="0,4,0,4">
</TextBlock>
</StackPanel>
</Border>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Could you try changing your XAML to SelectedItem="{Binding SelectedNotificationItem, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
Change the ListBox into an ItemsControl and change the orientation to horizontal
I have the following ListBox. This works great and when I left click on the TextBlock it opens the recent file. However, when I right click the context menu does not open, instead it acts like a left click and the command LoadSelectedFileCommand fires, opening the recent document. Below is the ListBox XAML:
<ListBox ItemsSource="{Binding RecentFiles, NotifyOnSourceUpdated=True, IsAsync=True, Mode=TwoWay}"
ItemContainerStyle="{StaticResource MenuListBoxItem}"
VerticalAlignment="Stretch"
Grid.Row="6" >
<ListBox.ItemTemplate>
<DataTemplate DataType="{x:Type RecentObjects:RecentFile}">
<StackPanel Orientation="Horizontal">
<CheckBox IsChecked="{Binding IsPinned}"
Style="{StaticResource imageCheckBox}"
ToolTip="{Binding IsPinned, Converter={StaticResource BooleanToVariableStringConverter}}"
DataAccess:DocumentCheckBox.IsCheckedOnData="{DynamicResource Pinned}"
DataAccess:DocumentCheckBox.IsCheckedOffData="{DynamicResource UnPinned}"
AttachedCommand:CommandBehavior.Event="Click"
AttachedCommand:CommandBehavior.Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type MahAppsControls:MetroContentControl}}, Path=DataContext.UpdateRecentFilesCommand}" >
</CheckBox>
<TextBlock Text="{Binding FileName}"
Style="{StaticResource MenuTextBlock}"
ToolTip="{Binding FullFileName}"
AttachedCommand:CommandBehavior.Event="MouseDown"
AttachedCommand:CommandBehavior.Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type MahAppsControls:MetroContentControl}}, Path=DataContext.LoadSelectedFileCommand}"
AttachedCommand:CommandBehavior.CommandParameter="{Binding FullFileName}">
<TextBlock.ContextMenu>
<ContextMenu>
<MenuItem Header="Open Study" />
<MenuItem Header="Open Containing Folder" />
<MenuItem Header="Remove From List" />
</ContextMenu>
</TextBlock.ContextMenu>
</TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
My question is how can I get the context menu to fire on the right click and the command to open on the left click?
Thanks for your time.
If you only want the LoadSelectedFileCommand to run when the left mouse button is clicked you should use the UIElement.MouseLeftButtonDown Event instead.
This is a pretty easy question I think , but I can't find the answer. I have an itemtemplate defined into a datatemplate. When an item is selected, I wanna trigger a command to select the name of my element and apply it somewhere else. For the moment the MouseDown event doesn't accept my command.
<ListView Margin="4" Grid.Row="1" Grid.ColumnSpan="2" ItemsSource="{Binding Path=ExistingStateInfos, ElementName=Window}"
SelectedItem="{Binding Path=SelectedStateInfo, ElementName=Window}" x:Name="statinfoListview">
<ListView.ItemTemplate>
<DataTemplate DataType="{x:Type States:StateInfo}">
<TextBlock Text="{Binding Path=Name}" MouseDown="{x:Static MyWindow.ApplyStateInfoNameToStateCommand}" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
You can't set a command directly to an event handler.
Use EventToCommand from the MVVM LightToolkit
<DataTemplate DataType="{x:Type States:StateInfo}">
<TextBlock Text="{Binding Path=Name}">
<i:Interaction.Triggers>
<i:EventTrigger EventName="MouseDown">
<Command:EventToCommand Command="{Binding YourCommand, Mode=OneWay}" />
</i:EventTrigger>
</i:Interaction.Triggers>
</TextBlock>
</DataTemplate>
In fact ot was bulshit from me, I just add to do
<TextBlock Text="{Binding Path=Name}" MouseDown="{x:Static ApplyStateInfoNameToState_Click}" />
Sorry it's friday. Have a nice weekend :)