I have a list box in which when i long-press the particular item of the listbox, a context menu opens. But in the listbox i have not used tap or hold event of listbox so how my context menu is visible.
Please tell which event is firing which opens my context menu; the xaml code is:
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<ListBox x:Name="scheduleListbox" ItemsSource="{Binding scheduleList}" Tap="scheduleListbox_Tap">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical" Height="150" Width="460">
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu >
<toolkit:MenuItem Header="Add To Calendar" Click="AddToCalendar_Click" />
<toolkit:MenuItem Header="View Description" Click="ViewDescription_Click" />
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
<TextBlock x:Name="textBlock1" Text="{Binding ScheduleName}" Foreground="WhiteSmoke" FontSize="32"/>
<TextBlock x:Name="textBlock2" Text="{Binding ScheduleDate}" Foreground="Red" Margin="0,10,0,0"/>
<StackPanel Orientation="Horizontal" Height="70" Width="460">
<TextBlock x:Name="textBlock3" Text="{Binding StartTime}" Margin="0,5,0,0"/>
<TextBlock x:Name="textBlock4" Text="{Binding EndTime}" Margin="50,5,0,0"/>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
Please tell how my context menu is open as i haven't used tap or hold event of listbox but when I long-press the listbox item, the context menu opens?
By default, the context menu opens on long hold, it is by design. If you wish to open it any other way, you must write your own logic. For examples on how to do that, see these threads:
Setting a ContextMenu to open on “Tap” causes ContextMenu to open up at the top of the screen
ContextMenu on tap instead of tap and hold
But be aware that some users might be confused by this since most users will expect that the context menu will be shown when you tap and hold the list box item.
Related
I have a sample data bounded to the listbox datatemplate and each item has a MouseDragElementBehavior with ConstrainToParentBounds false. I want to dragging any item in the listbox to any space in the page. However, Items are still bounded to the Listbox. Any Suggestions? AllowDrop property does not work on Windows Phone.
<ListBox x:Name="countryName" HorizontalAlignment="Left" Height="361" Margin="10,10,0,0" VerticalAlignment="Top" Width="436">
<i:Interaction.Behaviors>
<el:MouseDragElementBehavior ConstrainToParentBounds="False"/>
</i:Interaction.Behaviors>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Name}">
</TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I am developing a Windows Phone 8 App in which I am using a checkbox inside a listbox along with some textblocks.
<ListBox x:Name="lstStudentSelect" ItemContainerStyle="{StaticResource ListBoxItemStyle1}" Background="Transparent" ScrollViewer.VerticalScrollBarVisibility="Visible" Height="487" BorderThickness="0" VerticalAlignment="Top" Margin="8,198,10,0">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<StackPanel Width="360" Orientation="Horizontal" HorizontalAlignment="Left">
<TextBlock Text="{Binding stunum}" Width="80" Foreground="Black" TextWrapping="Wrap" FontSize="20" VerticalAlignment="Center" />
<TextBlock Text="{Binding name}" Width="280" Foreground="Black" TextWrapping="Wrap" FontSize="20" VerticalAlignment="Center" />
</StackPanel>
<StackPanel Width="5"></StackPanel>
<StackPanel Width="150" Orientation="Horizontal" HorizontalAlignment="Right">
<CheckBox IsChecked="{Binding ChkFlag, Mode=TwoWay}" BorderBrush="#203485" Foreground="Black" BorderThickness="1" Tag="{Binding cusnum}" Name="cusCheck" Checked="cusCheck_Checked_2" Unchecked="cusCheck_Unchecked_2" ></CheckBox>
<TextBlock Text=" " TextWrapping="Wrap" Foreground="Black" FontSize="20" VerticalAlignment="Center" />
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
when I check/select on the checkbox the checkbox checked event fires, when I uncheck/unselect a checkbox the checkbox unchecked event fires.
But now my issue is :
When I am scrolling the listbox the checkbox checked and unchecked event fires automatically ?
How can I avoid this to happen ?
Your issue relates to the fact you are binding the IsChecked property and have handlers for the Checked and Unchecked events. When the binding is updated and the property changes this will cause the events to fire.
Events will fire for each item when the ItemsSource is set/loaded.
By default the ListBox uses a virtualizing container for it's item panel. This means that as you scroll items will be loaded in and out of the container and this will also trigger events as a result of the binding changing. This is why you will see more events being triggered while you scroll. (Assuming you have a sufficiently large list to require virtualization.)
Assuming that ChkFlag is a property on your ViewModel and cusCheck_Checked_2 & cusCheck_Unchecked_2 are event handlers on your view, you could make things simpler for yourself and avoid this issue by moving the logic from the event handlers into the setter for ChkFlag. (This will probably also improve ease of testability too.)
For example, you could have a property like this:
public bool ChkFlag
{
get
{
return this.chkFlagField;
}
set
{
if (this.chkFlagField != value)
{
this.chkFlagField = value;
this.RaisePropertyChanged();
if (value)
{
// perform checked action
}
else
{
// perform unchecked action
}
}
}
}
An alternative solution can be set a StackPanel as Panel.
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
I want to add the context menu to ListBox in WP7, I modify the data template as following below:
<ListBox Name="lbx1" Margin="10,0,10,0" Height="435" ItemContainerStyle="{StaticResource ListBoxItemStyle1}" FontSize="40" Tap="lbx1_Tap" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu>
<toolkit:MenuItem Header="Copy" Click="ListBoxGeneralCopy_Click"/>
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
<TextBlock Text="{Binding .}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I can only cause tap and hold event to show the contextmenu above the text, the non-text region could not cause the event, I really confused. Does someone can help me?
Your textbloc will only occupy so much space as necessary. Therefore your stackpanel will also only be as wide as necessary.
You can set the HorizontalAlignment-value of both to stretch so it occupies the whole width:
<ListBox Name="lbx1" Margin="10,0,10,0" Height="435" ItemContainerStyle="{StaticResource ListBoxItemStyle1}" FontSize="40" Tap="lbx1_Tap" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel HorizontalAlignment="Stretch">
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu>
<toolkit:MenuItem Header="Copy" Click="ListBoxGeneralCopy_Click"/>
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
<TextBlock Text="{Binding .}" HorizontalAlignment="Stretch"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Set StackPanel background property.
When background is transparent cannot work, and hold event is fired only in non-transparent region of stackpanel such as text-regions.
I have a list in which there are schedule name, date and time that are visible, but i want that on the long press of a particular item in a listbox there opens a context menu in which only description and schedule name of particular item is visible.
So my code in xaml is: first in the grid there is a listbox in which i have bound the whole list that is scheduleList ansd in the listbox.itemtemplate and inside the data templatei have binded the particular item to the textblock
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<ListBox x:Name="scheduleListbox" ItemsSource="{Binding scheduleList}" Hold="scheduleListbox_Hold" Tap="scheduleListbox_Tap" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical" Height="150" Width="460">
<TextBlock x:Name="textBlock1" Text="{Binding ScheduleName}" Foreground="WhiteSmoke" FontSize="32"/>
<TextBlock x:Name="textBlock2" Text="{Binding ScheduleDate}" Foreground="Red" Margin="0,10,0,0"/>
<StackPanel Orientation="Horizontal" Height="70" Width="460" Hold="StackPanel_Hold">
<TextBlock x:Name="textBlock3" Text="{Binding StartTime}" Margin="0,5,0,0"/>
<TextBlock x:Name="textBlock4" Text="{Binding EndTime}" Margin="50,5,0,0"/>
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu x:Name="menuItem" VerticalOffset="100.0" IsZoomEnabled="True" >
<toolkit:MenuItem Header="Add to calender" ItemsSource="{Binding ScheduleName }"/>
<!--<toolkit:MenuItem Header="Description" ItemsSource="{Binding Description}"/>-->
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
Please tell me that how to bind description and schedule name in context menu, either by code or by xaml.
How to bind data in context menu either through code or through xaml?
I create a breadcrumb context menu with binding using the code below. The code you should be interested in is the toolkit:ContextMenu.ItemTemplate section where you specify the bindings. Notice that you can also bind to a command parameter like I do with the index value.
The toolkit:ContextMenu.Template section is not needed. I added this to allow scrolling the items if there are more than will fit on the screen and also to move the menu to the bottom of the screen.
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu x:Name="breadCrumbContextMenu" ItemsSource="{Binding CloudViewModel.BreadCrumbMenuItems}" Opened="ContextMenu_Opened" Closed="Breadcrumb_ContextMenu_Closed">
<toolkit:ContextMenu.Template>
<ControlTemplate TargetType="toolkit:ContextMenu">
<Border Margin="0,700,0,0" BorderThickness="1" >
<ScrollViewer MaxHeight="700">
<ItemsPresenter/>
</ScrollViewer>
</Border>
</ControlTemplate>
</toolkit:ContextMenu.Template>
<toolkit:ContextMenu.ItemTemplate>
<DataTemplate>
<toolkit:MenuItem Click="breadcrumbMenuItem_Click" CommandParameter="{Binding Index}" Padding="0">
<toolkit:MenuItem.Header>
<StackPanel Orientation="Horizontal" Height="40">
<Image Source="{Binding Image}" Width="40" Height="40" />
<TextBlock Text="{Binding Text}" Margin="24,0,0,0" />
</StackPanel>
</toolkit:MenuItem.Header>
</toolkit:MenuItem>
</DataTemplate>
</toolkit:ContextMenu.ItemTemplate>
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
I have a listbox with context menu. How can I get value of SelectedIndex (SelectedItem) property in ContextMenuItem click event handler? Currently in events Edit_Click and Delete_CLick a value of CarsList.SelectedIndex always is -1.
Here my ListBox in XAML:
<ListBox Name="CarsList" Style="{StaticResource ListBoxStyle}" Margin="26,0,26,0" Height="380" >
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu Name="ContextMenu" >
<toolkit:MenuItem Name="Edit" Header="Edit" Click="Edit_Click"/>
<toolkit:MenuItem Name="Delete" Header="Delete" Click="Delete_Click"/>
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding CarName}" TextTrimming="WordEllipsis" Foreground="Black" FontSize="24" Width="428"/>
<TextBlock Text="{Binding VIN}" TextWrapping="Wrap" Foreground="Gray" FontSize="20" Width="428"/>
<TextBlock Text="{Binding Date}" TextWrapping="Wrap" Foreground="Gray" FontSize="20" Width="428"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Thanks.
First of all you have assigned Context Menu to ListBox control, not an each item. So, move <toolkit:ContextMenuService.ContextMenu> block to StackPanel instead.
There are several ways to get element, on which context menu click was performed:
In Click handler you have sender object (it is MenuItem, I guess)
Cast it to MenuItem and look to DataContext of it. It will be item of collection you binded to a list. So, you can find index by:
int selectedIndex = YourListBoxItemCollection.IndexOf((sender as MenuItem).DataContext)
, where YourListBoxItemCollection is what you assign to CarsList.ItemsSource
Looks like you need to use ListPicker (http://silverlight.codeplex.com/releases/view/75888) with SelectedItems.
OR
Add some flag of element selection...