winphone listbox 编辑列表

实现的功能：点击 “编辑” 按钮，删除图标 “-”显示，”编辑“变为“取消”，“名称”字段向右移动适当距离；点击“-”实现删除 一行，刷新页面。点击“取消”，删除图标 “-”隐藏，”取消“变为“”编辑，“名称”字段向左移动适当距离。相关图片：设计：（下方红色框为删除图标 “-”区域，“113”为“名称”字段区域）正常状态：编辑状态：一、前台页面：页面要引用： xmlns: c4fToolkit ="clr-namespace:Coding4Fun.Phone.Controls;assembly=Coding4Fun.Phone.Controls" xmlns: c4fToolkitBinding="clr-namespace:Coding4Fun.Phone.Controls.Binding;assembly=Coding4Fun.Phone.Controls"“编辑” 按钮： < c4fToolkit: Tile Grid.Column ="2" Width ="0" Height="70" Title ="编辑" x : Name="editTxt" Click="Edit_Click" > < Image Name ="editImg" Source="/images/edit.png" Stretch ="None" Margin ="-72,0,-54,0" /> </ c4fToolkit: Tile >删除图标 “-”： < local: DeleteListBox Grid.Column="0" Visibility ="Collapsed" Name ="lb0"ScrollViewer.VerticalScrollBarVisibility="Disabled" ScrollViewer.HorizontalScrollBarVisibility ="Disabled" Margin="0,0,0,0"> < local: DeleteListBox.ItemTemplate > < DataTemplate> < Grid> < Grid.RowDefinitions> < RowDefinition Height ="40" /> </ Grid.RowDefinitions> < Grid.ColumnDefinitions> < ColumnDefinition Width ="37"/> </ Grid.ColumnDefinitions> < Image Source ="/images/delete.png" Margin="10,0,0,0" Height ="20" Width ="40" /> </ Grid> </ DataTemplate> </ local: DeleteListBox.ItemTemplate > </ local: DeleteListBox >
二、后台：
加载页面时给lb0，lb1赋值，Quote 列表实体类 ObservableCollection <Quote > quotes = new ObservableCollection< Quote >(); ObservableCollection <Quote > qs = (ObservableCollection < Quote>) JsonConvert .DeserializeObject(reader.ReadToEnd(),typeof (ObservableCollection < Quote>)); //lb0删除图标,lb1名称字段 lb1.Dispatcher.BeginInvoke(() => { lb1.ItemsSource = quotes; }); lb0.Dispatcher.BeginInvoke(() => { lb0.ItemsSource = quotes; });

/// <summary> /// 编辑，取消 事件 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void Edit_Click( object sender, RoutedEventArgs e) { //lb0删除图标,lb1名称字段 if (editTxt.Title == "编辑" ) { //删除图标 “-”,“名称”字段向左右移动适当位置 lb1.Margin = new Thickness (6, 0, 0, 0); lb0.Margin = new Thickness (0, 0, 0, -6); //删除图标 “-”显示 lb0.Visibility = Visibility .Visible; editTxt.Title = "取消" ; //按钮“编辑”变“取消” editImg.Source = new BitmapImage ( new Uri( "/Images//cancel.png", UriKind .Relative)); } else { lb1.Width = 150; //删除图标 “-”,“名称”字段向左右移动适当位置 lb1.Margin = new Thickness (-36, 0, 0, 0); lb0.Margin = new Thickness (0, 0, 0, 36); //删除图标 “-”显示 lb0.Visibility = Visibility .Collapsed; editTxt.Title = "编辑" ; //按钮“取消”变“编辑” editImg.Source = new BitmapImage ( new Uri( "/Images//edit.png", UriKind .Relative)); } }

/// <summary> /// 在此页将要在 Frame 中显示时进行调用。 /// </summary> /// <param name="e"> 描述如何访问此页的事件数据。 /// 属性通常用于配置页。 </param> protected override void OnNavigatedTo( NavigationEventArgs e) { base .OnNavigatedTo(e); try { if (NavigationContext.QueryString.Count > 0) { string m = NavigationContext.QueryString[ "m"]; //删除一行页面刷新后仍然处于编辑状态 if (m == "edit" ) { //lb0删除图标,lb1名称字段。删除图标 “-”,“名称”字段向左右移动适当位置 lb1.Margin = new Thickness (6, 0, 0, 0); lb0.Margin = new Thickness (0, 0, 0, -6); //删除图标 “-”显示 lb0.Visibility = Visibility .Visible; editTxt.Title = "取消" ; //按钮“编辑”变“取消” editImg.Source = new BitmapImage ( new Uri( "/Images//cancel.png", UriKind .Relative)); }
} } catch (Exception ex) {
} }
ListBox删除实体类： public class DeleteListBox : ListBox { public static App. GlableInfo appInfo = new App . GlableInfo(); protected override void PrepareContainerForItemOverride( DependencyObject element, object item) { base .PrepareContainerForItemOverride(element, item); //ListBox列表行的Index int index = ItemContainerGenerator.IndexFromContainer(element); ListBoxItem li = element as ListBoxItem; //给ListBox列表每行名称赋值 li.Name = (item as Quote ).Code + "|" + (item as Quote ).Name + "|" + (item as Quote ).TypeCode; //给ListBox列表按奇、偶行赋背景颜色，奇数行背景色为TransParent，偶数行为#101010 li.Background = index % 2 == 0 ? null : Utility .GetColorFromHexa( "#101010", 255); //声明ListBox列表每行的点击事件 li.Tap += new EventHandler <System.Windows.Input. GestureEventArgs>(EventHandler); }

public void EventHandler( object sender, System.Windows.Input. GestureEventArgs e) { //取ListBox列表每行名称 string [] param = (sender as ListBoxItem).Name.Split( '|' ); string currentCode = param[0].Replace(" " , "+"); string currentName = param[1].Replace(" " , "+"); string currentType = param[2]; string strMsg = string .Format( "您确认要将 {0} 从我的自选中删除吗?" , currentName); //弹出框选择是否删除此行 MessageBoxResult mbr = MessageBox .Show(strMsg, appInfo.AppName, MessageBoxButton .OKCancel); if (mbr == MessageBoxResult .OK) { //SQLite数据库中删除此行 SQLiteHelper .insertDelData(currentCode, currentType); //刷新页面,给时间参数避免页面缓存不刷新 ( Application .Current.RootVisual as PhoneApplicationFrame).Navigate( new Uri ("/diyPage.xaml?m=edit&dt=" +DateTime.Now.ToString(), UriKind .Relative)); } } }