1、首先新建一个工作页面，在工作区域内拖一个矩形，可以将矩形的样式做一些调整，在样式里面设置线条、颜色、长宽等，小编为了省事就不美化了。
2、然后在页面中拖入一个动态面板，在面板中加一个矩形，或者输入一些文字在里面，并把动态面板的名称设置一下，下面需要控制这个动态面板。
3、同样的方式，我们将矩形和动漤逗庞俄态面板复制成三份，并将动态面板的名称分别命名为卡片1、卡片2和卡片3，这个是需要控制的。这里需要注意，为了达到效果，这些元件排列要紧凑一些，有上下之分。
4、元件准备完成后，开始做对应的效果，首先需要将三个卡片动态面板载入时的事件加一下，设置为隐藏，也就是说页面载入的时候这三个卡片都是隐藏状态。
5、动态面板的属性事件设置完成后，对矩形的事件进行设置，主要设置鼠标单击时和选中改变时的事件，如图所示，选中改懈吡赜痖变时的事件，根据矩形的选中状态来改变卡片的显示隐藏效果。这里需要注意的是，为了达到效果，需要在显示和隐藏时在更多选项中选择推动元件，这样才可以有手风琴的效果。
6、同样的方式，我们将其他两个矩形的事件设置一下，可以直接复制第一矩形的事件，然后做一些调整即可。
7、所有工作完成，f5预览一下效果，点击每一个卡片，即有收缩的效果，即手风琴的效果。
