I have a simple data template for the new Windows Phone 8 LongListSelector as follows:
<DataTemplate>
<StackPanel Orientation="Horizontal" Margin="0,-6,0,-10">
<CheckBox x:Name="ToDoCheckBox" Margin="0" IsChecked="{Binding ItemIsComplete}" Checked="ToDoCheckBox_Checked"/>
<TextBlock Text="{Binding ItemName}" TextWrapping="NoWrap" Style="{StaticResource PhoneTextExtraLargeStyle}" FontSize="{StaticResource PhoneFontSizeExtraLarge}"/>
</StackPanel>
</DataTemplate>
There are suppsed to be a few more items in the template, that's why CheckBox's content property hasn't been used.
Now, I have page navigation implemented on SelectionChanged event. Problem is that, SelectionChanged even is fired even when the CheckBox is clicked. Earlier questions seem to discuss exactly opposite issue. I do not want SelectionChanged to be fired. Or, at least I don't want page to navigate on CheckBox events. I just want to have checkbox checked or unchecked event. How do I achieve that?
Selection is a bad way to trigger navigation. Without digging into that, you can avoid this by triggering the navigation when the other item in the template is tapped.
e.g.
<DataTemplate>
<StackPanel Orientation="Horizontal" Margin="0,-6,0,-10">
<CheckBox x:Name="ToDoCheckBox" Margin="0" IsChecked="{Binding ItemIsComplete}" Checked="ToDoCheckBox_Checked"/>
<TextBlock Text="{Binding ItemName}"
TextWrapping="NoWrap"
Style="{StaticResource PhoneTextExtraLargeStyle}"
FontSize="{StaticResource PhoneFontSizeExtraLarge}"
Tap="TriggerNavigationToThisItem"/>
</StackPanel>
</DataTemplate>
The above assumes you have an event called TriggerNavigationToThisItem which will trigger the navigation. You could also add a command on the Item and bind to that to trigger the navigation.
If you have a more complex template you could encapsulate them in a container (like a Grid) and then have that trigger the navigation.
You can check the original source of en every selection changed event. If it is the checkbox - simply skip execution.
Also. Don't use native "LongListSelector.Selected" property and selection event at all. It has completely no scalability (for example for multiselection). Implement it with your own Tap event handling.
Related
If I put the Column where the toolbar is hosted to be very big (800) then all the text is visible:
but if I put a smaller column this happens:
But I cannot understand why:
<DataTemplate x:Key="IconFilterButton">
<StackPanel Orientation="Horizontal">
<TextBlock
VerticalAlignment="Center"
Style="{StaticResource LargeIconStyle}"
Text="{Binding}" />
<TextBlock
Margin="6,0,0,0"
VerticalAlignment="Center"
DataContext="{Binding}"
Style="{StaticResource BodyTextStyle}"
Text="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ToggleButton}, Path=Tag}" />
</StackPanel>
</DataTemplate>
and here the definition
<ToggleButton
x:Name="DFilter"
Click="Filtering_Click"
Content=""
ContentTemplate="{StaticResource IconFilterButton}"
Tag="1d"
/>
<ToggleButton
x:Name="WFilter"
Click="Filtering_Click"
Content=""
ContentTemplate="{StaticResource IconFilterButton}"
Tag="1w"
/>
Even worst if I click on the button once they are out:
and then the text is visible but is wrong as the TextBlock is not considered in the object size:
The WPF ToolBar control uses a custom panel for the overflow Popup. In many styles, the ToolBarOverFlowPanel has a property WrapWidth set to a static value like 200. This determines how many items can be displayed before it wraps to another row in the popup.
I've created custom styling for this control and have found that the ToolBarOverFlowPanel used internally is buggy. That's probably the source of your problem.
You can re-template the ToolBar and wire-up a different value for WrapWidth to try to fix the issue, but my guess is that you'll still run into layout problems.
Otherwise, you might consider making your own replacement control.
Is there a way to fix the known bug of Selection Change Event, selecting does not work if the same item is tapped again.
to give further background, my scenario is that I have four items in my pivot page and when I click one of those items i will be navigated to another page. Now my dilemma is that when i select the same items again, navigation does not work or nothing happens.
Please let me know your suggested fix, thanks much in advance.
<ListBox x:Name="lbviewlist" ItemsSource="{Binding items}">
<i:Interaction.Triggers>
<i:EventTrigger EventName="selectionchanged">
<Command:EventToCommand Command ="{Binding ItemListCommand }" PassEventArgsToCommand="True" />
</i:EventTrigger>
</i:Interaction.Triggers>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock TextWrapping="Wrap" Text="{Binding itemName}" FontSize="30" Margin="10,0,0,0" Style="{StaticResource PhoneTextTitle2Style}" Foreground="CadetBlue"/>
<TextBlock TextWrapping="Wrap" Text="{Binding itemDescription}" FontSize="20" Margin="15,5,0,10"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
A good alternative approach is to include all of the content in each item inside a button, which is styled to be invisible so that you never see it, but it covers the surface of the item it encapsulates. If you're using MVVM you can bind the same command property to each of your 'buttons' and bind the DataContext of the button (your data item) to the command parameter. Then whenever you click an item you'll get the command firing every time.
You might want to change your items control to something simple so that the selection changed events dont get in the way.
In my wpf application when I select listboxItem, SelectionChanged event of listbox is not firing. However event fires when I click on outer margin.
have a look at below snap.
so basically, when I click on section inside Red border(Right Image), Selection change event is not firing, but when I click on outer border (White color part), selection change fires.
While searching about issue, I am not sure but I found it may be issue due to event tunneling. However I have only a bit of knowledge about tunneling yet.
So can any one please help me how this can get working so that selection change fire when I click on listboxitem (Red section)
let me if I need to further clear question.
I am also putting listbox code here
<ListBox x:Name="Listbox1" SelectionChanged="listBox1_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<ListBoxItem Margin="10" Content="{Binding Name}" Height="25"
BorderBrush="#FF404040" BorderThickness="0,0.25" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Thanks in anticipation
I can't think of a reason why you would want to have a ListBoxItem inside the DataTemplate of a ItemTemplate. The ListBoxItems are genarated automatically for each element of the ListBox and whatever you have in your DataTemplate will be used as the content of that ListBoxItem So in your case you end up having a ListBoxItem inside a ListBoxItem. This might be the cause.
Try it this way:
<ListBox x:Name="Listbox1" SelectionChanged="listBox1_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<Label Margin="10"
Content="{Binding Name}"
Height="25"
BorderBrush="#FF404040"
BorderThickness="0,0.25" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I am customizing a templated multi-selection-enabled ListBox and can't easily implement the following feature - if there is only one item selected which is also current (focused), when user navigates up or down the list the selection should follow current item. I tried to subscribe to GotFocus event of the DataTemplate's StackPanel, but apparently I don't receive those events (even though MouseEnter/MouseLeave work).
I guess I could do it by modifying a somewhat similar behavior, but isn't there an easier way? This looks like a pretty basic behavior to me...
<ListBox>
<ListBox Name="lbItems" SelectionMode="Multiple">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal"
MouseEnter="UIElement_OnMouseEnter"
MouseLeave="UIElement_OnMouseLeave"
GotFocus="UIElement_OnGotFocus">
<Rectangle Width="15" Height="15" Fill="{Binding Path=Brush}" />
<TextBlock Text="{Binding Path=Category}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I have a probably simple problem, that I just can't seem to figure out:
I've made an ItemsControl which has its datacontext set and shows the data as pairs of Checkboxes and TextBlocks:
<ItemsControl Name="listTaskTypes" Grid.Row="1" Grid.Column="2" Grid.RowSpan="2" ItemsSource="{Binding}" Margin="10,0,0,0" VerticalAlignment="Top" Loaded="listTaskTypes_Loaded">
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<CheckBox Name="checkBoxTypeId" Tag="{Binding Path=TaskTypeID}"/>
<TextBlock FontSize="11pt" FontFamily="Helvetica" Text="{Binding Path=Text}" />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
My problem is that in the Loaded event of the ItemsControl, the checkboxes do not exist yet. How can I get an event when the ItemsControl is completely loaded or is this not possible?
listTaskTypes.ItemContainerGenerator.StatusChanged event handler can give you the notification on each item created on the ItemsControl.
Yeah Loaded is just the ItemsControl loaded event, the items might not have created at that moment. Just curious as to what you are trying to achieve here?. I guess you are trying to get the instance of CheckBox in the code behind? There may be better way using binding to achieve what you are looking for.
Try the DataContextChanged event!
When the DataContext changes, the control should be Loaded, and you can be sure it has a DataContext set as well.
Hope this helps