零元学Expression Blend 4 - Chapter 29 ListBox与Button结合运用的简单功能

简介: 原文:零元学Expression Blend 4 - Chapter 29 ListBox与Button结合运用的简单功能 本章所讲的是运用ListBox、TextBox与Button,做出简单的列表新增...
原文: 零元学Expression Blend 4 - Chapter 29 ListBox与Button结合运用的简单功能

本章所讲的是运用ListBox、TextBox与Button,做出简单的列表新增删除功能

这种功能常常在很多小地方运用到

?

好久没发文了,先祝大家新年快乐!

?

本章所讲的是运用ListBoxTextBoxButton,做出简单的列表新增删除功能

这种功能常常在很多小地方运用到

?

此为本篇范例最後的成果

很抱歉,阁下使用的浏览器并不支援 IFrame,不能正常浏览我的网页

?

OK~开始吧!

?

01

请在工作区内放入ListBox、TextBox以及两个Button,位置置於如下图

(如果对ListBox基本属性还不了解的朋友,请看此篇。)

image

?

02

接着为这四个物件命名

范例内的命名为:

ListBox=ListBox1

TextBox=TextBox1

Button=AddBtn以及DelBtn

image

?

命名完成後,请把:

(1)TextBox内的预设文字删除

(2)ListBox内置入数个ListBoxItem

(3)Button改成AddDelete

image

?

以上,前制作业大至完成了

?

03

选取已命名为Add的Button,点选Prpperties->Event会出现一长串的事件状态

找到Click後於输入栏点两下->进入MainPage.cs

image

?

把这段

   1: private void AddBtn_Click(object sender, System.Windows.RoutedEventArgs e)
   2:         {
   3:              // TODO: Add event handler implementation here.
   4:         }

?

取代成这段

   1: private void AddBtn_Click(object sender, System.Windows.RoutedEventArgs e)
   2:? 
   3: {
   4:? 
   5: ListBox1.Items.Add(TextBox1.Text);
   6:? 
   7: }

?

命名为Delete的Button也一样

把这段

   1: private void DelBtn_Click(object sender, System.Windows.RoutedEventArgs e)
   2:? 
   3: {
   4:? 
   5: // TODO: Add event handler implementation here.
   6:? 
   7: }
   8:? 

?

改成这段

   1: private void DelBtn_Click(object sender, System.Windows.RoutedEventArgs e)
   2:? 
   3: {
   4:? 
   5: ListBox1.Items.RemoveAt
   6:? 
   7: (ListBox1.Items.IndexOf(ListBox1.SelectedItem));
   8:? 
   9: }

?

04

完成後,按下F5看结果

你会发现Add跟Delete可以作用了

image

?

但是,Add过後TextBox里的文字并不会消失

我们回到MainPage.cs,加一段

把刚刚的AddBtn_Click这段,更改如下

   1: private void AddBtn_Click(object sender, System.Windows.RoutedEventArgs e)
   2:? 
   3: {
   4:? 
   5: ListBox1.Items.Add(TextBox1.Text);
   6:? 
   7: TextBox1.Text = string.Empty;
   8:? 
   9: }

?

再按F5预览一次

image

?

完成!

?

只是个很简单的分享,希望对你有帮助。

(若是想看更深入的程式教学,请到Ouch@点部落,附有影片教学)

?

?

?

附上本范例的专案

?

?

本篇的教学就到此。

?

?

(若有任何错误的地方,请各位前辈或同好能不吝指教,小女子都会虚心接受;若是你喜欢我的教学,请给我点鼓励,谢谢。)

一步一步迈向HIE之路

 

喜欢我文章请推我一下或给我个回应,你的鼓励会给我无限的动力喔!

若是您有其他问题或是特别需要,请在文章回应处留言,我会尽快回覆您

 

 

目录
相关文章
|
C#
用 Expression Blend 创建酷炫的 Button
原文:用 Expression Blend 创建酷炫的 Button 原文:Creating “Cool” Buttons with Expression Blend Author: Alex 在本文中,我们将考虑在Expression Blend用几种方法来创建酷炫的凝胶状按钮。
1137 0
零元学Expression Blend 4 - Chapter 31 看如何简单的把SampleData 绑进ListBox里
原文:零元学Expression Blend 4 - Chapter 31 看如何简单的把SampleData 绑进ListBox里 前面几章连续讲到ListBox的运用,本章要讲得是如何简单的把Samp...
1243 0
零元学Expression Blend 4 – Chapter 43 如何指定Childwindow PopUp位置
原文:零元学Expression Blend 4 – Chapter 43 如何指定Childwindow PopUp位置 有网友询问我有关Childwindow是否能指定弹出位置? 其实只...
1303 0
|
Web App开发 容器
零元学Expression Blend 4 - Chapter 8 用实例了解布局容器系列-「Grid」
原文:零元学Expression Blend 4 - Chapter 8 用实例了解布局容器系列-「Grid」 本系列将教大家以实做案例认识Blend 4 的布局容器,此章介绍的是Blend 4 里的布局容器大哥-「Grid」。
1353 0
|
容器
零元学Expression Blend 4 - Chapter 45 ListBox里的物件不能换行吗?
原文:零元学Expression Blend 4 - Chapter 45 ListBox里的物件不能换行吗? ListBox里的排列不是垂直就是水平,觉得这样的排列很枯燥乏味吗? 想要它变聪明吗? ...
1339 0
|
容器 前端开发
零元学Expression Blend 4 - Chapter 12 用实例了解布局容器系列-「Viewbox」
原文:零元学Expression Blend 4 - Chapter 12 用实例了解布局容器系列-「Viewbox」 本系列将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局容器是Blend 4 里的-「Viewbox」; 以及加码赠送安装扩充元件-「Silverlight Toolkit」。
1608 0
|
容器
零元学Expression Blend 4 - Chapter 14 用实例了解布局容器系列-「Pathlistbox」II
原文:零元学Expression Blend 4 - Chapter 14 用实例了解布局容器系列-「Pathlistbox」II 本章将延续上一章的范例,步骤解析。
1310 0
|
容器
零元学Expression Blend 4 - Chapter 13 用实例了解布局容器系列-「Pathlistbox」I
原文:零元学Expression Blend 4 - Chapter 13 用实例了解布局容器系列-「Pathlistbox」I 本系列将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布...
1315 0
|
容器
零元学Expression Blend 4 - Chapter 36 来玩捉迷藏吧!!!看看ScrollBar的Disabled与Hidden之差异
原文:零元学Expression Blend 4 - Chapter 36 来玩捉迷藏吧!!!看看ScrollBar的Disabled与Hidden之差异 本次要针对Disabled以及Hidden作讨论...
1217 0
|
容器
零元学Expression Blend 4 - Chapter 10 用实例了解布局容器系列-「StackPanel」
原文:零元学Expression Blend 4 - Chapter 10 用实例了解布局容器系列-「StackPanel」 本系列将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局容器是Blend 4 里的乖宝宝-「StackPanel」;及加码赠送「ScrollViewer」的运用。
1103 0