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));
            }
        }
    }

标签