Collpasing items in listbox
This sample shows how to animate the item in a listbox that is being deleted.
The sample would be lot cleaner, if Triggers , the ListBoxItem is exposed(instead of us keeping track of the items) and x:Static are supported
Note:Actual logic to delete which should be done after the animation is complete is not there
you can see a demo here and download source from here
Categories: Silverlight
Lee,
Nice sample. I have a couple of questions.
1) I have created a listbox populated from a web service connected to a database. However, I need to select (click on) an item in the listbox before I can select the button associated with it (as your ‘Delete’ button is associated with the items in your list box). How did you avoid this extra step?
2) Is it possible to hide, perhaps via the visibility or opacity properties or some other manner with which I am unaware, the ‘Delete’ button on your sample? I was thinking of hiding it until the mouse enters a listbox item, then making it visible. This, however, would require the capability to hide the button again when the mouse moves out of that listbox item.
Chris
1. you should be able to specify ClickMode=”Press” on the button
ex:
2.yes, these are the changes you need to make
1. give the Grid in DataTemplate some background
…
2.add x:Name=”btndelete” to the button, change the Button loaded handler to
private void Button_Loaded(object sender, RoutedEventArgs e)
{
Button b = (sender as Button) as Button;
Grid g = b.Parent as Grid;
b.Tag = _items.Count().ToString();
_items.Add(g);
g.MouseMove += new MouseEventHandler(g_MouseMove);
g.MouseLeave += new MouseEventHandler(g_MouseLeave);
}
and add the event handlers
void g_MouseLeave(object sender, MouseEventArgs e)
{
Grid g = (sender as Grid);
Button b = g.FindName(“btndelete”) as Button;
b.Visibility = Visibility.Collapsed;
}
void g_MouseMove(object sender, MouseEventArgs e)
{
Grid g = (sender as Grid);
Button b = g.FindName(“btndelete”) as Button;
b.Visibility = Visibility.Visible;
}
That should do it
Lee,
Your instructions were excellent. I added an event handler for MouseEnter instead of MouseMove, and I set ‘Visibility=collapsed’ for the button in page.xaml so the page would render with the buttons hidden. The buttons appear as the mouse enters the listbox item and disappears as it leaves. I will now try to accomplish this with my application.
Your example was clean and easy to follow. Thanks for posting it and thanks for your additional assistance.
Chris
you are welcome