本课程学习在窗口内创建可拖拽的内容，例如使用内嵌动态面板和“拖动动态面板时”事件操作GOOGLE地图。

为内容建立“窗口”

步骤1：创建“窗口”动态面板

首先，打开DraggableMap.rp文档的Draggable Map页面。
我们不需要将地图全部显示在屏幕上，所以创建一个类似“窗口”的东西显示局部的地图。在线框图窗口选中GOOGLE地图图片，右键快捷菜单，选择“转换->转换为动态面板”。
添加新建面板标签为：MapWindow

步骤2：调整MapWindow面板大小

下一步，将MapWindow面板重新放置到白色矩形组件的上面。用控制柄调整面板大小以合适放在矩形部件中（使动态面板看起来是在上面的图片）。

步骤3：在面板状态页面修改地图位置

我们希望红色地图标识在地图可见区域的中间，所以在MapWindow面板状态页调整地图位置。
打开MapWindow面板状态1，向左上放移动地图，使地图接近动态面板中间。在动态面板虚线外的地图会看不见，但需要的就是这种效果。
返回Draggable Map页面，检查标识是否在你需要的位置。

步骤4：将地图转换为动态面板

现在，我们为地图创建“窗口”，我们要使地图可以被拖动，所以需要将地图转换为动态面板。再次打开MapWindow面板的状态1，右键图片，快捷菜单选择“转换->转换为动态面板”，再新建一个动态面板。
为新建的动态面板添加标签：MapContent1。MapContent1动态面板是嵌套在MapWindow面板中的。

步骤5：添加OnDrag（拖动动态面板时）事件移动面板动作

在MapContent面板上，添加OnDrag（拖动动态面板时）事件。在动作列表中，选择“移动面板”动作 ，并勾选配置MapContent面板。默认情况下，这个动作会在鼠标拖动时移动面板，点击确定关闭用例编辑器。

步骤6：添加复位地图的交互行为

返回Draggable Map页面，选中Reset Map链接，添加OnClick事件用例，配置“移动MapContent面板到(-530, -135)”动作。将图片移动到始终位置。
设计结束，生成原型测试效果。